Ivan Asmer 6 سال پیش
والد
کامیت
b49a57b3d2
1فایلهای تغییر یافته به همراه154 افزوده شده و 0 حذف شده
  1. 154 0
      ES6.md

+ 154 - 0
ES6.md

@@ -0,0 +1,154 @@
+# Синтаксический сахар в ES6.
+
+
+*Синтаксический сахар* - ряд усовершенствований в синтаксисе языка, не несущих семантического смысла. Обычно синтаксический сахар легко заменяется более пространным и менее прозрачным синтаксисом, и при этом код работает так же.
+Отличия между **ES5** и **ES6** в-основном в сахаре и заключаются.
+
+## Стрелочные функции.
+
+Синтаксически это `=>`, параметры до этой пары символов, выражение-результат функции - после:
+
+```javascript
+var sqr = x => x*x //один параметр, скобки не нужны
+alert(sqr(2))
+
+var mul = (x,y) => x*y //два параметра - нужны скобки
+alert(mul(2,5))
+
+var objectCreator = (x,y) => ({x, y}) //создает объект {x: x, y: y}. Если забыть скобки - то JS воспримет {x,y} как блок кода, и без return вернет undefined
+console.log(objectCreator(4,5))
+
+var longFunc = (x,y) => { //почти обычная функция
+    let result = prompt(x,y)
+    return result;
+}
+
+longFunc('check', 'text')
+
+({arrowFuncMaker: function(){ 
+        return () => {console.log(this), this.oldSchoolSklerotikMaker()()}
+    },
+  oldSchoolSklerotikMaker: function(){
+        return function(){
+            console.log(this)
+        }
+  }
+}).arrowFuncMaker()() //стрелочные функции помнят this на момент создания.
+```
+
+Свойства стрелочных функций:
+- Они анонимные. Синтаксис не предусматривает имени функции.
+- Они помнят `this`.
+
+В целом стрелочные функции могут быть заменены следующим синтаксисом **ES5**:
+
+```javascript
+var func = (function(x, y, z){
+    console.log(this)
+    return x + y + z
+}).bind(this) //bind прибивает this при объявлении функции
+```
+
+## Параметры по умолчанию.
+
+Знакомы некоторым по другим языкам:
+
+```javascript
+var pow = sqr = (x, power = 2) => Math.pow(x, power)
+console.log(pow(2,5))
+console.log(sqr(2)) //квадрат по умолчанию
+```
+
+В **ES5** для этого обычно использовали проверку на `undefined`:
+```javascript
+var pow = sqr = function(x, power){ 
+                    return Math.pow(x, power || 2)
+                }
+console.log(pow(2,5))
+console.log(sqr(2)) //квадрат по умолчанию
+```
+
+## rest/spread `...`
+
+Теперь можно, при вызове указать массив в качестве параметров, или же, наоборот, получить параметры как массив:
+
+```javascript
+var func = function(a,b,...rest){
+    console.log(a,b,rest,arguments)
+}
+
+func(1,2,3)
+func(...[1,2,3,4,5])
+```
+
+Подобные возможности в **ES5** реализуются через `arguments` и `apply`
+
+## Литералы объектов
+
+```javascript
+    var name = 'John'
+var age  = Math.round(Math.random()*100)
+var obj = {
+    name, //name: name
+    ["a" + 'ge']: age, //выражение в ключе,
+    greet() {
+        alert(this.name + ', ' + this.age)
+    }
+}
+obj.greet()
+```
+
+## Деструктуризация
+
+**Деструктуризация** позволяет доставать значения полей объектов и массивов по нескольку за одну операцию и избавляет вас от заведения временной переменной для хранения массива или объекта:
+```javascript
+var [a,b,c] = [1,2,3] //создается три переменных из массива
+var {rand1: x, rand2: y, rand3: z} = {rand1: Math.random(), rand2: Math.random(), rand3: Math.random()}
+```
+
+## Восьмеричные и двоичные литералы
+```javascript
+console.log(0b1010)
+console.log(0777)
+console.log(0o555)
+```
+
+## `for .. of`
+
+Работает как `for in` (почти), но перебирает *значения*, а не *ключи*:
+
+```javascript
+for (let word of ['foo','bar']){
+    console.log(word)
+}
+```
+
+## Шаблонизация строк `` `
+
+Символ `` ` (*backtick*, обратная кавычка, находится на `Ё`) позволяет вставить выражение в строку без использования конкатенации:
+
+```javascript
+alert(`Привет, ${prompt('Имя?')}`)
+```
+
+## ES6 ООП.
+
+В синтаксисе **ES6** появились *классы* как их привыкли видеть в других языках:
+
+```javascript
+class Parent {
+    someMethod(){
+        console.log('Parent method')
+    }
+}
+
+class Child extends Parent {
+    someMethod(){
+        console.log('Child method')
+        super.someMethod()
+    }
+}
+
+let child = new Child()
+child.someMethod()
+```