navigation

[Deep 01] Execution context [Deep 02] Prototype chain [Deep 03] Inheritance [Deep 04] Event loop [Deep 05] Curri Bias function [Deep 06] Function memory [Deep 07] Implicit conversions and operators [Deep 07] Browser caching mechanism (HTTP caching mechanism) [Deep 08] Front-end security [Deep 09] Deep copy [Deep 10] Debounce Throttle [Deep 10] Front-end routing [Deep 12] Front-end modularization [Deep 13] Observer mode Publish subscribe mode Bidirectional data binding [Deep 14] Canvas [Deep 15] webSocket Webpack HTTP and HTTPS CSS- Interview Handwriting Promise

[react] Hooks

[Deployment 01] Nginx [Deployment 02] Docker deployVue project [Deployment 03] gitlab-CI

[source code – Webpack01 – precompiler] AST abstract syntax tree [source code – Webpack02 – Precompiler] Tapable [source code – Webpack03] hand written webpack-compiler simple compilation process [source code] Redux React-redux01 [source] Axios [source] vuex

Casts.

  • Number, String, Boolean
  • Js is a dynamically typed language. Variables have no type restrictions and can be assigned any value
  • Although the data type of a variable is uncertain, the various operators are limited

Cast Number()

  • Parameter: In two cases, the parameter is a value of the original type, and the parameter is an object
  • Result: Converts any data type to numeric, numeric, or NaN
  • The conversion of Number is stricter than that of parseInt; as long as a character cannot be converted to a numeric value, the entire string will be converted to NaN
  • Null => 0
  • undefined => NaN

The Number argument: the value of the primitive type

The Number() argument is a value of the original type 1.false)
Number(' 'Number(undefined) Number(Null) 2.'123abc') // String that cannot be converted to a Number // Number is much more strict than parseInt, as long as one character cannot be converted to a Number, the entire string will be converted to NaN // parseInt('123abc') // 123
// Number('123abc') // NaN 3.true)
Copy the code

Number parameter: object

  • If the argument type of Number() is an object, as long as it is not an array of single values, it will be converted to NaN
The Number () parameter is the object Number ([7]) / / 7 Number ([1, 2]) / / NaN Number ({a: 1}) / / NaNCopy the code

Number Specifies the conversion rule

1. Call the valueOf method on the object itself - if it returns a valueOf the original type, use the Number function directly, and do not perform the following steps - if it returns an object, continue the judgment 2. Call the toString method on the object itself - if it returns a value of the original type, then use the Number function directly, without further steps - if it returns an object, then continue the judgment. ValueOf => object => toStirng => object => the above step is reported. If the valueOf the original type is returned, call Number() and terminate the next step. // valueOf: the valueOf the object returns the object itself // toString: Return the string form of the object // valueOf and toString can be customizedCopy the code

String() cast

  • Converts a value of any type to a string
  • Parameter: a value or object of the original type
  • Result: string
1. Parameter: value of primitive type String(123) //"123"
String('abc') / /"abc"
String(true) / /"true"
String(undefined) // "undefined"
String(null) // "null"2. Parameter: object - parameter is object, return type String - parameter is array, return array of String form String({name:'woow_wu7'}) // The argument is an object and the return type is a string ==>'[object Object]'String([1,2]) // return the array as a String, ==>'1, 2,'1. Call the toStirng method on the object - if it returns a value of the original type, use the String() method - if it returns an object, continue with step 2 below. Call the valueOf method on the object - if it returns a valueOf the original type, use the String() method to convert it - if it returns an object, continue with the following steps 3. Object to call the toString () - > - > the valueOf () - > object - > error the steps above, if the return values of primitive types, call the String (), and suspend the subsequent steps / / the String parameter is the object / / when the parameters are: Return type string // arguments are numbers: Returns an array as a stringCopy the code

Boolean() cast

  • Converts a value of any type to a Boolean value
Boolean type conversions except for the following six values arefalse, the others aretrue
Boolean(+0) // false
Boolean(-0) // false
Boolean(' ') / /false
Boolean(null) // false 
Boolean(undefined) // false
Boolean(NaN) // false
Copy the code

Automatic conversion

  • The timing of the automatic conversion
    • Different types of data operate with each other
    • Find a Boolean value for non-Boolean data
    • Use unary operators for values that are not numeric types
  • Rules for automatic conversion
    • What type of value is expected to call the conversion function of that type

Automatically converted to a string

  • The automatic conversion of a string, which occurs mainly when the string is added
  • When one value is a string and another value is a non-string, add and the non-string is converted to a string
'5'/ / + 1'51'
'5' + true // "5true"
'5' + false // "5false"
'5'+ {} / /"5[object Object]"======> {} => toString => Return type string'[object Object]'
'5'+ [] / /"5"= = = = = = = = = = = = = = = = = = = = = > [] = > toString = > returns a string representation of the array' '= >'5' + ' '
'5' + function() {} / /"5function (){}"
'5' + undefined // "5undefined"
'5' + null // "5null"
Copy the code

Automatically converted to a numerical value

  • All operators convert an operator to a numeric value, except for the possibility that + converts the operator to a string
  • Unary operators also convert operators to numeric values
'5' - '2'/ / 3'5' * '2'/ / 10true1 / / 0false/ / - 1-1'1'1 / / 0'5' * []    // 0 ----------------------- 5 * 0
false / '5'// 0 ----------------------- 0/5'abc'- 1 // NaN --------------------- NaN - 1 null + 1 // 1 -------------------------- 0 + 1 undefined + 1 // NaN ------------------- NaN + 1 the unary operator also converts operators to numeric +'abc' // NaN
-'abc' // NaN
+true // 1
-false // 0
Copy the code

The operator

Addition operator

  • Overload: Addition operators are added and joined, and different operators result in different syntax behavior.
  • Except for the addition operator, all operators are free from overloading. We convert all operators to numeric values and then perform mathematical operations
  • If the operator is an object, the object must be converted to a value of the original type and then added
1 + true/ / 2 + 1'a' // "1a"------------------- value and string are added, + is overloaded, so 1 is converted to string'1'= >'1a'(2) Overloaded results in different operation results'3'Plus 4 plus 5 over PI/PI"345"
3 + 4 + '5' // "75"-- -- -- -- -- -- -- -- -- -- pay attention to the order is not the same as the results (3) transport operator is var object obj = {p: 1}; obj + 2 //"[object Object]2"------- valueOf => object itself {p: 1} => toString() =>'[object Object]'+ 2 = >'[object Object]2'The valueOf of the ------- object returns the object itself ------- Note: String and value are added together, since + is overloaded, it means connecting ------- Note: after toString(), + is overloaded, it may call Number() or String()Copy the code

Null, and undefined

  • Null and undefined are strictly equal to themselves
undefined === undefined // true
null === null // true


var v1; // undefined
var v2; // undefined
v1 === v2 // true

Copy the code

The equality operator ==

  • Equality operator, used for comparisonSame type of datawithStrict equality operatorequivalent
  • Same type of data: == is equivalent to ===
  • Different types of data: == is converted first and then compared using ===
    • Raw type data: convert to value and compare
    • Data of object type: convert the object to a value of the original type and then compare
    • Null and undefined: compare true to each other and false to any other type
  • Disadvantages: implicit transformation, error prone
Primitive type values: converted to values and compared 1 ==true // true// equivalent to 1 === Number(true)

'true'= =true // false// convert both to a Number // equivalent to Number('true') === Number(true// Is equivalent to NaN === 1'1'= =true  // true// equivalent to Number('1') === Number(true// equal to 1 === 1false= ='false'    // false   // Number(false) == Number('false') => 0 === NaN => false
false= ='0'        // true-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- the value of the object types, object to the type of value first, then compare [1] / / = = 1trueNumber([1]) == 1 [1] =='1' // true// equivalent to Number([1]) == Number('1') [1] = =true // true// equivalent to Number([1]) == Number(true) -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- null, and undefined: compare to each othertrue, and any other typefalse


false == null // false
false == undefined // false

0 == null // false
0 == undefined // false

undefined == null // true

false == undefined  // false--------------- undeined and NULL and any other type == comparison, both returnfalse, each == returntrue--------------- Principle: Number(false) == Number(undefined) => 0 === NaN => false
false == null       // false
null == undefined   // true
Copy the code

priority

  • Highest priority: Attribute access has the highest priority. (a)
  • Lowest priority: The assignment operator = has the lowest priority
  • Of operators, the unary operator has the highest precedence

associativity

  • When priorities are the same, as in multiplication and division, associativity is considered
  • Associative classification: left and right associative
  • Right associative: the unary, ternary, and assignment operators are right associative, and all other operators are left set
  • Left bound: Everything else is left bound

Order of operations

  • I’m going from left to right

The isNaN and Number. IsNaN

  • IsNaN () converts the parameter to the number type and uses isNaN to determine
  • Number.isnan () returns false if the parameter is of type Number
var n = 1 / 'foo'
var a = 'str'

console.log(n) // 1/Number('foo') => 1/NaN => NaN
console.log(n == NaN) // NaN == NaN => false
console.log(NaN === NaN) // false
console.log(isNaN(n)) // true
console.log(isNaN(a)) // isNaN(Number('str')) => isNaN(NaN) => true
console.log(Number.isNaN(n)) // Number.isNaN(NaN) => trueConsole.log (number.isnan (a)) // number.isnan ()falsereturnfalse.trueIsNaN => directfalse
Copy the code

Case 1

[] = =! [] / /true1. What's your priority? > == So calculate first! [] = >false/ / in addition to' ',+-0,null,undefined, all but true for NaNfalse2. [] = =false3. The == equality operator converts [] to a value of the original type before comparing 4. Number([]) ==false => valueOf => [] => toString => ' ' => Number(' ') = > 0 = =false5. = = 0false
6. 0 == Number(false) => 0 == 0 The same type === = === => 0 === 0 =>true
7. true
Copy the code

Case 2

[] + [] / /' '[] => valueOf([]) => [] => toString([]) => toString([]) => toString([]) => toString([]) => toString([])' '
3. ' ' + ' '4. String addition, + there is an overload, here means connection 5.' '
Copy the code