Es新规范-总结(Es5-Es10)

Es新规范之我的es学习笔记

变量:`let`和`var`

1.在循环中使用的变量.
使用 var 时重新声明了循环之外的变量(循环内外的作用域不同,相同变量的值也不同).
使用 let 并没有重新声明循环外的变量 ( 如果在循环中用 let 声明了变量 i，那么只有在循环内，变量 i 才是可见的)

2.在函数内声明变量时，使用 var 和 let 很相似。

3.在 HTML 中，全局作用域是 window 对象。通过 var 关键词定义的全局变量属于 window 对象：可使用 window.carName;通过 let 关键词定义的全局变量不属于 window 对象;

4.允许在程序的任何位置使用 var 重新声明 JavaScript 变量;
在相同的作用域，或在相同的块中，通过 let 重新声明一个 var 变量是不允许的,通过 let 重新声明一个 let 变量是不允许的;

5.通过 var 声明的变量会提升到顶端,可在声明语句之前使用变量;而let不会提升到顶端;

常量 `const`

6.const 变量必须在声明时赋值.const定义了对值的常量引用,而非常量。因此，我们不能更改常量原始值，但我们可以更改常量对象的属性。
1.将一个原始值赋给常量const PI = 3.141592653589793后,就不能改变原始值;
2.常量为对象时,可以更改(数组);

7.通过 const 定义的变量不会被提升到顶端。
当使用常量 const 声明时，使用大写变量，如：CAPITAL_CASING

8.Number.isSafeInteger() 方法
安全整数是可以精确表示为双精度数的整数。安全整数指的是从 -(253 - 1) 到 +(253 - 1) 的所有整数。

函数操作

设置默认参数
延展参数转化
箭头函数

9.设置默认参数: ES6 允许函数参数具有默认值。

function myFunction(x, y = 10) {// y is 10 if not passed or undefinedreturn x + y;
}
myFunction(5); // 将返回 15
myFunction(6,1);// 将返回 7

10.箭头函数（Arrow Function）
.箭头函数注意点：
1）多个参数要用()包起来，函数体有多条语句需要用{}包起来,有返回值时,需要添加return；
2）箭头函数根本没有自己的this，所以内部的this就是外层代码块的this。正是因为它没有this，从而避免了this指向的问题；
3）箭头函数中没有arguments对象。

  // ES5函数
var x = function(x, y) {return x * y;
}// ES6箭头函数
const x = (x, y) => x * y;// ES6 如果函数是单个语句，则只能省略 return 关键字和花括号。因此，保留它们可能是一个好习惯：
const x = (x, y) => {return x ** y;
};

11.将变量声明为一个函数:
将一个变量或常量声明为一个函数,等于声明了一个名为该变量或常量的函数

let getPrice = function() {return 4.55;
};
let getPrice = () => 4.55; // 箭头函数 返回值:4.55;const a = ()=>{console.log('aaa');
};const b = (value='bb')=>{console.log(value);
};a();
b('b11');

12.箭头函数中的|this| 指向 person 对象: this.age++;

ES语法中对象操作

13.简写

function getCar(make, model, value) {return {// 简写变量make,  // 等同于 make: makemodel, // 等同于 model: modelvalue, // 等同于 value: value// 属性可以使用表达式计算值['make' + make]: true,// 忽略 `function` 关键词简写对象函数depreciate() {this.value -= 2500;}};
}

14.模板语法和分隔符 1. ${} 用来渲染一个变量 2.` 作为分隔符

  let user = 'Barret';console.log(`Hi ${user}!`); // Hi Barret!

15.迭代器
for…of 用于遍历一个迭代器，如迭代数组;for…in 用来遍历对象中的属性.

for (let nickname of/in nicknames) {  // of迭代数组,in遍历对象中的属性console.log(nickname);
}

16.ES6 中两种新的数据结构集：Map 和 WeakMap。
Map:一个对象由多个 key-val 对构成，在 Map 中，任何类型都可以作为对象的 key;
WeakMap:key 弱引用,WeakMap 中的东西垃圾回收时不考虑，使用它不用担心内存泄漏问题。另一个需要注意的点是，WeakMap 的所有 key 必须是对象。它只有四个方法 delete(key),has(key),get(key) 和set(key, val).

数组操作

let newArr = Array.from(oldArr); // 浅拷贝
console.log(newArr === oldArr); // falseconsole.log(Array.of(8));  //[8]console.log(Array.of(1, 2, 3));  // [1, 2, 3]console.log(Array(8));  // [ , , , , , , ] 为8个长度的数组console.log(Array(1, 2, 3));  // [1, 2, 3]

17.循环:forEach() 和 map()
循环时,首先做判断,在 object.a 值满足做循环时,再做循环.
在map()里不能做异步的操作.

18.ES6:类中的继承和超集
extends 允许一个子类继承父类，子类的constructor 函数中需要执行 super() 函数,可以在子类方法中调用父类的方法，如super.parentMethodName()。
有几点值得注意的是：
类的声明不会提升（hoisting)，如果你要使用某个 Class，那你必须在使用之前定义它，否则会抛出一个 ReferenceError 的错误
在类中定义函数不需要使用 function 关键词

19.Promises

 ES6 对 Promise 有了原生的支持，一个 Promise 是一个等待被异步执行的对象，当它执行完成后，其状态会变成 resolved 或者 rejected。每一个 Promise 都有一个 .then 方法，这个方法接受两个参数，第一个是处理 resolved 状态的回调，一个是处理 rejected 状态的回调：如果一切都正常，则调用 resolve，否则调用 reject。

  promise.then(Resolved, Rejected); ===> promise.then(Resolved).catch(Rejected);promise.then((val) => console.log("Promise Resolved", val), // 处理 resolved 状态的回调 -> 正常状态(err) => console.log("Promise Rejected", err));  // 处理 rejected 状态的回调 -> 不正常状态

Promise 对象代表一个异步操作，有三种状态：
Pending: 初始状态，不是成功或失败状态。
Resolved(onFulfilled): 意味着操作成功完成。
Rejected: 意味着操作失败。
Promise 对象的状态改变，只有两种可能：从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果。

20.链式操作

  getJSON(url).then(()=>{}).then(()=>{});

上面的代码使用 then 方法，依次指定了两个回调函数。第一个回调函数完成以后，会将返回结果作为参数，传入第二个回调函数。
如果前一个回调函数返回的是Promise对象，这时后一个回调函数就会等待该Promise对象有了运行结果，才会进一步调用。

21.Promise.prototype.catch方法：捕捉错误

getJSON(url).then(()=>{}).catch(()=>{}); //捕捉回调函数中的错误
Promise 对象的错误具有"冒泡"性质，会一直向后传递，直到被捕获为止。也就是说，错误总是会被下一个 catch 语句捕获。
getJSON(url).then(()=>{}).then(()=>{}).catch(()=>{}); // 捕捉2个回调函数中的错误–Promise对象的错误具有"冒泡"性质，会一直向后传递
3.getJSON(url).then(()=>{}).then(()=>{}).catch(()=>{}).finally(()=>{});

22.延展数组 =>合并两个数组为一个新的数组

 let arr1 = [ 'a', 'b', 'c'];let arr2 = [1, 2, 3];let result = [...arr1, ...arr2];   //  [ "a", "b", "c", 1, 2, 3 ]

23.延展对象=> 合并两个对象为一个新的对象

 let smallDog = {name:'小煤球', age: 1};let bigDog = {name: 'Python', age: 2}; // 如果对象中的属性一致, 会被覆盖let dog = {...smallDog, ...bigDog}; // {name: "Python", age: 2}  浅拷贝