JAVASCRIPT Flashcards
Who originally developed JS?
Branden Eich.
What was JS originally called?
LiveScript
When was JS named JS? Why then?
LiveScript was renamed JavaScript in 1995, as it became a joint venture of Netscape and Sun.
Who standardized JS as ECMA-262?
The European Computer Manufacturers Association.
Is JS statically or dynamically typed?
Dynamically.
JS is solely a client side language.
False - it may be used server side as well.
Is JS case sensitive?
Yes.
What’s a synonym for dynamic typing?
Loose typing.
What is the root object in JS?
Object
What type of inheritance does JS exhibit?
Prototypal inheritance.
Is there polymorphism in JS?
No.
A web server is needed for JS.
False.
Write the html to import an external script.js file.
How can JS code be embedded into html?
<script> ... </script>
What are the ways to write comments in JS?
// …
/* … */
What JS object provides functions such as floor, round, max, min, etc?
Math
What are the 5 JS primitive types?
Number, String, Boolean, Undefined and Null.
Do the null type and the undefined type have several possible values?
No.
What is returned by an arithmetic operation that creates overflow?
NaN
What does (NaN == NaN) return?
False.
How should you check for NaN values?
isNaN(x)
What are the 4 ways of declaring a JS variable?
using var, let, const, or using nothing.
What operator coerces strings into numbers, and numbers into strings depending on the context?
+
List 2 ways of explicitly converting a number into a string.
Using the String constructor, or using a number’s toString() method.
List 2 ways of explicitly converting a string to a number.
Using the Number constructor, or using parseInt() / parseFloat() functions.
What does the following print?
console.log(1 + 2 + “bird”);
3bird
When does the + operator execute numeric addition, rather than concatenation?
Only when both operands are numbers.
What is the result of ‘$’ + 3 + 4 ?
$34
(left to right execution)
When does < or > execute a number comparison?
When both operands are numbers, or if one is a number and the other can be converted to a number.
When is the result of a < or > comparison always false?
When one operand is a number, the other isn’t and can’t be converted to a number.
What is the result of “11” < “2”?
True, because a string comparison is performed if both operands are strings.
What is the result of the following?
11 < 2+ “birds”
False, since the RHS becomes “2birds” which can’t be converted to a number in JS.
What is the result of the following?
‘$’ + 3 < 4
False - can’t convert ‘$3’ to a number.
When is * a number multiply?
If both operands are numbers, or both can be converted to a
number.
What is the result of a multiplication (*) wherein one of the operands cannot be converted to a number?
NaN
What is the result of the following?
‘$’*3 < 4
False.
Is there a character type in JS?
No.
How many bits are each character in a JS string?
16
How can characters be represented in JS?
As strings with a length of 1.
Are strings immutable in JS?
Yes.
The == operator can be used to check for value equality between 2 strings in JS.
True.
Do string literals use single or double quotes in JS?
Either.
How can you obtain the length of a string object?
str.length
What is the difference between ‘String(val)’ and new ‘String(val)’ ?
String(val) returns a string,
new String(val) returns an object.
What does the following code print?
var a = “123”;
var b = “123”;
document.write(a==b);
true
What method can return the character at a specified index, x, of a string, str?
str.charAt(x)
What method (not operator) can join two strings, s1 & s2, into a single string?
s1.concat(s2)
What method returns the index position of some character/substring str2 within str1?
str1.indexOf(str2)
What method returns the index position of some character/substring str2 within str1, and searches right to left?
str1.lastIndexOf(str2)
What method compiles all instances of a string (or regex), x, found within a string str, into an array it then returns?
str.match(x)
What method can replace all instances of str2 with str3, within str1?
str1.replace(str2, str3)
Does .replace() change the original string?
No, it returns a new one with the changes made.
What does the str.search(x) method do?
It returns the index (position) of the first match of x within str.
What does .search() return if no matches are found?
.search() returns -1.
What JS method returns a substring of str, between indices i1 and up to (but not including) i2?
str.slice(i1, i2)
What does str.split(“,”) do?
It splits str at its commas and returns an array of the resulting substrings.
What method behaves almost exactly str.slice(i1, i2)?
.substring()
Do the JS methods str.toUpperCase() and str.toLowerCase() put all characters of str to upper/lower case, or only the first?
All.
In JS, what non-Boolean equate to Boolean false? (6)
0, -0, “”, NaN, undefined, null.
In JS, “0” equates to what Boolean value?
True.
How can you explicitly convert a non Boolean to a Boolean value?
Boolean(val)
What does the following return?
Boolean(“false”);
true
What does the JS Date object’s .getTime() method return?
The number of milliseconds since January 1, 1970.
What JS object represents the model for the browser’s display window?
The Window object.
What’s the difference between the JS alert(msg) and confirm(msg) functions?
The confirm popup has an additional “cancel” button.
What does the JS prompt() function do?
Creates a popup window capable of accepting input.
What is the purpose of the optional second parameter of the prompt() method?
The optional second parameter specifies the default text within the input section of the popup.
What’s the difference between == / != and === / !== ?
=== / !== don’t do type coercion.
what does “123” == “123” return?
true
What does (3 !== “3”) return?
true
What is the output of the following?
var a = new String(“123”);
var b = new String(“123”);
document.write(a==b);
false, due to the (double) use of the new operator.
What is the output of the following?
var a = String(“123”);
var b = new String(“123”);
document.write(a==b);
true
&& and || always return Boolean values.
False - && returns the second operand if the first is truthy (else it returns the first) and || returns the first operand if it is truthy (else it returns the second).
! always returns a Boolean value.
True.
Explicitly convert a value to true or false without using Boolean(val).
!!val
How many bitwise operators are there in JS? List them.
6 - &, |, ~, ^, «,»_space;
What does the & operator do?
& ANDs the binary representations of its operands.
What does the | operator do?
It ORs the binary representations of its operands.
ORs
What does the ~ operator do?
It negates (flips) the binary representation of its operand.
What does the ^ operator do?
It XORs the binary representations of its operands.
What does the «_space;operator do?
It bit-shifts the binary representation of its first operand by n bits to the left, where n is the second operand.
What does the»_space; operator do?
It bit-shifts the binary representation of its first operand by n bits to the right, where n is the second operand.
The default case must be the last case in a JS switch block.
False.
Along with while and for loops, do-while loops also exist in JS.
True.
When was the let keyword introduced?
In 2015.
Can variables defined with let be redeclared?
No.
Can variables defined with let be used before declaration?
No.
What is the scope of a variable defined with let?
Variables defined with let have block scope.
Can variables defined with var be redeclared?
Yes.
Can variables defined with var be used before declaration?
Yes.
What is the scope of variables defined with const?
Variables defined with const have block scope.
What is the scope of variables declared with var?
Either the enclosing function and functions declared within it, or global if declared outside any function.
Variables with const cannot be redefined, but they can be redeclared.
False - they also can’t be redeclared.
What is the scope of variables defined with const?
Variables defined with const have block scope.
What is the output of the following code?
var name = “APPLE”;
{ var name = “BANANA”;
console.log(name); }
console.log(name);
BANANA
APPLE
What will be the value of a variable used prior to declaration?
Undefined.
What will happen if I remove the second line?
alert(“0-“+scope);
var scope = “global”;
An error is produced.
What will be the output of the following?
console.log(x);
var x = “APPLE”;
function checkloc() {
console.log(x);
var x;
}
checkloc();
undefined
undefined
What will be the output of the following?
console.log(x);
var x = “APPLE”;
function checkloc() {
var x;
console.log(x);
}
checkloc();
undefined
undefined
What will be the output of the following?
console.log(x);
var x = “APPLE”;
function checkloc() {
console.log(x);
}
checkloc();
undefined
APPLE
What is the output of the following?
checkloc();
console.log(x);
function checkloc() {
x = “APPLE”;
console.log(x);
}
APPLE
APPLE
(so long as the function is called first, x becomes global)
What is the output of the following?
checkloc();
console.log(x);
function checkloc() {
var x = “APPLE”;
console.log(x);
}
Error!
What is the least ambiguous way of accessing a global variable, x, from within a function definition?
window.x
The following is valid JS code:
const PI;
False, const variables must be assigned a value at
declaration.
Create a new object, C1, and give it two attributes, a1 & a2.
var C1 = new Object();
C1.a1 = “A”;
C1.a2 = “B”;
How would delete an attribute, a1, from an object C1?
delete C1.a1;
Can object properties can be accessed using array notation?
ex. var p1Copy = myObject[“p1”];
Yes.
Create a new object, C1, and give it two attributes, a1 & a2, using the JSON way.
var C1 = { a1: “A”, a2: “B” };
Can you use const to declare objects?
Yes.
Can you change/add properties to objects declared with const?
Yes - you just can’t reassign the name being used for that object.
Write a loop that would allow you to traverse the properties of an object, C1.
for (var prop in C1) { … }
Write a conditional statement that checks for the existence of property a1 in object C1.
‘a1’ in C1
What does the instanceof operator do?
Returns true if the LHS variable holds an instance of the a specific object class, which is specified by the constructor for that class on the RHS.
What is the output of the following?
var myCar = {make:”ford”, model: “Contour SVT”};
console.log(myCar instanceof myCar);
ERROR - the RHS “myCar” is an instance, not the name of a defined class.
You can’t add/change elements of an array declared with const.
False - you simply can’t reassign the name used for it.
What is the output of the following?
var s1 = new String(“A”);
var s2 = “A”;
console.log(s1 instanceof String);
console.log(s2 instanceof String);
true
false
(Strings are necessarily objects)
What is the output of the following?
var l1 = new Array(1, 2, 3);
var l2 = [1, 2, 3];
console.log(l1 instanceof Array);
console.log(l2 instanceof Array);
true
true
(Arrays are necessarily objects)
What is returned by a function with no ‘return’?
undefined
Are functions objects in JS?
Yes.
What is returned by a function with ‘return’, but no return parameter.
undefined
Missing/excess function parameters cause JS to crash.
False - missing parameters are given the value ‘undefined’ and excess parameters may simply be ignored.
Can functions be passed as parameters in JS?
Yes.
Will arr.sort(f) sort arr (an array of numbers) in increasing or decreasing order?
function f(a, b) {
return a - b;
}
Increasing order.
Does the default sort() (no parameters) work on arrays of numbers/strings?
Strings, yes, but not numbers.
A function passed as parameter to sort will either return a number less than, equal to, or greater than 0. How are the two parameters to the passed function, a & b treated depending on the outcome?
If a number less than 0 is returned, a is sorted to a lower index than b. If 0 is returned, a and b are considered equal. If a number greater than 0 is returned, a is sorted to a higher index than b.
Define a constructor for an object, C1, which has 2 attributes, a1 & a2.
function C1(a1, a2) {
this.a1 = a1;
this.a2 = a2;
}
Write a function that writes the attributes, a1 & a2, of an object C1 to the html document.
function displayC1() {
document.write(this.a1, this.a2);
}
How can you make changes to the template of an object?
Using Object.prototype
Do changes to Object.prototype affect all instances of that object?
Yes.
Can you put functions into an object’s prototype?
Yes.
In JS, prototypes are used to build longer chains of …?
Inheritance.
new RegExp() is a valid built-in JS constructor.
True.
new Function() is a valid built-in JS constructor.
True.
Can you define JS classes … SLIDE 30, 4.4
When defining a class in the following format (in JS), how would you define the constructor?
class C1 { … }
constructor(a1, a2) {
this.a1 = a1;
this.a2 = a2;
}
Assume class C1 { … } has been defined with 2 string attributes, a1 & a2. How would you then create an instance of it?
const c1 = new C1(“hi”, “bye”);
What are the 2 primary pattern matching methods, and what do they return?
str.search(reg) which returns the index of the matching string (or -1) and str.match(reg) which returns the matching string (or an array of matches).
When does .match() return an array, rather than a string?
When the passed pattern has the global flag ‘/g’.
Can we return all substrings that match a specified regex, without including the global flag in that regex?
Yes, using the .matchAll() method rather than .match().
(this returns an iterator, and not an array)
How many matches does the following return?
‘abc’.match(/[abc]/g);
3
How many matches does the following return?
‘abc’.match(/[a-b]/g);
2
How many matches does the following return?
‘abc’.match(/abc/g);
1
How many matches does the following return?
‘abc’.match(/[^abc]/g);
0
(^ is negation within [brackets])
How many matches does the following return?
‘abc’.match(/^[abc]/g);
1
(^ implies left-end search outside [brackets])
What will the following regex match agaisnt?
/./
Any single character, except newline or line terminator.
Write the the long form of the following regex.
/\d/
/[0-9]/
Write the the long form of the following regex.
/\D/
/[^0-9]/
Write the the long form of the following regex.
/\w/
/[A-Za-z_0-9]/
(underscores are also valid)
Write the the long form of the following regex.
/\W/
/[^A-Za-z_0-9]/
Write the the long form of the following regex.
/\s/
/[ \r\t\n\f]/
(any 1 of 5 possible whitespace characters)
Write the the long form of the following regex.
/\S/
/[^ \r\t\n\f]/
What does the following regex quantifier do?
{4}
Exactly 4 repetitions of the previous character.
What does the following regex quantifier do?
{4,}
At least 4 repetitions of the previous character.
What does the following regex quantifier do?
{4, 6}
At least 4 (but no more than 6) repetitions of the previous character.
Will the following return a match?
‘aaaa’.match(/a{2,3}/);
Yes - aaa
Will the following return a match?
‘aaaa’.match(/a{2,}/);
Yes - aaaa
What’s the difference between the following regex quantifiers?
*, +, ?
- is zero or more repetitions,
+ is one or more repetitions,
? is zero or one repetitions.
What are the two regex anchors?
^ and $
How many matches does the following return?
‘abc’.match(/[abc]$/g);
1
How many matches does the following return?
‘abc’.match(/^[abc]$/g);
0
(just ‘a’/’b’/’c’ would’ve returned 1 match)
What value does the following return?
‘abc abc’.search(/[^abc]/)
3
What are the 3 common pattern modifiers?
i, g, m.
What does the i regex modifier do?
i ignores the case of letters.
What does the g regex modifier do?
Returns all matches, instead of just the first.
What does the m regex modifier do?
Regex applies to mulitple lines.
How do the ^ and $ anchors behave in multiline mode? (m)
^ matches beginning of line or beginning of string, and $ matches end of line or end of string.
What method allows me to replace instances of a regex (reg) match in a string, str1, with a new string, str2.
str1.replace(reg, str2);
(also accepts strings in place of the regex).
What method returns a string, str1, as an array split at a specified regex, reg?
str1.split(reg);
(also accepts strings, and an optional second parameter to limit the length of the array).
5.1 slide 1
ok
How many versions of DOM is there?
4 (DOM 0 - DOM 3)
When was the latest DOM standard (DOM 3) approved?
2004
What does DOM stand for?
Document Object Model
JS’s Window object has what property?
document - a reference to the Document object that the window displays.
document.forms[0].elements[0] is a valid way of accessing the first element of the html document’s first form.
True - although it is better to use the name attribute.
What form element(s) have an implicit array?
Checkboxes and radio buttons.
What name is given to the process of connecting an event handler to an event?
Registration
Event handlers can only be assigned directly in the html as an attribute.
False - you may also assign the handler as a property in JS.
What are the 3 ways in which an HTML element can get focus?
When the user clicks on it, when the user tabs to it, or when it is the target of the focus() method.
When is the ‘load’ event triggered?
When the loading of a document is completed.
What is a disadvantage of registering handlers in JS?
There is no way to use parameters.
What are 2 advantages to registering handlers in JS?
It is good to keep HTML and JS separate, and the handler could be changed during use.
What are the 6 possible values of position?
absolute, relative, static, fixed, inherit and sticky.
What is the default value of the position property?
static
Are statically positioned elements affected by the top/bottom/left/right properties?
No.
How do relatively positioned elements behave?
They are positioned relative to their normal position using the top/right/bottom/left properties.
How do fixed positioned elements behave?
They are positioned relative to the viewport (they don’t move when scrolling) using the top/bottom/left/right properties.
How do absolutely positioned elements behave?
They are positioned relative to the nearest positioned ancestor (ancestor that is positioned relatively) using the top/bottom/left/right properties.
How do sticky positioned elements behave?
These toggle between relative and fixed, depending on the scroll position.
Which position value results in an element that can’t be moved using JS?
Static.
Is space on the page still taken up by an element who’s visibility property is set to “hidden”?
Yes.
What’s the default value of the visibility property?
visible
How could you make an element invisible and not take any space? (as if it weren’t there)
Set it’s display property to none.
Write the code to change a link’s colour once the moues hovers over it (the colour must not change back). Use an event.
onmouseover = “this.style.color = ‘blue’;”
What JS property is associated with the CSS z-index?
zIndex
What properties of an event object give the coordinates of the element that caused that event?
clientX/clientY or screenX/screenY
The clientX & clientY properties are relative to what?
The upper left corner of the client (browser) area.
The screenX & screenY properties are relative to what?
To the upper left corner of the user’s screen (monitor).
What 2 window object methods all us to animate objects in JS?
setTimeout and setInterval
What does JS’s “static scoping” entail?
Inner functions have access to the variables/parameters of its outer functions.
What does JS’s “closure” entail?
The scope that an inner function enjoys continues even after the parent functions have returned.
What is the canvas element in html? (as of HTML5)
It creates a rectangle into which bit-mapped graphics can be drawn using JavaScript.
What does the navigator give you access to? (As of HTML5)
Browser information, such as language, userAgent, cookieEnabled, appVersion, appName.
What makes a webpage dynamic?
Client side scripting & server side scripting (which generates content before sending it to the client).
When is ‘value’ used over ‘innerHTML’?
For form elements.
What does .innerHTML return?
The child elements/text of the calling object.
What are the 3 phases of the DOM2 event model?
(1) Capture phase
(2) Target phase
(3) Bubbling phase
