I have been working on the front end for three years, and I have watched elevation 3 for two or three times, but I still can’t remember the basic things clearly. I have to spend some time summarizing the key knowledge points that ARE easy to forget.

A, grammar,

1. Case sensitive

Unlike HTML, variables, function names, operators, and everything else in ECMAScript are case sensitive.

var test = 1;
var Test = 2;
console.log(test, Test);    / / 1. 2
Copy the code

2. The identifier

An identifier is the name of a variable, function, function parameter, or attribute. The first character of an ES identifier can be a $(dollar sign), an _ (underscore), a letter, and optionally a number. Variables are named with a small hump (testName) and constructors with a large hump (TestPerson) by default.

Second, the variable

ES variables are loosely typed and can be used to hold any type of data or, after being initialized to one type of data, changed to another type.

var msg = 'This is a test message';
console.log(typeof msg);    // string

msg = 123;
console.log(typeof msg);    //number
Copy the code

As above with var operator defines the variables and back and change the type of the variable’s value, although it is effective in ES in order to develop good coding habits, when defining a variable for the types of variables may, lest again after change the variable’s value types do too much type checking or other accident.

Data types

1. Classification of data types

ES has five simple data types: Undefined, Null, Boolean, String, Number, and a complex data type: Object. The typeof operator can be used to detect the data typeof a given variable. Using the typeof operator for each variable may return the following string:

  • ‘undefined’- if the value is undefined (it is generally not necessary to display a variable as undefined);
  • ‘Boolean ‘- if the value is Boolean;
  • ‘string’– if the value is a string;
  • ‘number’- if the value is numeric;
  • ‘object’– if the value is an object or NULL (often null is displayed for a variable, indicating that it is declared and not assigned);
  • ‘function’- if the value is a function.

2.Undefined and Null

The Undefined type has only one Undefined value, which means that a variable is defined without an assignment, but we can also display the assignment as Undefined, but it is not necessary.

There is a difference between unassigned and undefined. Operating on an undefined variable will report an error, with the exception of returning undefined when using the Typeof operator to detect an undefined variable.

var cat;

console.log(cat);   // undefined
console.log(fox);   // Uncaught ReferenceError: fox is not defined

console.log(typeof cat);    // undefined
console.log(typeof fox);    // undefined
Copy the code

The Null type also has only one value, Null, which represents an empty object pointer. It is often used to define a variable that will later hold an object. Therefore, the typeof operator detects that the result is object.

var timer = null;
console.log(typeof timer);  // object
Copy the code

Undefined is derived from null, but its use is slightly different. Equality is detected with equality (the comparison operator converts data types).

console.log(null= =undefined);     // true
console.log(null= =' ');     // false
console.log(null= =0);     // false
console.log(undefined= =' ');     // false
console.log(undefined= =0);     // false
Copy the code

3. The Boolean type

Boolean literals true and false are case sensitive. True and False are not Boolean, just identifiers. The Boolean function can be called on any value of the data type and returns a Boolean value as follows:

The data type Conversion to true Conversion to false
Boolean true false
String Non-empty strings (including ‘ ‘) Empty string (”)
Number Any non-zero string (including infinity) 0 and NaN
Object Any object Null
Undefined N/A (not applicable) Not applicable undefined 
console.log(Boolean(true), Boolean(false));   // true false
console.log(Boolean('123'), Boolean(' '));     // true false
console.log(Boolean(Infinity), Boolean(NaN), Boolean(0));// true false false
console.log(Boolean(null), Boolean({}));      // false true
console.log(Boolean(undefined));       // false
Copy the code

Two logical non-operators (!!) can have the same effect. .

The data type Conversion to true Conversion to false
Boolean true false
String Non-empty strings (including ‘ ‘) Empty string (”)
Number Any non-zero string (including infinity) 0 and NaN
Object Any object Null
Undefined N/A (not applicable) Not applicable undefined 
console.log(!!true,!!!!!false);   // true false
console.log(!!'123',!!!!!' ');     // true false
console.log(!!Infinity,!!!!!NaN,!!!!!0);    // true false false
console.log(!!null,!!!!! {});// false true
console.log(!!undefined);       // false
Copy the code

4. The Number/type

4.1 Numeric literal base system

The most common numeric literals are decimal, and integers are also in octal and hexadecimal formats.

The first digit of octal is 0, and the sequence of digits is (0 to 7). The presence of digits greater than 7 is treated as a decimal format, but octal is invalid in strict mode and will cause an error in the browser.

The hexadecimal number is preceded by 0x and can be followed by any hexadecimal number (0, 9, a and f are case insensitive).

All octal and hexadecimal numbers are converted to decimal numbers during arithmetic calculations.

4.2 floating point number

A floating-point number must contain a decimal point followed by at least one digit. If the decimal point is preceded by a 0, you can omit it, but this is not recommended. Scientific notation (e notation) can be used for maximum and minimum values.

console.log(3e-8);  // 3e-8
console.log(3e-8= =0.00000003);    // true
console.log(3e8);   / / 300000000
Copy the code

Due to a problem with the IEEE Binary Floating-point arithmetic Standard (IEEE 754), floating-point numbers are not nearly as high as integers when performing arithmetic calculations. Floating-point numbers can be evaluated with up to 17 decimal places of accuracy, as shown in the example below.

var a = 0.1, b = 0.2;
var c = a + b;
if (c === 0.3) {
    console.log('right');
} else {
    console.log('wrong');   // wrong
}
console.log(c);     / / 0.30000000000000004
Copy the code

4.3 Numerical range

ES holds a finite number of values due to memory limitations. The maximum and minimum values for ES are number. MAX_VALUE and number.min_value, respectively. If you go beyond that, positive numbers are Infinite, negative numbers are -infinite. As follows:

console.log(Number.MAX_VALUE);  / / 1.7976931348623157 e+308
console.log(Number.MIN_VALUE);  // 5e-324
console.log(isFinite(Number.MAX_VALUE + Number.MAX_VALUE)); // false
console.log(isFinite(Number.MIN_VALUE + Number.MAX_VALUE)); // true
Copy the code

When examining a number using isFinite(), return true between the maximum and minimum values, and false otherwise.

4.4 NaN

NaN (Not a Number) is non-numeric, used when an operand intended to return a value does Not return a value.

Feature: Any operation involving NaN returns NaN. NaN is not equal to any value, including itself. You can check if a value is a number with the isNaN() function, which attempts to convert the value to a number after receiving an argument.

console.log(isNaN(NaN));    // true
console.log(isNaN(10));     // false
console.log(isNaN('10'));   // false
console.log(isNaN(' '));     // false
console.log(isNaN(' '));    // false
console.log(isNaN('abc'));  // true
console.log(isNaN(true));   // false
Copy the code

4.5 Numerical Conversion

There are three functions to convert non-numeric values to numeric values, Number() — can be used for any data type, and parseInt() and parseFloat() are specifically used to convert strings to numeric values.

Number()

The conversion rules are as follows:

  • If Boolean, true and false are converted to 1 and 0, respectively;
  • Numeric values simply return the original value;
  • Null returns 0;
  • Undefined returns NaN;
  • String:

If the string contains only numbers (including floating-point numbers), the valid hexadecimal format is converted to the corresponding decimal value. The empty string is converted to 0. Contains characters other than those in the above format, converted to NaN.

  • If it is an object, call the valueOf() method of the object first and convert it to a value as described above. If the result of the conversion is NaN, the object’s toString() method is called and converted to a value as described above.
console.log(Number(true), Number(false));   / / 1 0
console.log(Number(null));      / / 0
console.log(Number(undefined));     // NaN
console.log(Number('123'), Number('3.14'), Number('0xf'));  / / 3.14 15, 123
console.log(Number(' '), Number(' '), Number('123abc'));     // 0 0 NaN
console.log(Number(new Date()));    / / 1589608133573

var obj = {
    a: '138'.b: '158'.valueOf: function () {
        return this.a; }}var obj2 = {
    a: '138'.b: '158'.toString: function () {
        return this.b; }}console.log(Number(obj));   / / 138
console.log(Number(obj2));  / / 158
Copy the code
parseInt()

The parseInt() function handles integers to see if the string conforms to the numerical pattern.

  • The preceding whitespace is ignored until the first non-whitespace character is found;
  • If the first character is not a number or +, -, NaN is returned;
  • If the first character is a numeric value, then the second character is parsed until either the first character is parsed or a non-character is encountered.
  • An empty string returns NaN;
console.log(parseInt('abc'));   // NaN
console.log(parseInt(' 123abc'));   / / 123
console.log(parseInt(' +123456'));  / / 123456
console.log(parseInt('138'));     / / - 138
console.log(parseInt(' '), parseInt(' '));    // NaN NaN
console.log(parseInt('0567')); // 567 (ES3 considers octal, ES5 considers decimal)
console.log(parseInt('0xabc'));     / / 2748
Copy the code

We can pass a second argument to the parseInt() function to provide the cardinality to use for the conversion.

console.log(parseInt('10'.2));  / / 2
console.log(parseInt('10'.8));  / / 8
console.log(parseInt('10'));    / / 10
console.log(parseInt('10'.10)); / / 10
console.log(parseInt('10'.16)); / / 16
Copy the code
parseFloat()

ParseFloat () parsing is quite similar to parseInt(), but there are differences. The differences are as follows:

  • An invalid floating-point is encountered, i.e. the first decimal point is valid.
  • The leading 0 is always ignored, that is, octal and hexadecimal values are not parsed — 0 is always returned;
  • No second argument as cardinality;
  • Returns an integer with no decimal (parsed as integer) or 0 after the decimal point;
console.log(parseFloat('123.456.789'));     / / 123.456
console.log(parseFloat('0789'),parseFloat('0xabc'));  / / 789
console.log(parseFloat('10'.16));   / / 10
console.log(parseFloat('123.000')); / / 123
Copy the code

5. Type String

The String type represents a sequence of zero or more 16-bit Unicode characters. Strings in ES are immutable. To change the string held by a variable, the original string is destroyed and the variable is filled with another string containing the new value.

Convert to string

To convert a value to a string, there are two ways:

The toString method

Almost every value has a toString method. Numeric values, booleans, objects, and strings (which return a copy of the string) all have a toString method to return the corresponding value string representation.

let num = 16;
let s = 'a string';
let b = false;
let bt = true;
let obj = {
    a: 'What is string'.b: 99
}
let obj2 = {
    a: 'What is string'.b: 99.toString: function(){
        returnnum; }}console.log(num.toString());    / / "16"
console.log(s.toString());  // "a string"
console.log(b.toString());  // "false"
console.log(bt.toString()); // "true"
console.log(obj.toString());    // "[object Object]"
console.log(typeof obj2.toString());    // number
Copy the code

But null and undefined have no toString methods. For numeric toString methods, you can pass in a conversion base that outputs a string representation of binary, octal, or hexadecimal values.

let numb = 20;
console.log(numb.toString(2));  / / "10100"
console.log(numb.toString(8));  / / "24"
console.log(numb.toString(10)); 20 "/ /"
console.log(numb.toString(16)); 14 "/ /"
Copy the code
String() transformation function

You can use the String() function when you do not know whether the values to be converted are null and undefined.

  • The toString method is called when the value has toString
  • The value is null and returns “null”
  • The value is undefined, return undefined
let num = 16;
let s = 'a string';
let b = false;
let bt = true;
let obj = {
    a: 'What is string'.b: 99
}
let obj2 = {
    a: 'What is string'.b: 99.toString: function(){
        returnnum; }}let n = null;
let un = undefined;

console.log(String(num));    / / "16"
console.log(String(s));  // "a string"
console.log(String(b));  // "false"
console.log(String(bt)); // "true"
console.log(String(obj));    // "[object Object]"
console.log(typeof String(obj2));    // string
console.log(String(n)); // "null"
console.log(String(un));    // "undefined"
Copy the code

4. Operators

Operators that operate on data values in ES include arithmetic operators, bitwise operators, relational operators, and equality operators.

An operator

Bitwise operators are used to manipulate values at the most basic level (bits that represent values in memory). All values in ES are stored in IEEE~ 75464-bit format, but the bitwise operator does not directly manipulate 64-bit values. Instead, it first converts 64-bit values to 32-bit integer values, then performs operations, and finally reverts back to 64-bit values.

For signed integers, the first 31 bits represent the value of the integer, the 32nd bit represents the sign bit, 0 represents a positive number, and 1 represents a negative number.

Such as: 18 of the binary representation of 00000000000000000000000000010010 or 10010. And 18 = 1 * 2 * 2 ^ 3 ^ 4 + 0 + 0 * 2 * 2 ^ 1 ^ 2 + 1 + 0 * 2 ^ 16 + 0 + 0 = 0 + 2 + 0;

Negative numbers are also stored in binary code, but with binary complement. To compute the binary complement of a number, perform the following steps (take -18 as an example) :

  • So let’s take the binary code that’s worth the absolute value
  • Find the binary inverse
  • Add one to the resulting binary inverse

Binary code of 00000000000000000000000000010010 (18) one’s complement (18) 11111111111111111111111111101110 11111111111111111111111111101101 (Inverse plus 1)

When we print a negative binary, we simply add a minus sign to the absolute value of the number.

console.log((18).toString(2))   / / "10010"
console.log((-18).toString(2))  / / "- 10010"
Copy the code