JavaScrip usage tips

Preface this article will mainly share with you some methods and skills in writing JavaScript code. Although sometimes all the major roads are directed to Rome, there may always be a shortest path to go. We hope to use the following JavaScript techniques to make your code "simplified and simplified ". Preface

This article will mainly share with you some of the methods and techniques used when writing JavaScript code. Although sometimes all the major roads go to Rome, there may always be a shortest path to go. We hope to use the following JavaScript techniques to make your code "simplified and simplified ".

Skillfully use 1. new Set ()

Some people may know that ES6 provides a new data structure Set, but there may not be many people who can use it flexibly. Using the Set data structure, we can easily duplicate an array, for example:

Let arr = [1, 2, 2, 3]; let set = new Set (arr); let newArr = Array. from (set); // Array. the from method can convert the Set structure into an array. Console. log (newArr); // [1, 2, 3]

2. Object. assign ()

Object. assign () is also the extension method of the Object provided in ES6, but it can only copy one layer, for example:

let obj1 = {a: 1};let obj2 = {b: 2};let obj3 = Object.assign({}, obj1, obj2);console.log(obj3); // {a: 1, b: 2}

3. map ()

The map method is used to traverse the array and has returned values. You can operate on each item of the array and generate a new array. Sometimes, you can replace the for and forEach loops to simplify the code, for example:

Let arr3 = [1, 2, 3, 4, 5]; let newArr3 = arr3.map (e, I) => e * 10 ); // multiply each item in the array by 10console. log (newArr3); // [10, 20, 30, 40, 50]

4. filter ()

The filter method is also used to traverse arrays. As the name suggests, it is used to filter arrays. A callback function is triggered after each element. By judging, retaining or removing the current item, a new array is returned, for example:

Let arr4 = [1, 2, 3, 4, 5]; let newArr4 = arr4.filter (e, I) => e % 2 = 0 ); // modulo. filter the number of consoles whose remainder is not 0. log (newArr4); // [2, 4]

5. some ()

Some is used to traverse the array. A callback function is triggered after each element. If one of the conditions is met, true is returned. Otherwise, false is returned, which is similar to | comparison. For example:

Let arr5 = [{result: true}, {result: false}]; let newArr5 = arr5.some (e, I) => e. result); // if one is true, it is trueconsole. log (newArr5); // true

6. every ()

The every method is used to traverse the array. A callback function is triggered after each element. If one element does not meet the conditions, false is returned. Otherwise, true is returned, which is similar to & comparison. For example:

Let arr6 = [{result: true}, {result: false}]; let newArr6 = arr6.every (e, I) => e. result); // if one is false, it is falseconsole. log (newArr6); // false

7 .~~ Operator

~ The symbol is used in JavaScript For bitwise inversion ,~~ The bitwise operation requires an integer and the result is an integer. Therefore, bitwise operations automatically convert the bitwise operation to an integer, which cleverly removes the decimal part, similar to parseInt, for example:

let a = 1.23;let b = -1.23;console.log(~~a); // 1console.log(~~b); // -1

8. | Operator

Clever Use | Operator we can set the default value for the variable, for example:

Let c = 1; let d = c | 2; // if the value of c is true, the existing value is obtained; otherwise, the value is 2console. log (d); // 1

9 .... Operator

... The operator is the method used in ES6 to deconstruct arrays and can be used to quickly obtain array parameters, for example:

let [num1, ...nums] = [1, 2, 3];console.log(num1); // 1console.log(nums); // [2, 3]

10. Ternary Operators

This operator should be familiar to everyone. In the case of silent writing, the if else writing can be simplified, for example:

Let e = true, f = ''; if (e) {f = 'man ';} else {f = 'Woman';} // equivalent to e? F = 'man ': f = 'Woman ';

Conclusion

This article only lists the common 10-Point Methods in JavaScript syntax to improve the encoding efficiency. Of course, each knowledge point can be expanded and explored accordingly, we hope that you can achieve the best use of your skills at the same time.

The above is a detailed description of JavaScrip's usage skills. For more information, see other related articles in the first PHP community!