Using console.group to Group Debugging Messages
If we use console.log in the for loop, it may produce too many debugging messages to read. It’s a good time to use the console.group to group them under a group.
Using console.table to Display Array of Objects
Besides using console.log to display debugging messages, we can use console.table to display Array of Objects for a better layout.
Using CSS Inline Style with console.log
Not only just showing debugging messages on the console of DevTools, but we can also use CSS to change their style.
Using Symbol to Add Object Property
If we want to add Object property at runtime, it chanced that we override property of original Object. Since Symbol is a unique value, using Symbol Property to prevent property from overriding.
Using Object and Symbol to Simulate Enums
If we only allow limited values for arguments, using Enums is a good choice. Unfortunately, we don’t have native Enums in JavaScript, but we can use Object and Symbol to simulate it.
Using entries to get Index and Element from Array
ECMAScript 2015 introduced Array.prototype.entries, which returns index and element from Array.
Using Object.entries to Get Key and Value
If we want to get key and value from Object simultaneously, we used to use Object.keys to get all keys, and then use [] with the key to get value. Now we can use Object.entries to get key and value at once.
Always Passing Object to Function
Object Destructuring was introduced by ECMAScript 2015. Using it with function argument, we can implement Pass By Name feature in ECMAScript.
使用 for await of 處理 Array Promise
當 ECMAScript 2015 引進 Promise 概念後，實務上會遇到 Array Promise，若要搭配 ECMAScript 2017 的 async await，可使用 for await of 讓 Codebase 更精簡。