20 not to be missed ES6 tips

Preface

Hello everyone , I am a xieyezi, Long time no see , I'm back in the Nuggets again , This time, I sorted out 20 A high frequency of use ES6 Code block , Hope you enjoy it

The detailed comments and specific usage of the code are in my github On , The source code is connected at the bottom

1. Disorder array order

code1.png

2. Remove all characters except numbers

code20.png

3. Invert a string or word

code2.png

4. Convert decimal to binary or hexadecimal

code3.png

5. Merge multiple objects

code4.png

6. === and == The difference between

code5.png

7. Deconstruct assignment

code6.png

8. Exchange the values of variables

code7.png

9-1. Judge palindrome string

code21.png

Palindrome string : Write the same string forward and reverse ( Special thanks \@ Floating garret master ^[1] Corrigendum )

9-2 Judge whether the two strings are arranged with each other

code8.png

Judge whether the two strings are arranged with each other : Given two strings , Whether one is the arrangement of another

10. Optional chain operator

code9.png

MDN: Optional chain The operator ( ?. ) Allows you to read the value of an attribute deep in the chain of connected objects , Instead of explicitly verifying that each reference in the chain is valid .?.  The function of the operator is similar to  .  Chain operators , The difference is , The reference is empty (nullish ) (null  perhaps  undefined) It doesn't cause errors , The short-circuit return value of this expression is  undefined. When used with function calls , If the given function does not exist , Then return to  undefined

for example ：

if (res && res.data && res.data.success) {   
   //code
} 
 Copy code 

amount to ：

if (res?.data?.success) {
  // code
}
 Copy code 

11. Ternary operator

code10.png

12. Randomly select a value from the array

code11.png

13. Freeze objects

code12.png

14. Delete duplicate elements of the array

code13.png

15. Retention refers to the positioning of decimals

code14.png

16. Empty array

code15.png

17. from RGB Convert to HEX

code16.png

18. Get the maximum and minimum values from the array

code17.png

19. Null merge operator

code18.png

MDN: Null merge operator （??） It's a logical operator , When the operands on the left are  null  perhaps  undefined  when , Returns its right-hand operand , Otherwise, return the left-hand operand .

20. The value in the filter array is false Value

code19.png

Source code

20 A must not miss ES6 skill ^[2]

above , Codeword mapping is hard , Please don't be stingy with your praise , Your praise is the biggest driving force for me to continue to update ！

About this article

author ：Xieyezi

https://juejin.cn/post/7083145771461115941