Array Destructuring Memo | JavaScript: The Recent Parts

Time:2021-1-20

ref:
Kyle Simpson’s JavaScript:The Recent Parts on Frontend Master

Destructuring is about assignment instead of declaration.

Normally we could have a better declarative presentation of the data pattern that we expect to be passed in by using Destructuring.

Destructuring syntax is esssentially sugar for refine imperative things we did before, any error happened before also happens in destructuring unless very few diverision.

Here we have 2 ways to compare non-destructuring assignment solution with destructuring pattern solution, and learn how destructuring can make it better declarative be.

1) element is missing? both will return undefined

Array Destructuring Memo | JavaScript: The Recent Parts

2)element is over-provided? both will ignore

Array Destructuring Memo | JavaScript: The Recent Parts

3)element missing in the middle? both will reutrn undefined

Array Destructuring Memo | JavaScript: The Recent Parts

4)!== undefined? both will replace with default value

Array Destructuring Memo | JavaScript: The Recent Parts

5)gather all elements left behind

Array Destructuring Memo | JavaScript: The Recent Parts

6)set a relay variable also is fine

Array Destructuring Memo | JavaScript: The Recent Parts

7)feel free to declare firstly

Array Destructuring Memo | JavaScript: The Recent Parts

8)as long as it is a valid position, anything could be at the left side on the =

Array Destructuring Memo | JavaScript: The Recent Parts

9)destructuring pattern always point to the entire array

Array Destructuring Memo | JavaScript: The Recent Parts

10)using comma ,to skip

Array Destructuring Memo | JavaScript: The Recent Parts

11)declarative to swap values by destructuring

Array Destructuring Memo | JavaScript: The Recent Parts

12)put destrucuring pattern at parameter position

Array Destructuring Memo | JavaScript: The Recent Parts

13)fixing unexpected data value with setting default values

Array Destructuring Memo | JavaScript: The Recent Parts

14)also works in parameter position

Array Destructuring Memo | JavaScript: The Recent Parts

15)also works on single element

Array Destructuring Memo | JavaScript: The Recent Parts

16)nested array has nested des-pattern

Array Destructuring Memo | JavaScript: The Recent Parts

17)default values also fix unexpected data value in nested array

Array Destructuring Memo | JavaScript: The Recent Parts

*setting default values is a good habit, remember to do it in advance.

Recommended Today

Cartoon, programmer and product manager

Internet crime series Internet crimes series – Preface On the first day of work, the front-end sued the county government and listed five crimes This cartoon isInternet crime series#2」 This is about the last time Wang Da Na sued the back end, the company’s product managers made various kinds of demons, abuse and exploitation, which […]