Preface 🎃

ECMAScript is a scripting language standardized by Ecma International (formerly the European Computer Manufacturers Association) through ECMA-262.

Learning ES6 focuses on the differences from ES5, or the new specifications.

Main contents 🎃

  • Block-level binding
  • Strings and regular expressions

Mind mapping 🎃

Block-level scope 🎃

Var declarations and variable promotion 🎃

// The top of the function
// Not inside the function, in the global scope by default
Copy the code

Block-level binding within loops 🎃

  • The function inside the loop
/ / in IIFE var
// let inside the loop
Copy the code
  • A constant declaration within a loop
// Const behaves differently depending on how the loop is executed
// The for loop will report an error
//for-in for-of creates a new variable binding for each iteration
Copy the code

Block-level declarations 🎃

  • Lexical scope
// Declared variables are not accessible outside the specified accounting scope
Copy the code
  • Let the statement
// Only after the declaration can be used, otherwise an error will be reported (temporary dead zone)
// There is no variable promotion
// Prohibit duplicate declarations
Copy the code
  • Constant statement
//const declaration prevents the variable from changing itself
Copy the code
  • Temporary dead zone
//TDZ a variable is removed from the temporary dead zone and is safe to use only when its declaration statement is executed.
// The global block-level binding let or const, while new bindings are created in the global scope, no properties are added to the global object.
// This means that you can't use let or const to override a global variable, you can only mask it.
// Using var may inadvertently override an existing global attribute block-level binding new best practice
Copy the code

String and regular expression 🎃

Better Unicode support 🎃

// Originally: es5 used (usC-2), the string was encoded in 16 bits (1 symbol), each 16 bits representing a character, originally sufficient, but later due to the introduction of Unicode extended set characters, insufficient.
Copy the code

Utf-16 code point 🎃

/ / element
/ / code points
//UTF-16 introduces proxy pairs, meaning that a single character may represent a code point with one or two codes.
// Therefore, UTF-16 has two modes, one is 16-bit and the other is 32-bit. 16 bits correspond to basic plane characters (BMP), and 32 bits correspond to extended plane characters.
Copy the code

Code test:

/ / 2 ^ 16 = 65536
//2^32 = 4 294 967 296
var text = '; '
text.charCodeAt()/ / 59
'𠮷'.codePointAt(0) / / 134071
'😊'.charCodeAt()/ / 55357
'a'.charCodeAt()/ / 97
Copy the code

🎃 codePointAt () method

// a method of a string that returns a non-negative integer with a Unicode encoding point value.
//Surrogate Pair is a encoding method used to extend characters in UTF-16,
// is a proxy pair that takes four bytes (two UTF-16 encodings) to represent a character.
Copy the code

Code test:

'ABC'.codePointAt(1);          / / 66
'\uD800\uDC00'.codePointAt(0); / / 65536
Copy the code

String. FromCodePoint 🎃 () method

// Use string.fromCodePoint () to generate a single character String with a given code point
Copy the code

Code test:

String.fromCodePoint(134071);/ / 𠮷
Copy the code

🎃 normalize () method

// Normalizes the current string in one of the specified Unicode normal forms
// When comparing strings, they must be normalized to the same form
Copy the code

The regular expression u flag 🎃

  • How does the U mark work
// When a regular expression sets the U flag, it is switched to character-specific instead of code-specific.
// This means that the regular expression will not be confused by proxy pairs in the string, but will work as expected.
// The regular expression /^.$/ will match any input string containing only a single character.
// When the u flag is not used, the regular expression only matches symbols, so it cannot match the Japanese character represented by two symbols.
// With the u flag enabled, the regular expression will compare characters instead of symbols, so the Japanese character will be matched.
Copy the code
  • Count code points
function codePointLength(text) { 
    var result = text.match(/[\s\S]/gu);
    return result ? result.length : 0;
}
console.log(codePointLength("abc")); / / 3
console.log(codePointLength("bc" )); / / 2
Copy the code
  • Check whether the U flag is supported
function hasRegExpU() { 
    try {
            var pattern = new RegExp("."."u"); return true; 
        } catch (error) { 
            return false; }}Copy the code

Other changes to the string 🎃

  • Methods to identify substrings
//includeOf()
//includes()
Copy the code
  • startWith()
// Determine whether the text is included from the start of the given text, true if it is included, false otherwise
Copy the code
  • endsWith()
// Determine whether a given text is contained from the end of the text, true if it is contained, false otherwise (search from the end of the text)
Copy the code
  • To find the exact location, use the following methods
IndexOf () and lastIndexOf ()Copy the code
  • Repeat () method
// A method to copy a string
Copy the code
console.log("a".repeat(3)); // "aaa"
console.log("hell".repeat(2)); // "hellhell"
console.log("abc".repeat(4)); // "abcabcabcabc"
Copy the code

Other changes to regular expressions 🎃

// Regular expression y flag
// Copy the regular expression
/ / flags properties
Copy the code

Template literals 🎃

// Basic syntax
// Multi-line string
// Make the substitution bit
// Label the template
Copy the code

Experience 🎃

Through this period of learning, I understand my technical shortcomings, knowledge points are not detailed and in-depth, just stay on the surface. Later period must strengthen review and comb.

That’s all for today, bye 👋🏻