Language foundation

When it comes to basics, the Little Red Book chapter is about seven inches from ECMAScript’s backbone. Personally through this chapter, re-consolidate the understanding of JS this language. The study of the following chapters is also dependent on the stack of knowledge in this chapter, followed by a detailed summary of personal efforts.

PS: The explanation is based on some examples in the book. I think it is very clear, so I would like to borrow it.

grammar

• Case sensitive, example:testandTestIt’s two different variables
• As in most languages, variable names have the same specification:/^[letter, underscore, dollar symbol][letter, underscore, dollar symbol, or digit]*$/ (The re is clear ^=^)

Keywords, reserved words, true, false, and NULL are not identifiers

• // ** */
• Strict mode “use strict” can be used in code blocks with doSomething{“use strict”…… } useful TS bigwigs should be more sensitive
• statementslet num = 1;The semicolon;Really make it a habit. When it comes to improving performance, I don’t mean it.

The little Red Book tells us that in fact, this writing method looks lofty, but it is not practical, which affects reading

    if(test)
        console.info("test");
Copy the code

The following is more comfortable to tell the truth, the big deal is not a line

    if(test){
        console.info("test");
    }
Copy the code

Keywords and reserved words

• The keyword
  • let const break yield debugger default exportAnd there’s a lot of
• Reserved words
  • enum awaitMore public static in strict mode

Variables (scope learning key)

Var was the original variable declaration, while const and let were syntaxes that emerged in ES6

The var keyword

Var reader = "dad "; Reader = "reader "; reader = 666; // It is not recommended to define variable types in TSCopy the code

• Var declares scope

Var makes variables local

Function test() {var reader = "dad "; } test(); console.info(reader); // The reader is not definedCopy the code

Declaring global variables is no problem

Function test() {reader = "dad "; Reader = "dad"} test(); console.info(reader); // Print "dad"Copy the code

• Var declaration enhancement

function test(){ console.info(age); Var age = 18; var age = 30; } test();Copy the code

Let declaration (scope begins to appear)

if(true){ var age = 30; let fakeAge = 18; let fakeAge = 10; } console.info(age) // 30 console.info(fakeAge); // ERROR is not definedCopy the code

let fakeAge = 10; if(true){ let fakeAge = 18; } // No errors will be reportedCopy the code

• Temporary dead zone

function test(){ console.info(age); //ERROR does not define cannot be promoted let age = 18; } test();Copy the code

• Global declarations

Var reader = "dad "; Window.reader // "Dad"Copy the code

Let reader = "dad "; window.reader //undefinedCopy the code

Try not to declare values in conditions, which is difficult to understand

if(true) { let age = 18; } console.info(age); // Is prone to undefined bugsCopy the code

Make it a habit to declare first

    let age;
    if(true){
        age = 18;
    }
Copy the code

• Let declaration in loop

for (let i = 0; i < 5; ++ I){} // I is scoped in the global console.info(I); // ERROR is not definedCopy the code

The Little Red Book gives an interesting example

for(var i = 0; i < 5; ++i){ setTimeout(()=>{ console.info(i) },0); } // The result will be 5, 5, 5, 5, 5Copy the code

for(let i = 0; i < 5; ++i){ setTimeout(()=>{ console.info(i) },0); } // The result will be 0, 1, 2, 3, 4Copy the code

The key is the reference difference: VAR is global, while let is a variable in scope

Const statement

const age = 30; age = 18; There is no turning back the clock, t-tCopy the code

It is often used to define global enumeration variables

Const CHINA = "中 ";Copy the code

This is used when parsing objects and arrays

For (const key in {a: 1, b: 2}, {} for (const value of [1, 2, 3, 4, 5]) {}Copy the code

Declare style and best practices

• Var is obsolete
• Const takes precedence over let

The data type

Undefined, Null, Boolean, Number, String, Symbol. Objet is the icing on the cake in ECMAScript, which will be highlighted later in the collection reference types section! Key description! Key description!

The typeof operator

We use it a lot in development

Typeof "dad" === "string" typeof 666 === "number"Copy the code

Note, however, that typeof NULL === “object” is an empty object.

Undefined type

It does not mean that there is no instantiation (this will report an error), but that there is no assignment (not initialized).Copy the code

let message; console.info(message); //undefined console.info(age); / / an errorCopy the code

Null type

• Initialization is usually done with NULL

    let car = null;
Copy the code

• Null == undefined //true to remember
• Distinguish between false and null values, i.e. null and undefined

Boolean type

NaN and 0 in Number mean false, and that’s the only thing to keep in mind

Number type (use of base)

Octal: starts with 0

• 070: Valid, 56
• 079: invalid, as 79
• 08: invalid, as 8

Hexadecimal value: the value starts with 0x

• 0 x1f: 31

1. Floating point values

• Scientific notation: 3.14E7
• The addition is not good: 0.1+0.2 is equal to 0.3000000000000000004, because IEEE754 is used; If it’s 0.15 and 0.15, then no problem. As for this rule, the book did not say, you can go to learn about IEEE754~. ~

2. Value range

• Number.MAX_VALUE (isFinite(num)
• Number.MIN_VALUE

3, NaN

• 0/0 is NaN
• NaN ! = NaN
• isNaN()Is it a number

4. Numerical conversion

Number("") // 0
Number("LOL") // NaN
Copy the code

// NaN parseInt("10",2) // 2 binaryCopy the code

ParseFloat key

ParseFloat ("0xA") //0 // Because parseFloat can only parse decimal parseFloat("3.125e7") //31250000 can parse scientific notation // this can be converted as needed in the project, But notice that when number is null it's a NaN and it's called parseFloat(number).toString()Copy the code

Type String

2. Characteristics of strings

• The reason for concatenating strings: Strings are immutable and must be destroyed and reassigned to change them

3. Convert to a string

let num = 10; num.toString(2); // "1010" binary conversionCopy the code

• An error is reported if a is not certain

• So you can useString(null),String(undefined)Is converted directly to a string

4. Template literals

    `
        <div>${name}</div>
    `
Copy the code

Here’s the thing: new skills

5. String interpolation

let foo = { toString: () => 'World' }; console.log(`Hello,${foo}! `) //Hello,World! //${} can be passed in as an objectCopy the code

Of course, you can also pass in methods directly

Let getStringFunc = (STR) = > {let obj = {" 1 ":" test ", "2" : "test pass"} return obj (STR) | | '. } console.log(' Hello, you are now ${getStringFunc("1")} ') console.log(' Hello, you are now ${getStringFunc("2")} ')Copy the code

6. Template literals tag functions

function strFormat(stringIn,... } strFormat '${a}+${b}=${a+b}Copy the code

7. The original string can be obtained from strings.raw without arrays like \n and \t

Symbol type

This chapter is not very useful in my current coding * (mainly I don’t know where it will be used, so it is not good to publish), but I will tell it as a separate chapter (I will share it with you when my subsequent research is complete) *

The Object type

let o = new Object(); // is a different instance object from {}Copy the code

Remember these non-archetypal Object instance properties and methods first, otherwise they will be easily confused with the archetypal applications in Chapters 5 and 6

• The constructor () Function is also an Object
• HasOwnProperty: Verifies the object instance, not the presence of stereotype properties
• IsPropertyof (Object) : Whether an Object is a prototype of another Object
• PorpertyIsEnumerable: Whether you can use a for-in enumeration
• ToLocaleString () : Returns a string representation of an object (in more detail)
• ToSring () : converts to string
• ValueOf () : Similar to toString

Object is the base class

Of course BOM and DOM do not come from objects, after all, they come from browsers