Strict schema, error type, destruct assignment, re

First, strict mode

Js default execution mode is loose mode, in order to standardize the JS language, so the introduction of strict mode; The purpose is to eliminate some weird behavior of JS;

Use strict mode: add the string “use strict” to the first line of the JS script

Common differences between strict mode and normal mode

Parameters and arguments do not map in strict mode

In loose mode, parameters and arguments map, and if you change parameters in a function, the corresponding values in arguments change as well

functionsum(a, b) { b = 100; // Console.log (arguments) in normal loose mode; // 1 100 } sum(1, 3); // There is no mapping between parameters and arguments in strict modeCopy the code
'use strict';
function sum2(a, b) {
  b = 100;
  console.log(arguments); // 1 2
}
sum2(1, 2);
Copy the code

When a project is packaged and compiled using the Webpack tool, strict modes are specified in the header of the JS script

This problem in strict mode

Call in non-strict mode:

function f0() {
  console.log(this);
}
var obj = {
  id: 1
};
f0.call(obj); // this -> obj
f0.call(); // this -> window
f0.call(undefined); // -> window
f0.call(null); // window
Copy the code

In strict mode, this is undefined if the call method does not specify this. In strict mode, whoever call specifies is this

'use strict';
function f1() {
  console.log(this);
}
f.call(); // this -> undefined
f1.call(undefined); // this -> undefined
f1.call(null); // this -> null
Copy the code

In strict mode, you cannot directly assign a value to an undeclared variable


'use strict'; aa = 123; // Add aa = 123 to window in non-strict mode; // Error in strict mode: Uncaught Reference: AA is not definedCopy the code

Second, manually throw errors

The throw keyword is used to manually throw an error throw'hello world'; console.log(123); // No output, because the throw keyword throws an error, js once throw error will stop the following code execution;Copy the code

Common error types

2.1. ReferenceError Incorrectly refers to a variable that does not exist

throw new ReferenceError('A variable not found');
Copy the code

2.2 TypeError TypeError type

throw new TypeError('You got the wrong type.');
Copy the code

2.3 SyntaxError indicates a SyntaxError

throw new SyntaxError('Your grammar is wrong');
Copy the code

2.4 Error Common errors

throw new Error('This is a common error');

Copy the code

3. Deconstruct assignment

Using the corresponding relationship of data structure to quickly value array and object;

  1. Array destruct assignment:

If the position of the variable to the left of the equals sign is the same as the position of the value in the array to the right of the equals sign, the variable can get the value of that position in the array;

1.1 Sequential Deconstruction:

let ary = [10, 50, 100, 200];
Copy the code

When there is no deconstructing assignment

let a = ary[0];

let b = ary[1];

let c = ary[2];

console.log(a, b, c);
Copy the code

Use destruct assignment

let[a, b, c] = ary; Console. log(a, b, c); console.log(a, b, c);Copy the code

1.2 Fetch an array:

let[,, d] = ary; Console.log (d); console.log(d);Copy the code

1.3 Take out the first and second items and put the rest into an array;

let[e, f, ...arr] = ary; console.log(e); // 10 console.log(f); // 50 console.log(arr); / / [100, 200]Copy the code

1.4 Further deconstruction:

let ary2 = [10, ['a'.'b']].let [g, [h, i]] = ary2;
console.log(g); // 10
console.log(h); // 'a'
console.log(i); // 'b'
Copy the code

1.5 Array deconstruction Default value: the default value is valid only if the deconstructed value is undefined

let ary3 = [1, 3];

let[j = 2, k = 3, l = 100] = ary3; // j defaults to 2, k defaults to 3, and l defaults to 100 console.log(j); // 2 console.log(k); // 3 console.log(l); // 100 // take a as the default value of Blet[a, b = a] = [1]; console.log(a); // 1 console.log(b); / / 1Copy the code
  1. Object structure assignment

Typically, the value of an object’s property is obtained from the object. Attribute name or object [‘ attribute name ‘] and deconstructed assignment of an object is to obtain the value of the object’s modified attribute name when the variable corresponds to the attribute of the object

let obj = {
  name: 'hello',
  age: 10
}
Copy the code

2.1 Deconstructing assignment:

let { name, age } = obj;
console.log(name);
console.log(age);
Copy the code

2.2 If you want only one attribute value of an object:

let obj2 = {
  name: 'hello',
  age: 10,
  courses: ['js front end'.'Architect'.'UI Designer ']};let {courses} = obj2;
Copy the code

2.3 Further deconstruction:

let obj3 = {
  name: 'zhufeng',
  teacher: {
    js: ['hello'.'Hello.'.'....'],
    architect: [' ']}};let{ teacher: { js } } = obj3; console.log(js); // Get the value of obj3.teacher.jsCopy the code

2.4 Rename: To avoid duplicate declarations

let obj4 = {
  title: 'Senior Front End Engineer'
};
let title = 100;
// let{ title } = obj4; // The title variable is declared repeatedlylet{ title: title2 } = obj4; // Deconstruct the title property from obj4 and rename it to title2 console.log(title2);Copy the code

2.5 Deconstructing the default value of assignment: The default value is valid only if the deconstructed value is undefined

let obj5 = {
  name: 'hello',
  age: 18,
  job: 'FE',
  // address: undefined
};
let { address = 'hebei'} = obj5; // Set the default value of address destruct assignment to'hebei';
console.log(address);
Copy the code
  1. String destruct assignment
let [x, y, z] = 'hello';
console.log(x, y, z);
Copy the code
  1. Destruct assignment of function arguments
function fe({ name: nike, id, num = '18332567506'}) {// Deconstruct console.log(Nike, id, num); } fe({ name:'zhangsna',
  id: 10
});

Copy the code
  1. Concise syntax for objects
let config = '110.156.23.24';
let pwd = '4323445';


let obj6 = {
  config: config,
  pwd: pwd}; // When your property name is the same as the variable name, you can abbreviate it to a variable namelet obj7 = {
  config,
  pwd};Copy the code

regular

Re: (RegExp: Regular Expression)

Rules for handling strings. This processing has two aspects:

To determine whether a certain string conforms to the rules, the regular string is captured.


letreg = /\d/img; // create it literallylet reg0 = new RegExp('\\d+'.'img'); // create an instanceCopy the code

Regular composition: metacharacters and modifiers

metacharacters

Special metacharacter

\d matches any digit from 0-9. \d matches any character except 0-9. \w matches any string from digits, letters, and _. \s matches a blank character (space, \t TAB)'zhu-feng'The left side of z, the right side of U, the left side of F, and the right side of G are all boundaries \n matches a newline character. Instead of a decimal point, it matches any string \ escape except \n, escaping ordinary strings into special metacharacters. For example, \d represents a string between 0 and 9. Special metacharacters can also be escaped to normal metacharacters. If. No longer represents any character other than \n, But said the common decimal point ^ (pronounced caret) begin with a metacharacter said $said ends in a metacharacter x | y said any of x or y [xyz] said any of x/y/z/a-z a-z of any one letter [0-9] Any digit in 0-9 [^a-z] Any character except a-z () regular grouping (? :) current group value match does not capture (? =) forward check (? !). Negative prelookup quantifier metacharacter: occurrences of metacharacter * 0 to more? Normal metacharacters: Any metacharacters that occur in a re (created literally) are normal metacharacters except for special metacharacters and quantifier metacharacters. Modifier: I: ignorecase ignores case. M: multiline matches multiple lines. G: global matches globallyCopy the code

Example:


let reg2 = /\D/;
console.log(reg2.test('2')); // false
console.log(reg2.test('a')); // true
console.log(reg2.test('_')); // true

let reg3 = /\w/;
console.log(reg3.test('1')); // true
console.log(reg3.test('a')); // true
console.log(reg3.test('_')); // true
console.log(reg3.test('A')); // true

let reg4 = /\n/;
console.log(reg4.test(`
`)); // trueA carriage return is entered in the template stringlet reg5 = /\s/;
console.log(reg5.test(' ')); //true
console.log(reg5.test(' ')); // true

let reg6 = /\b/;
console.log(reg6.test('zhu-feng'));

let reg7 = /./;
console.log(reg7.test('我')); // true
console.log(reg7.test('x')); // true
console.log(reg7.test('12')); // true
console.log(reg7.test('\n')); // false

let reg8 = /^\d/;
console.log(reg8.test('1abc')); // true
console.log(reg8.test('x23c')); // false

let reg9 = /\d$/;
console.log(reg9.test('hell9')); // true
console.log(reg9.test('123hello')); // false

letreg10 = /^\d$/; // Matches a number that is both a beginning and an end; This means that there is only one number in the string console.log(reg10.test('9')); // true
console.log(reg10.test('99')); // false
console.log(reg10.test('abc1')); // false
console.log(reg10.test('1xyz')); // false

let reg11 = /a|b/;
console.log(reg11.test('a')); // true
console.log(reg11.test('b')); // true
console.log(reg11.test('ab')); // true

let reg12 = /[a-z]/;
console.log(reg12.test('a')); // true
console.log(reg12.test('z')); // true
console.log(reg12.test('xyz')); // true
console.log(reg12.test('A')); // false

let reg13 = /[^0-9]/;
console.log(reg13.test('8')); // false
console.log(reg13.test('ABC')); // true
console.log(reg13.test('\n')); // true
console.log(reg13.test('_')); // true

let reg14 = /\d*/;
console.log(reg14.test('abc')); // true
console.log(reg.test('12133bade')); // true

letreg15 = /\d? /; console.log(reg15.test('dsjf8lkk')); // true

let reg16 = /\d{3}/;
console.log(reg16.test('666')); // true
console.log(reg16.test('22')); // false
console.log(reg16.test('111')); // true

Copy the code