ES6 for Everyone notes from Wesbos's tutorial. http://wesbos.com/es6-for-everyone/

aa.es6_for_everyone.js

console.log('Es6 for everyone tuturial from Wesbos');

ab.arrow_functions.js

const names = ['wes', 'kait', 'lux'];

const fullNames = names.map(function(name) {
	return `${name} bos`;
});

const fullNames2 = names.map((name) => {
	return `${name} bos`;
});
// without return
// Burada tek parametre(name) oldugu için (name) olarak parantezli yazmamıza gerek yoktur.
const fullNames3 = names.map(name => `${name} bos`);

// Eğer parametre kullanılmıcaksa () kullanılabilir.
const fullNames4 = names.map(() => `cool bos`);

// Define funtion
const sayMyName = (name) => { alert(`Hello ${name}`) };


const race = '100m Dash';
const winners = ['Hunter Gath', 'Singa Song', 'Imda Bos'];

//Eğer geriye obje dönülmek isteniyorsa obje () içine alınmalıdır.
const win = winners.map((winner, i) => 	({name: winner, race:i, place:i}));

// Hint:
// console.table(object) kullanımı ile objeler tabloya dönüştürülerek consola basılabilir.


const ages = [23, 62, 12, 12,10, 83];

// filter bu şekilde basitce kullanılabilir.
const old = ages.filter(age => age > 50);

ac.arrow_functions_and_this.js

const box = document.querySelector('.box');

// Burada arrow function kullansaydık this ile elemente erişemezdik. 
// Bu yüzden normal function kullanmamız gerekiyor.
box.addEventListener('click', function(){
this.classList.toggle('opening');
// Burada arrow function degilde normal function tanımlaması yapılır ise farklı bir
// scope alanına geçildigi için this ile .box elementine erişilemez. 
// Erişmek için ise şöyle bir yöntem kullanılabilir.
// const that = this;

let first = 'opening';
let second = 'open';

if(this.classList.contains(first)){
	// python gibi bu şekilde değişkenlerin yerleri değiştirilebilir.
	[first, second] = [second, first];
}
setTimeout(() => {
	this.classList.toggle('open');
}, 500);
});

// # Default function arguments
function calculateBill(total, tax = 0.13, tip = 0.15){
return total + (total * tax) + (total * tip);
}

// Bu şekilde kullanılabilir. tax=0.13 tip=0.25
const totalBill = calculateBill(100, undefined, 0.25);

ad.arrow_functions_exercises.js

const items = Array.from(document.querySelectorAll('[data-time]'));

// filter for only the elements that contain the work 'flexbox'
const filtered = items.
filter(item => item.textContent.includes('Flexbox'))
// map down to a list of time strings
.map(item => item.dataset.time) // data-time
// map to an array of seconds
.map(timecode => {
  const parts = timecode.split(':').map(part => parseFloat(part));
  return (parts[0] * 60) + part[1];
})
// reduce to get total
.reduce((runningTotal, seconds) => runningTotal + seconds,0);

ae.not_use_arrow_functions.js

// # Arrow function ne zaman kullanılmamalı

// When you really need `this` 
const button = document.querySelector('#pushy');
button.addEventListener('click', function() {
	this.classList.toggle('on');
});

// When you need a method to bind to an object
const person = {
	points: 23,
	score() {
		// If you use arrow function you can not access points with this
		this.points++;
	}
}

// When you need to add a prototype method
class Car {
	constructor(make, colour) {
		this.make = make;
		this.colour = colour;
	}
}

const beemer = new Car('bmw', 'blue');
const subie = new Car('Subaru', 'white');

Car.prototype.summarize = function() {
	return `this car is a ${this.make}`;
}

// When you need arguments object
//const orderChildren = () => { ... argumentse erişilemez.
const orderChildren = function() {
	const children = Array.from(arguments);
	return children.map((child, i) => {
		return `${child} was child #${i + 1}`;
	});
	console.log(arguments);
}
orderChildren('jill', 'wes', 'jenna');

af.string_methods.js

// # String methods

const course = 'RFB2';
const flightNumber = '20-AC2018-js';
const accountNumber = '843123234234';

const make = 'BMW';
const model = 'x5';
const colour = 'Royal Blue';

// .startsWith()
// .endsWith()
// .includes()
// .repeat()

ag.template_strings.js

const name = 'Snickers';
const age = 2;
const sentence = 'My dog ' + name + ' is' + age * 7 + ' years old.';
const sentence2 = `My dog ${name} is ${age * 7} years old.`;

// Creating HTML fragments with Template Literals
const worker = {
name: 'Wes',
job: 'Web Developer',
city: 'Hamilton',
bio: 'Wes is a really cool guy that loves to teach web development!'
}

const markup = `
<div class="person">
  <h2>
  ${worker.name}
    <span class="job">${worker.job}</span>
  </h2>
  <p class="location">${worker.city}</p>
  <p class="bio">${worker.bio}</p>
</div>
`;

document.body.innerHTML = markup;

const dogs = [
  { name: 'Snickers', age: 2},
  { name: 'Hugo', age: 8}
];

// we can use map function inside ${}
const markup2 = `
<ul class="dogs">
  ${dogs.map(dog => `<li>${dog.name} is ${dog.age * 7}</li>`).join('')}
</ul>
`;
document.body.innerHTML = markup2;

const song = {
  name: 'Dying to live',
  artist: 'Tupoc',
  featuring: 'Biggie Smalls'
};

const markup3 = `
<div class="song">
  <p>
  ${song.name} - ${song.artist}
  ${song.featuring ? `(Featuring ${song.featuring})` : ''}
  </p>
</div>
`;
document.body.innerHTML = markup3;

// # tagged templates
function highlight(strings, ...values){
let str = '';
strings.forEach((string, i) => {
  str += string + (values[i] || '');
}); 
return str;
}

const n = 'Snickers';
const a = 100;

const s = highlight`My dog's name is ${n} and he is ${a} years old. `;

ah.destructuring_objects.js

const person2 = {
  first: 'Wes',
  last: 'Bos',
  country: 'Canada',
  city: 'Hamilton',
  twitter: '@wesbos'
};

// const first = person.first;
// const last = person.last;
// or
const { first, last, twitter } = person2;
// or => person içindeki first değeri f değişkenine atanır.
const { first:f, twitter: t} = person2;

const settings = { width: 3, color: 'black' } // height, fontSize
const { width, height, color, fontSize } = settings;
// color ve fontSize settings içerisinde olmadığı için undefined olur.
// Bu durum için default değer verilebilir.
const { width = 100, height = 100, color = 'blue', fontSize = 25} = settings;
console.log(width); // 3
console.log(color); // blue

ai.destructuring_array.js

const details = ['Wes Bos', 123, 'wesbos.com'];

//const name = details[0];
//const id = details[1];
const [name, id, website] = details;
console.log(name, id, website)

const data = 'Basketball,Sports,90210,23,cool';
const [itemName, category, sku, inventory] = data.split(',');

const team = ['Wes', 'Harry', 'Sarah', 'Keegan', 'Riker'];
const  [captain, assistant, ...players] = team;
console.log(players) // ["Sarah", "Keegan", "Riker"]

aj.swapping_variables_with_destructuring.js

let inRing = 'Hulk Hugon';
let onSide = 'The Rock';
[inRing, onSide] = [onSide, inRing];
console.log(inRing, onSide) // The Rock, Hulk Rogan

ak.destructuring_functions.js

function convertCurrency(amount) {
  const converted = {
    USD: amount * 0.76,
    GPB: amount * 0.53,
    AUD: amount * 1.01,
    MEX: amount * 13.30
  };
  return converted;
}

// const hundo = convertCurrency(100);
const { USD, GPB, AUD, MEX } = convertCurrency(100);

function tipCalc({ total, tip = 0.15, tax = 0.13 }) {
  return total + (tip * total) + (tax * total);
}

const bill = tipCalc({ total: 200, tip: 0.20});
console.log(bill); // 206 tax = 0.13

tipCalc() // Bu kullanım hata verecektir. Default object tanımlaması aşağıdaki gibi yapılabilir.

function tipCalc({ total, tip = 0.15, tax = 0.13 } = {}) {
  return total + (tip * total) + (tax * total);
}

tipCalc(); 

al.for_of_loop_in_action.js

const cuts = ['Chuck', 'Brisket', 'Shank', 'Short Rib'];

for (const [i, cut] of cuts.entries()) {
  console.log(cut, i);
}


function addUpNumbers() {
  // arguments bize argüman listesini verir. 
  console.log(arguments); // Arguments(8) [10, 23, 12, 34, 12, 3, 1, 23, callee: ƒ, Symbol(Symbol.iterator): ƒ]

  let total = 0;
  for (const num of arguments) {
    total += num;
  }
  console.log(total);
  return total;
}

addUpNumbers(10,23,12,34,12,3,1,23);

const ps = document.querySelectorAll('p');

for (const paragraph of ps) {
  paragraph.addEventListener('click', function() {
    console.log(this.textContent);
  })
}

am.for_of_loop.js

const cuts = ['Chuck', 'Brisket', 'Shank', 'Short Rib'];

for (let i = 0; i < cuts.length; i++) {
  console.log(cuts[i]);
}

cuts.forEach((cut) => {
  console.log(cut);
});

// in gives index
for(const index in cuts) {
  console.log(index); // 0 1 2 3 
  console.log(cuts[index])  
}

// of gives element
 for(const cut of cuts) {
  console.log(cut); // Chuck Brisket ....
 }

an.for_with_objects.js

const apple = {
  color: 'Red',
  size: 'Medium',
  weight: 50,
  sugar: 10
};

for (const prop of Object.keys(apple)) {
  console.log(prop);
  console.log(apples[prop]);
}

ao.array_from_and_of.js

// Array.from() and Array.of()
const people = Array.from(document.querySelectorAll('.people p'));
const names = people.map(person => person.textContent);

// Array.from ikinci argüman olarak map function alabilir.
const names2 = Array.from(document.querySelectorAll('.people p'), person => {
  return person.textContent;
});


function sumAll() {
  console.log(arguments) // arguments array degildir. 

  const nums = Array.from(arguments);
  return nums.reduce((prev, next) => prev + next, 0);
}
console.log(sumAll(1,2,3,4,5,6))

const ages = Array.of(12,4,12,32,11);
console.log(ages);

ap.array-find-findIndex.js

const posts = [
   {
      "code":"BAcyDyQwcXX",
      "caption":"Lunch #hamont",
      "likes":56,
      "id":"1161022966406956503",
      "display_src":"https://scontent.cdninstagram.com/hphotos-xap1/t51.2885-15/e35/12552326_495932673919321_1443393332_n.jpg"
   },
   {
      "code":"BAcJeJrQca9",
      "caption":"Snow! ⛄️🌨❄️ #lifewithsnickers",
      "likes":59,
      "id":"1160844458347054781",
      "display_src":"https://scontent.cdninstagram.com/hphotos-xaf1/t51.2885-15/e35/12407344_1283694208323785_735653395_n.jpg"
   },
   {
      "code":"BAF_KY4wcRY",
      "caption":"Cleaned my office and mounted my recording gear overhead. Stoked for 2016!",
      "likes":79,
      "id":"1154606670337393752",
      "display_src":"https://scontent.cdninstagram.com/hphotos-xpf1/t51.2885-15/e35/923995_1704188643150533_1383710275_n.jpg"
   },
   {
      "code":"BAPIPRjQce9",
      "caption":"Making baby pancakes for one early rising baby. ☕️🍴",
      "likes":47,
      "id":"1157179863266871229",
      "display_src":"https://scontent.cdninstagram.com/hphotos-xap1/t51.2885-15/e35/12407480_1654828594805097_152207166_n.jpg"
   },
];

const post = posts.find(post => post.code === 'BAcyDyQwcXX');
console.log(post);

const postIndex = posts.findIndex(post => post.code === 'BAcyDyQwcXX');
console.log(postIndex);

aq.array-some-every.js

const ages = [32, 15, 19, 12];

// is there at least one adult in the group
const adultPresent = ages.some(age => age >= 18);
console.log(adultPresent) // true

// is everyone old enough to drink?
const allOldEnough = ages.every(age => age >= 19);
console.log(allOldEnough); // false

ar.spread-operator.js

const featured = ['Deep Dish', 'Peperoni', 'Hawaiian'];
const specialty = ['Meatzza', 'Spicy Mama', 'Margherita'];

const pizzas = [...featured, 'veg', ...specialty];
const fridayPizzas = [...pizzas];

as.spreading_into_function.js

const inventors = ['Einstein', 'Newton', 'Galileo'];
const newInventors = ['Musk', 'Jobs'];

inventors.push.apply(inventors, newInventors);
console.log(inventors); // ["Einstein", "Newton", "Galileo", "Musk", "Jobs"]

// or
inventors.push(...newInventors);
console.log(inventors);

const name = ['Wes', 'Bos'];

function sayHi(first, last) {
	alert(`Hey there ${first} ${last}`)
}

sayHi(...name);

at.rest_params.js

function convertCurrency(rate, ...amounts) {
  return amounts.map(amount => amount * rate);
}
convertCurrency(1.54, 10, 23, 12, 11, 10.7);

const runner = ['Wes Bos', 123, 5.5, 5, 2, 23, 12];
const [name, id, ...runs] = runner;

const team = ['Wes', 'Kait', 'Lux', 'Sheena', 'kelly'];
const [captian, assistant, ...players] = team;

au.object-literal-upgrades.js

const first = 'snickers';
const last = 'bos';
const age = 2;
const breed = 'King Charles Cav';

const dog = {
  firstName: first,
  last,
  age,
  breed
};		

const key = 'pocketColor';
const value = '#ffc600';

const tShirt = {
  [key]: value,
  [`${key}Opposite`]: '#ff0000'
};

console.log(tShirt); // {inkColor: "#ffc600"}

const keys = ['size', 'color', 'weight'];
const values = ['medium', 'red', 100];

const shirt = {
  [keys.shift()]: values.shift(),
  [keys.shift()]: values.shift(),
  [keys.shift()]: values.shift(),
};

console.log(shirt);

av.create_promise.js

const p = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('It is cool');
  }, 1000);
});

p.then(data => {
  console.log(data);   
})
.catch(err => {
  console.log(err);
});

ay.promise.js

const posts = [
  {title: 'I love Javascript', author: 'Wes Bos', id: 1},
  {title: 'CSS', author: 'Chris Coyier', id: 2},
  {title: 'Dev tools tricks', author: 'Addy Osmani', id: 3},
];

const authors = [
  {name: 'Wes Bos', twitter: '@wesbos', bio: 'Canadian Developer'},
  {name: 'Chris Coyier', twitter: '@chriscoyier', bio: 'Css Tricks and Codepen'},
  {name: 'Addy Osmani', twitter: '@addyosmani', bio: 'Googler'}
];

function getPostById(id) {
  return new Promise((resolve, reject) => {
    const post = posts.find(post => post.id === id);
    if(post) {
      resolve(post);
    } else {
      reject(Error('NO post was found!'))
    }
  });
}

function hydrateAuthor(post) {
   return new Promise((resolve, reject) => {
    const authorDetails = authors.find(person => person.name === post.author);
    console.log(authorDetails);
    if(authorDetails) {
      post.author = authorDetails;
      resolve(post);
    } else {
      reject(Error('Can not find.'))
    }
   });
}

getPostById(2).then(post => {
  console.log(post);
  return hydrateAuthor(post);
}).then(post => {
  console.log(post);
}).catch(error => {
  console.log(error);
});

az.multiple_promises.js

const weather = new Promise((resolve) => {
  setTimeout(() => {
    resolve({ temp: 29, conditions: 'Sunnt with Clouds'});
  }, 2000);
});

const tweets = new Promise((resolve) => {
  setTimeout(() => {
    resolve(['T like cake', 'BBQ is good too!']);
  }, 500);
});

// call promises
Promise
.all([weather, tweets])
.then(responses => {
  console.log(responses); // array
  const [weather, tweets] = responses;
  console.log(weather); 
})

ba.class.js

class Dog {
  constructor(name, breed) {
    this.name = name;
    this.breed = breed;
  }
  bark() {
    console.log('bark bark');
  }
  cuddle() {
    console.log('I love you owner');
  }
  static info() {
    console.log('A dog is better than a cat by 10 times')
  } // Dog.info()
  get description() {
    return `${this.name} is a ${this.breed} type of dog.`;
  } // property
  set nicknames(value) {
    this.nick = value.trim();
  }
  get nicknames() {
    return this.nick;
  }
}
const snickers = new Dog('Snickers', 'King Charles');
snickers.description;
snickers.nicknames = 'snicky';
console.log(snickers.nicknames);

bb.extend_class.js

class Animal {
  constructor(name) {
    this.name = name;
    this.thirst = 100;
    this.belly = [];
  }
  drink() {
    this.thirst = -10;
    return this.thirst;
  }
  eat(food) {
    this.belly.push(food);
    return this.belly;
  }
}

class Dog extends Animal {
  constructor(name, breed) {
     super(name);
     this.breed = breed;
  }
  bark() {
    console.log('Bark bak I\'m a dog');
  }
}

const rhino = new Animal('Rhiney');
const snickers = new Dog('Snickers', 'King Charles');

bc.extending_array.js

class MovieCollection extends Array {
  constructor(name, ...items) {
    super(...items);
    this.name = name; 
  }
  add(movie) {
    this.push(movie);
  }
  topRated(limit = 10) {
    return this.sort((a, b) => (a.stars > b.stars ? -1 : 1)).slice(0, );
  }
}

const movies = new MovieCollection('Wes\'s Fav Movies',
    { name: 'S', stars: 4 },
    { name: 'Start Wars', stars: 1 },
    { name: 'Bee Movie', stars: 10 }
  );

for (const movie of movies) {
  console.log(movie)
}

bd.generators.js

function* listPeople() {
yield 'Wes';
yield 'Kait';
yield 'Snickers';
}

const people = listPeople();

const inventors = [
  { first: 'Albert', last: 'Einstein', year: 1879 },
  { first: 'Isaac', last: 'Newton', year: 1643 },
  { first: 'Galileo', last: 'Galilei', year: 1564 },
  { first: 'Marie', last: 'Curie', year: 1867 },
  { first: 'Johannes', last: 'Kepler', year: 1571 },
  { first: 'Nicolaus', last: 'Copernicus', year: 1473 },
  { first: 'Max', last: 'Planck', year: 1858 },
];

function* loop(arr) {
  for (const item of arr) {
    yield item;
  }
}

const inventorGen = loop(inventors);
inventorGen.next();

be.generators_for_ajax.js

function ajax(url) {
  fetch(url).then(data => data.json()).then(data => dataGen.next(data));
} 

function* steps() {
  console.log('fetching beers');
  const beers = yield ajax('http://api.react.beer/v2/search?q=hops&type=beer');
  console.log(beers);
  console.log('fetching wes');
  const wes = yield ajax('https://api.github.com/users/wesbos');
  console.log(wes);
  console.log('fetching fat joe');
  const fatJoe = yield ajax('https://api.discogs.com/artists/51988');
  console.log(fatJoe);
}

const dataGen = steps();
dataGen.next();