Markdown 18 27

18-3 - Destructuring Objects.md

@@ -56,7 +56,7 @@ console.log(dogName) // what will it be? 0!
 
 ### Combining with Destructuring Renaming
 
-In my last post we learned that we can destrucutre and rename varaibles at the same time with something like this:
+[In my last post](http://wesbos.com/destructuring-renaming/) we learned that we can destrucutre and rename varaibles at the same time with something like this:
 
 ```js
 const person = {

19 - Destructing Arrays.md

@@ -2,7 +2,7 @@
 
 Did you know Destructuring also works with arrays? 
 
-Sometimes we have data where it's based on its index - or it's place in the array. Let's say you want to get the first, the second and the third thing out of that array.
+Sometimes we have data which is based on its index - or it's place in the array. Let's say you want to get the first, the second and the third thing out of that array.
 
 Traditionally we might be able to do something like this:
 
@@ -37,7 +37,7 @@ const data = 'Basketball,Sports,90210,23';
 ```
 
 
-That's the item name, the item category, the item SKU, and the item inventory left on hand. Problem is that it's just a string. That's not really helping us out. We do know that one thing that we can do if the data is perfectly separated by some sort of separator is we could use `data.split()` to split it up based on the comma. 
+That's the item name, the item category, the item SKU, and the item inventory left on hand. Problem is that it's just a string. That's not really helping us out. We do know that one thing we can do if the data is perfectly separated by some sort of separator is using `data.split()` to split it up based on the comma. 
 
 ```js
 const [itemName, category, sku, inventory] = data.split(',');
@@ -55,7 +55,7 @@ What happens to them when you destructure something that is not the same length
 
 ### A Look Ahead to ES6 Destructuring with ...rest 
 
-We're going to learn a more about the JavaScript ...rest in a future videos and blog posts, but There is a helpful use case in destructuring with using the rest. Let's say I have a team, and I want to know who's the **captain**, who's he **assisting captain**, and who is **the rest of the actual team**? I'm going to make myself a quick array here:
+We're going to learn more about the JavaScript ...rest in a future videos and blog posts, but there is a helpful use case in destructuring with using the rest. Let's say I have a team, and I want to know who's the **captain**, who's the **assisting captain**, and who is in **the rest of the actual team**? I'm going to make myself a quick array here:
 
 ```js
 const team = ['Wes', 'Harry', 'Sarah', 'Keegan', 'Riker'];

21.2 - Named arguments with ES6 Destrucuring.mdown

@@ -10,7 +10,7 @@ function tipCalc(total, tip = 0.15, tax = 0.13) {
 }
 ```
 
-That works well, because we know that the first thing is going to be `total`, second thing is going to be `tip`... or was it `tax`? Then the third one was either `tip` or `tax`. You see, We're already getting confused as to the order. Which order should I actually put them in? I might end up tipping too much, or maybe not enough.
+That works well, because we know that the first thing is going to be `total`, second thing is going to be `tip`... or was it `tax`? Then the third one was either `tip` or `tax`. You see, we're already getting confused as to the order. Which order should I actually put them in? I might end up tipping too much, or maybe not enough.
 
 There's some things we can do to make this order independent. 
 
@@ -22,7 +22,7 @@ function tipCalc({total, tip = 0.15, tax = 0.13}) {
 }
 ```
 
-You can see that we've wrapped the variables in `tipCalc` in curly brackets. Now, when we pass in a single object as the argument and it's going to destructure them into our three variables, `total`, `tip`, and `tax`. It's important to note that even though we are technically passing a single argument in the form of an object, it's not like we're going to have to use them like `options.total`, `options.tip`, and `options.tax`. 
+You can see that we've wrapped the variables in `tipCalc` in curly brackets. Now, when we pass in a single object as the argument, the function is going to destructure them into our three variables, `total`, `tip`, and `tax`. It's important to note that even though we are technically passing a single argument in the form of an object, it's not like we're going to have to use them like `options.total`, `options.tip`, and `options.tax`. 
 
 _This function will destructure them into three variables available inside of the actual function._
 
@@ -39,7 +39,7 @@ console.log(bill);
 
 If we refresh, we'll see in the console that we've got $266 as our total `bill`.
 
-But what is really important here is, first of all, I can leave things off, and we don't have to pass that undefined sort of hole-filler if it's in the middle like we used to:
+But what is really important here is, first of all, I can leave things off. We don't have to pass that undefined sort of hole-filler if it's in the middle like we used to:
 
 ```js
 function tipCalc({total, tip = 0.15, tax = 0.13}) {
@@ -61,7 +61,7 @@ const bill = tipCalc({tip: 0.20, total: 200});
 console.log(bill);
 ```
 
-That still works just as we want because passing in an object here, and it's getting destructured. What's more is that if we leave the one out from the object that we pass in, the defaults are filling themselves in. 
+That still works just as we want because we are passing in an object here, and it's getting destructured. What's more is that if we leave the one out from the object that we pass in, the defaults are filling themselves in. 
 
 One last thing is, if you ever are to just pass in nothing. Let's say if we put a default for the `total` be $100. This is maybe a common order and we would want to just run `tipCalc`:
 

22 - The for of loop.md

@@ -1,6 +1,8 @@
-We have a new type of loop in JavaScript, and that is the `for of loop` which is used to loop over any type of data that is an iterable. We're going to learn all about different types of iterables, and we're going to learn why this `for of` loop is so useful when we hit things like generators and maps and sets and so on. For now we want to get an idea as to how this loop actually works.
+We have a new type of loop in JavaScript, and that is the `for of loop` which is used to loop over any type of data that is an iterable.
 
-What is an iterable? An iterable is anything that can be looped over. If you have an array, you can loop over an array, or a string, or a map, or a set, or a generator. We're going to look at all kinds of different examples as to when you can do it, but let's get going with looking at some of the existing loops first, and see what are the shortcomings of our existing loops, and why does `for of` shine above all of them in a couple of use cases.
+We're going to learn all about different types of iterables, and we're going to learn why this `for of` loop is so useful when we hit things like generators and maps and sets and so on. For now we want to get an idea as to how this loop actually works.
+
+What is an iterable? An iterable is anything that can be looped over. If you have an array, you can loop over an array, or a string, or a map, or a set, or a generator. We're going to look at all kinds of different examples as to when you can do it, but let's get going  looking at some of the existing loops first, see what are their shortcomings, and why does `for of` shine above all of them in a couple of use cases.
 
 For the first one, we've got a survey right here, which is just a regular array with four items in it.
 
@@ -153,7 +155,7 @@ You may say, "That's fine but I never do that," but there are a lot of libraries
 
 For example, MooTools is known for modifying the prototype here. 
 
-If I am on a website; I'm not even going to use MooTools here, but I'm going to make an array with `var` names, and I want to iterate over them. I would say:
+If I am on a website, I'm not even going to use MooTools here, but I'm going to make an array with `var` names, and I want to iterate over them. I would say:
 
 ```js
 var names = ['wes', 'lux']

23 - The for of Loop in Action.md

@@ -36,7 +36,7 @@ Then `value: Array[2]`, and the first thing is going to be the index, `0`, and t
 
 If you click into another one, you'll find `Brisket`, `Shank`, and `Short Rib`, as well. 
 
-It tells us what the `index` does is and what the `Short Rib` is. Why would this be useful to us with `for of`? Because what you can do is iterate over not just the plain array, but we can also iterate over the `arrayIterator` which is `cuts.entries`, which will return our cuts with their index, `0`, `1`, `2`, and so on with their value as an array.
+It tells us what the `index` is and what the `Short Rib` is. Why would this be useful to us with `for of`? Because what you can do is iterate over not just the plain array, but we can also iterate over the `arrayIterator` which is `cuts.entries`, which will return our cuts with their index, `0`, `1`, `2`, and so on with their value as an array.
 
 ### A Dash of Destructuring 
 
@@ -58,11 +58,11 @@ Go ahead and run that, and you'll see `Chuck is the 1 item`, `Brisket is the 2 i
 
 What are we doing here? We're using `cuts.entries()` to bring us an iterator. What's great about `for of` is that it can handle almost anything that you throw at it. 
 
-You don't have to think, "What kind of data is this? Which of mine like `for in` or different loops that I have available to me should I use?" 
+You don't have to think, "What kind of data is this? Which syntax of mine like `for in` or different loops that I have available to me should I use?" 
 
 In almost all cases, except for objects, you can just use your `for of`, and just throw anything at it, and the `for of` loop is going to just figure out how to handle that data for you. So here I've destructured the data as we actually go on in, and we're off and running with that.
 
-## `for of` with `arguments
+## `for of` with `arguments`
 
 Let's look at another example where `for of` is useful, and that is when you're trying to iterate over the `argument` objects. 
 
@@ -98,7 +98,7 @@ addUpNumbers(10,20,42,62,598);
 
 Now that is a special word and it's going to be in kind of an array-ish format where it will give us all of the actual arguments. 
 
-That arguments is now what looks to be an array, it's not exactly an array of everything that got passed in. Why I'm so bent up on saying it's array-ish is because if you open it up in your console, you'll see a couple of things right here. First of all, the `prototype` is not `array`.
+That arguments is now what looks to be an array, it's not exactly an array of everything that got passed in. The reason I'm so bent up on saying it's array-ish is because if you open it up in your console, you'll see a couple of things right here. First of all, the `prototype` is not `array`.
 
 If you `console.log` a regular array and open it up in the console, you'll see that the `prototype` is `array`, and all the crazy array methods that we're used to, like `map` and `push` and everything we could possibly want, right? Because that has built up a proper array.
 
@@ -126,11 +126,11 @@ addUpNumbers(10,20,42,62,598);
 
 ```
 
-What I'm going to do is I'm going to say `let total=0`, start with zero and then I'm going to loop over each of them. So I'm going to say for num in arguments total + = num then we should be able to return the total here. That should add them all up, let's see. I'm going to console.log total as well just so we can see it.
+What I'm going to do is I'm going to say `let total = 0`, start with zero and then I'm going to loop over each of them. So I'm going to say for every `num` in `arguments` `total += num`, and then we should be able to return the total here. That should add them all up, let's see. I'm going to console.log total as well just so we can see it.
 
-And we get our total, `267`, because I created a variable and it looped through it and it updated every single one of them. Now, if I ever want to call add up numbers, we can just pass in any numbers we like by calling `addUpNumbers(10,10)` or `addUpNumbers(20,20)` or whatever we want. That is one example of what you could loop over it.
+And we get our total, `267`, because I created a variable and it looped through it and updated every single one of them. Now, if I ever want to call add up numbers, we can just pass in any numbers we like by calling `addUpNumbers(10,10)` or `addUpNumbers(20,20)` or whatever we want. That is one example of what you could loop over it.
 
-You do not need to convert to a true array, you can just use the `for of` to iterate over it. 
+You do not need to convert `arguments` to a true array, you can just use the `for of` to iterate over it. 
 
 ### `for of` with Strings
 
@@ -147,7 +147,7 @@ As a note, you have make sure you put a `const`, `let`, or `var` in front of you
 
 ### `for of` with NodeLists and HTMLCollections
 
-Finally, you can also loop over DOM collections without having to convert to a true array. DOM collections, or `NodeList` collections, or HTML collections, whatever you're going to call them, they are being changed so that you will have all of your `.forEach`, and `.map`, and all of those array methods that you're used to. However, in most browsers they are not a true array, so we could use the `for of`, no problem there.
+Finally, you can also loop over DOM collections without having to convert them to a true array. DOM collections, or `NodeList` collections, or HTML collections, whatever you're going to call them, they are being changed so that you will have all of your `.forEach`, and `.map`, and all of those array methods that you're used to. However, in most browsers they are not a true array, so we could use the `for of`, no problem there.
 
 ```html
  <p>Hi I'm p 01</p>
@@ -160,7 +160,7 @@ Finally, you can also loop over DOM collections without having to convert to a t
 We've now got a whole bunch of paragraphs on the page here, and we want to select them:
 
 ```js
-const ps = document.querySelector('p');
+const ps = document.querySelectorAll('p');
 console.log(ps);
 ```
 
@@ -169,7 +169,7 @@ If you open pen it up in the console, you can see that it's not a true array, it
 Let's loop over them:
 
 ```js
-const ps = document.querySelector('p');
+const ps = document.querySelectorAll('p');
 for (const paragraph of ps) {
     console.log(paragraph);
 }
@@ -178,7 +178,7 @@ for (const paragraph of ps) {
 You see that you'll get each one here, and that's useful if you want to do something like an `addEventListener` to show the contents of your `<p>` tag:
 
 ```js
-const ps = document.querySelector('p');
+const ps = document.querySelectorAll('p');
 for (const paragraph of ps) {
     paragraph.addEventListener('click', function() {
         console.log(this.textContent);

24 - Using for of with Objects.md

@@ -23,7 +23,7 @@ for (const prop of apple.entries()){
 }
 ```
 
-We don't have this quite yet, but if you take a look at the [TC39 proposal on GitHub](https://github.com/tc39/proposal-object-values-entries), we'll see that `Object.values` and `Object.entries` and will be included in ES2017, and you can already [polyfill it](https://github.com/es-shims/Object.entries). We'll talk a lot more about polyfilling, but if you would like to use that simple solution, you can go ahead and you can use `.entries`.
+We don't have this quite yet, but if you take a look at the [TC39 proposal on GitHub](https://github.com/tc39/proposal-object-values-entries), we'll see that `Object.values` and `Object.entries` and will be included in ES2017, and you can already [polyfill `Object.entries`](https://github.com/es-shims/Object.entries). We'll talk a lot more about polyfilling, but if you would like to use that simple solution, you can go ahead and you can use `.entries`.
 
 If you cannot use a polyfill, let's take a look at some of our other options here. 
 

25 - Array.from() and Array.of().md

@@ -15,14 +15,14 @@ What do these do? `Array.from` will take something that is array-ish and turn it
 Let's go ahead and select and `console.log` all the people:
 
 ```js
-const people = document.querySelector('.people p');
+const people = document.querySelectorAll('.people p');
 console.log(people);
 ```
 
 But what if I wanted just an array of the people's names? I could use `.map`:
 
 ```js
-const people = document.querySelector('.people p');
+const people = document.querySelectorAll('.people p');
 const names = people.map(person => person.textContent);
 ```
 
@@ -36,7 +36,7 @@ What do we need to do in order to make this map work? We simply would have to ma
 
 
 ```js
-const people = document.querySelector('.people p');
+const people = document.querySelectorAll('.people p');
 const peopleArray = Array.from(people);
 console.log(peopleArray);
 ```
@@ -46,7 +46,7 @@ If we open `peopleArray` in the inspector, its prototype is now `Array`, and you
 You can call `Array.from` onto it:
 
 ```js
-const people = document.querySelector('.people p');
+const people = document.querySelectorAll('.people p');
 const peopleArray = Array.from(people);
 console.log(peopleArray);
 const names = peopleArray.map(person => person.textContent);
@@ -68,9 +68,9 @@ const peopleArray = Array.from(people, person => person.textContent);
 console.log(peopleArray);
 ```
 
-### Converting Arguments Object to an Array
+### Converting the `arguments` Object to an Array
 
-Another use case is that if we want to convert the arguments object into an actual array.
+Another use case is that if we want to convert the `arguments` object into an actual array.
 
 ```js
 function sumAll() {