Everything you need to Learn ES6 over at ES6.io
Got this course for free from Wes Bos as an appreciation gift ❤️ Started looking at the overview of this course and setting up Slack.
Thoughts:
- Completed Module #1 New Variables - Creation, Updating and Scoping
var
is function scope- We can redeclare it multiple times in same scope
let
&const
are block scope- We can not redeclare it twice in same scope
- You can update a
let
variable, butconst
variables cannot be updated - However, the properties of a
const
variable can change. That's because the entire object is not immutable. - Came to know about Object.freeze(), so that nothing can be added to or removed from the properties set of a frozen object.
- Also, completed Module #2 Function Improvements: Arrows and Default Arguments
- I had known about Arrow Functions from the #Javascript30 course, but more in details about it today
- Learnt more about arrow functions, implicit returns, when & when not to use arrow functions,
this
inside arrow functions - Also, about default function arguments
Completed Module #3 - Template Strings
Thoughts: Learnt about:-
- Template strings, creating html fragments with template literals
- Using if, loop and functions inside template strings
- Tagged templates, some use cases and sanitizing user data with tagged templates
- Found about DOMPurify which helps to sanitize data in DOM
Completed Module #4 - Additional String Improvements
Thoughts:
- Learnt about
startsWith()
,endsWith()
, includes() & repeat() methods and did some practice related to them - Also, looked into
str.endsWith(searchString[, length])
andstr.startsWith(searchString[, position])
Completed Module #5 - Destructuring
Thoughts:
- Learnt about destructuring objects, renaming variables and default values
- Learnt about destructuring arrays, functions and swapping variables
- Snippets 1:
const { first, last, twitter } = someObjectHere
- Snippets 2:
const [ first, last, twitter ] = someArrayHere
Completed Module #6 - Completed Module #6 Iterables & Looping
Thoughts:
- Learnt about some advantages of
for of
loop overfor
,foreach
andfor in
for-of
makes is easier for looping through array elements and most array-like objects like DOM NodeList, arguments- Learnt about
Array.prototype.entries()
method and how we can use it withfor-of
loop - Snippets 1:
for (const cut of cuts)
, just to get the values - Snippets 2:
for (const [i, cut] of cuts.entries())
, used to both index and value
Completed Module #7 - An Array of Array Improvements
Thoughts:
- Learnt about
Array.from()
&Array.of()
method - Array prototype methods like
find
,findIndex
,some
&every
- Use Case 1 for
Array.from()
- Use Case 2 for Array.prototype
.some()
&.every()
Completed Module #8 - Say Hello to ...Spread and ...Rest
Thoughts:
- Learnt about ...Spread operator & ...Rest parameters and there various use cases with lots of examples
- Some use cases for
Rest parameters
Completed Module #9 - Object Literal Upgrades
Thoughts:
- Learnt about some handy stuffs like property value shorthand, method definition shorthand and computed property keys
Completed Module #10 - Promises
Thoughts:
- Learnt about how Promises works, creating my own promises, chaining them and working with multiple promises
- As the Promise.prototype.then() and Promise.prototype.catch() methods return promises, they can be chained like
- Chaining promises
Completed Module #11 - Symbols (Newest primitive data type)
Thoughts:
- Learnt about Symbol data type and various use cases.
- We can use it as object key as unique identifier
Thoughts:
- Learnt about ESLint and it's usability
- Also, looked into the Airbnb's settings and did some practice
- Looked into various ESLint rules and tried to understand their importance and when to use them.
Thoughts:
- Today learnt about ESLint file & line specific settings for enabling/disabling rules
- More info here
Thoughts:
- Completed Module #12 - Code Quality with ESLint
- Today learnt about JavaScript modules and WebPack 2 tooling setup
Thoughts:
- Learnt about creating our own JavaScript modules and importing/exporting them
- Also, looked into export statement and various syntax.
Thoughts:
- Completed Module #13 - JavaScript Modules and Using npm
- Did more practice on ES6 Modules
- Learnt about how to import specific modules when its needed
Thoughts:
-
Completed Module #14 - ES6 Tooling
-
Learnt about SystemJS, Babel & Polyfills for ES6
-
Polyfills gives very good coverage for all ES6 features in old browsers
-
Completed Module #15 - Classes
-
Learnt about creating a new class (declaration-form), defining static methods & prototype methods, get & set methods
-
Also, learnt about extending an existing class, subclassing methods of a parent class and subclassing built-ins
-
Simple use case for Subclassing built-in classes and DOM here
Thoughts:
- Completed Module #16 - Generators
- Learnt about Generators function, which returns a Generator object. Using it for ajax flow control (awesome stuff)
- Simple use-case for
Generators
Thoughts:
- Learnt about ES6 Proxies and its various use cases.
- It provide JavaScript with an intercession API, enabling us to trap or intercept all of the operations on a target object and modify how this target operates
Thoughts:
- Completed Module #18 - Sets and WeakSets
- The
Set
object lets us store unique values of any type, whether primitive values or object references. - The
WeakSet
object lets us store weakly held objects in a collection. - If there is no other reference to an object stored in the
WeakSet
, they can be garbage collected. - Also,
WeakSet
are not enumerable
Thoughts:
- Completed Module #19 - Map and Weak Map
- A
Map
object holds key-value pairs. - The
Map
object iterates its elements in insertion order - afor...of
loop returns an array of[key, value]
for each iteration. - The
WeakMap
object is a collection of key/value pairs in which the keys are weakly referenced.
Thoughts:
- This course was updated recently.
- Updated for ES7/ES2016 and ES8/ES2017 including Async+Await, Babel 7 and more!
- Started looking into it from today.
- Started with native promises and its use-cases.
- Also looked into creating custom promises.
Thoughts:
- Today I reviewed the Async+Await once more.
- Also, looked into a generic way for error handling async functions.
Thoughts:
- Today I looked into using multiple promises.
- Looked into one more use case for
Promise.all()
- Learned about how we can promisify functions so that we can use Async+Await on the them.
Thoughts:
- Today I looked into some new & future language additions
- Looked into Class properties
- Also, looked into ES8
padStart
andpadEnd
- ES7 Exponentiation Operator
- Trailing commas (sometimes called "final commas") in literals
Thoughts:
- Today I looked into use cases of
Object.entries()
andObject.values()
- Learned about how it can be used in specific scenarios.
- Fnially finished the course 🎉