JS Pen Test Series--basic types and operators

The development speed of the front-end technology is obvious to all, JS's ECMA standard is no longer 3 of the world, but no matter how hinting, the basic grammar still has to know the new. Whether you are beginners or many years JS programmer, you can try to do the following test questions, I believe there will always be some harvest. Because all of their own summary and hand-hit, there are mistakes in the wrong place please leave a message, thank you.

One: Examining basic data types and operators

(1)

var a;console.log (typeof a); ==>undefined

Start with one of the most common and simplest test cases, an undefined variable or an unassigned value is undefined

(2)

var a = ' 1a '; Console.log (a++); ==>nan

The + + operator will implicitly convert the a variable to the number type, and the string ' 1a ' cannot be converted to numbers as normal, so it returns Nan.

The following points can be summed up here:

1. In addition to the + operator,--, *,/,%, + + 、--will implicitly convert the variable that participates in the operation to the number type, or return Nan if it can be converted to a number normally;

2. There are several situations where the normal conversion to a number is:

A purely numeric class string such as ' 123 ', ' 1e2 ' (converted to 1*10 2 times equals 100);

The null participation operation is converted to 0 (null-4 equals -4,null+null equals 0);

A Boolean type of true and false can be converted to 1 and 0, respectively;

3. Only variables that can be converted to numbers can participate in the + + or--operations, otherwise an error will be added, such as:

Console.log (3++); ==> error, constants can not be directly calculated ++var A = 3;console.log (a++); ==>3

There is one exception: nan++ can return the result normally, still NaN

(3)

Console.log (1 '); ==> ' Console.log (2-' 1 '); ==>1console.log (1+nan); ==>nanconsole.log (' 1 ' +nan); ==> ' 1NaN '

1. The + operator is necessary to mention it separately, because except for the arithmetic operator other than +, the variable or value that participates in the operation is implicitly converted to number by default, but + because it has a significant task of string merging in JS, it has a special ' national condition ':

1.1 When the left and right sides of the + are numeric types, perform arithmetic operations, such as 1+2 return 3, NAN+1 returns NaN;

1.2 When the left and right sides of the + are string types, then a string merge is performed, such as ' 1 ' + ' 2 ' returns ' 12 ';

1.3 When the left and right side of the + is a number, a string type, the number is converted to a string and then merged, such as 1+ ' 1 ' return ' 11 ';

2. In the actual development process, we use the + operator basically to deal with string types or numeric types, so the above three scenarios can handle most development scenarios. However, when the third data type appears on the left and right side of the + operator, the situation becomes complex (the following other data types refer to types other than string and number):

2.1 Other data types + string types

Console.log (NULL+'1'); ==>'null1'Console.log (undefined+'1'); ==>'undefined1'Console.log ([1,2]+'1'); ==>'121'Console.log ((function () {})+'1'); ==>'function () {}1'Console.log (({})+'1'); ==>'[Object Object]1'

Implementation: Other data types will be converted to string and then merged, and the object type will call its own ToString () method to convert the result. In addition, the object type + operation, regardless of whether the value of another participating operation is a string type, can only be used for string merging operations, not arithmetic, as described below.

2.3 Other data types + number types

Console.log (null+1); ==>1console.log (undefined+1); ==>nanconsole.log (true+1); ==>2console.log ([1]+1); ==> ' One ' Console.log ((function () {}) +1); ==> ' function () {}1 ' Console.log ({{}) +1); ==> ' [Object object]1 '

Execution: Non-object types are arithmetic, and object-type scenarios are still string-merge operations.

2.2 Other data types + other data types

Console.log (Null+null); ==>0console.log (undefined+undefined); ==>0console.log (true+true); ==>2console.log ([1]+[2]); ==> ' Console.log (function () {}) + (function () {})); ==> ' function () {}function () {} ' Console.log ({}) + ({})); ==> ' [Object Object][object Object] '

Execution: Non-object types are arithmetic, and object-type scenarios are still string-merge operations.

So, for scenarios with other types of engagement + operations, we can summarize the final result: whenever an object type participates in a + operation, it is always a string merge, and if the Null/undefined/boolean type participates in the + operation, when the value of another participating operation is a string, The string is merged, otherwise arithmetic is performed.

Study Questions: Alert ({name:' Mofei '})

(4)

Console.log (1+ + 1); ==>2console.log (1e+1+1); ==>11

This test is still a + operation, but it is not merged with the previous test case, but comes out separately for a simple reason: this + non-+.

The + operator actually has three scenarios in JS: Converting numbers, arithmetic, and string connections. In the last test case we talked about the last two scenarios, and here is the supplement to the first scenario. It is not difficult to understand the conversion to numbers, we often use a + "to convert a variable to a string type, so we can also use the + operator to convert other types to numeric types, such as +null returns a result of 0. So in this case, 1+ +1 equals to the last, because the next +1 is actually converting 1 to number type, still 1, and 1e+1+1 equivalent to 1e1+1, which is 11.

(5)

Console.log (10/0); ==>infinityconsole.log (10%0); ==>nan

In addition to 0 returns infinity, 0 modulo (the remainder of the division operation, the 2 modulo commonly used in judging parity) return Nan.

(6)

Console.log (!! FALSE); ==>falseconsole.log (!! 4); ==>trueconsole.log (!! ') False '); ==>true

This examines the negation operator. The double negation is actually casting the operand to a Boolean, with the last one to note that ' false ' itself is a non-empty string, and converts to a Boolean value of true.

In most cases, the turn Boolean value returns true except for the following cases: false itself, NULL, nudefined, empty string ' ', number 0, number Nan

Study Questions:!! Undefined

(7)

Console.log (typeof (0)); ==>number
Console.log (typeof (NaN)); ==>numberconsole.log (typeof (' 0 ')); ==>stringconsole.log (typeof (' false ')); ==>stringconsole.log (typeof (false)); ==>booleanconsole.log (typeof (undefined)); ==>undefinedconsole.log (typeof (null)); ==>objectconsole.log (typeof ([up])); ==>objectconsole.log (typeof () (function () {})); ==>function

Here is a list of all possible values that typeof can return: Number, String, Boolean, undefined, object, function

The knowledge points that can be summed up are:

1. Any typeof with quotation marks is a string, and does not need the contents of the tube, such as do not mistakenly think typeof (' undefined ') result is undefined

2. Null, typeof array, normal object returned as Object

3. The function itself is also an object, but its typeof is returned as a special function

4. It is not possible to rely on TypeOf to make all of the variables exactly which of the 8 data types (such as arrays and ordinary objects), but can directly distinguish between four types in the basic data type: Number, String, Boolean, Undefined, If you want to differentiate all types together with other methods (such as instanceof, constructor), or use Object.prototype.toString.call (...).

(8)

Console.log (null = = undefined); ==>trueconsole.log (false = = "); ==>trueconsole.log (false = = =!true); ==>trueconsole.log ([] = = = []); ==>false

About equals operator = =: Compares the two sides for equality, this comparison is allowed for type conversion, such as 1 = = ' 1 ' will return true, as to how they do type conversion can refer to the JavaScript authoritative Guide 75 page has a very detailed description, here no longer elaborated. Strict operators are often examined in object comparisons, and we want to know that objects are compared by reference, so in this test case, they look very much like, actually two different objects (here is an array), they do not reference the same address, so it is not strict, such as the case of strict object, such as:

var a = [];var B = a;console.log (A = = B); ==>true

b variable is assigned to A,a essence is object, object assignment is reference assignment, at this time A and B common one address, so strict and so on.

In addition, there is a more classical question about = =:

Console.log ([] = =![]); ==>true

Because! Operator precedence reason, will be executed first! [], so this is equivalent to [] = false, according to common sense in the Boolean environment, the empty array is converted to true, but actually in the = = Environment, is converted to a number or a string to compare, when the operation value has a Boolean type is converted to a numeric comparison, that is [] Converts the number type to 0,false to number type 0, so the result returns true. It seems that these tedious conversions are worrying, but not really so bad, after all, this seemingly "non-human" result in the actual development scenario rarely encountered, when you have some experience, the vast majority of loose equal results you can still see through.

(9)

Console.log (1&&2); ==>2console.log (1| | 2); ==>1console.log (1&&a=2); ==>errorconsole.log (1&& (a=2)); ==>2

About && | | Two operators, also a regular in the written test. Here are a few things to note:

1. && | | Returns the value of the expression, not true or false

2. Left-to-right execution,&& the expression on the left of the return value if the conversion Boolean is true, the expression on the right is executed; | | The expression on the left returns the value if the converted Boolean is true, returns the expression return value directly and no longer executes the right-hand expression

With the above two points, the first two tests are relatively easy to understand, and for 1&&a=2, the actual equivalent to-(1&&a) =2--undefined=2, execution will be error, as long as the a=2 with parentheses priority execution can be normal operation, where a= The return value of 2 is 2, so the value of the final expression is 2.

　

JS Pen Test Series--basic types and operators