ES6随笔

------------恢复内容开始------------

1、var 和 let 声明变量有什么区别:

  1)作用于不同:let 是在代码块内有效,var 是在全局范围内有效

  2)var具有变量声明提升,let没有变量声明提升

  3)var 可以在同一作用域重复声明变量,let不可以

  4)let 声明的变量具有暂时性死区,var没有 (ES6 明确规定,代码块内如果存在 let 或者 const,代码块会对这些命令声明的变量从块的开始就形成一个封闭作用域。代码块内,在声明变量 PI 之前使用它会报错。)

2、let 和 const

  1)let 声明变量

  2)const 声明常量,声明的时候需要赋值,否则会报错! 声明赋值后不可以再修改

  3)目前const 修饰的数组或者对象,他们内部的元素是可以被修改的

eg:  const names=['zhangsan','wangwu','ermazi']
   names[0] = ['lisi']
   console.log(names[0]) ->lisi

3、解构赋值

   let obj = {p: ['hello', {y: 'world'}] };
  let         {p: [x, { y }] } = obj;
  // x = 'hello' // y = 'world'

  let obj = {p: ['hello', {y: 'world'}] };
  let         {p: [x, { }] } = obj; 
  // x = 'hello'
  //es6内部使用严格相等运算符(===),判断一个位置是否有值,所以,只有当一个数组成员严格等于undefined,默认值才会生效
  let [x = 1] = [undefined]   //console.log(x) ->1
  let [x = 1] = [null]  //console.log(null)
  // 函数形参解构赋值最终形式
  function({name, age=10, address, sex='男'} = {}){  // 这里需要等于一个默认的空对象{}

  }

4、对象属性名表达式

let obj = {}   // obj={A:[], B:[], ...Z:[]}

for(let i=0;i<26;i++){

  // 65的ascii是A,每加1就是一直到Z

  let char = String.fromCharCode(65+i)  // 将十进制ASCII码转换成对应的字符

  obj[char] = []   // 对象属性名表达式

}

5、函数rest参数

es5的接受实参的方式和es6不一样 

es5:  function(){ console.log( arguments )}

es6:function(...args){ console.log( args)}  //rest运算符的表现形式为...  ,剩余参数运算符只能出现在形参列表的最后面

6、语句标签 : https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/label

 var i, j;

    loop1:
    for (i = 0; i < 3; i++) {      //The first for statement is labeled "loop1"
       loop2:
       for (j = 0; j < 3; j++) {   //The second for statement is labeled "loop2"
          if (i === 1 && j === 1) {
             continue loop1;
          }
          console.log('i = ' + i + ', j = ' + j);
       }
    }

// Output is:
//   "i = 0, j = 0"
//   "i = 0, j = 1"
//   "i = 0, j = 2"
//   "i = 1, j = 0"
//   "i = 2, j = 0"
//   "i = 2, j = 1"
//   "i = 2, j = 2"
// Notice how it skips both "i = 1, j = 1" and "i = 1, j = 2"

7、箭头函数

  当箭头函数函数体有多行语句,用 {} 包裹起来,表示代码块,当只有一行语句,并且需要返回结果时,可以省略 {} , 结果会自动返回。

  当箭头函数要返回对象的时候,为了区分于代码块,要用 () 将对象包裹起来

  注意点:没有 this、super、arguments 和 new.target 绑定。

  箭头函数体中的 this 对象,是定义函数时的对象,而不是使用函数时的对象。!!!!!!!!

var f = (a,b) => a+b;
f(6,2);  //8
// 当箭头函数函数体有多行语句,用 {} 包裹起来,表示代码块,当只有一行语句,并且需要返回结果时,可以省略 {} , 结果会自动返回。
var f = (a,b) => {
 let result = a+b;
 return result;
}
f(6,2);  // 8
// 当箭头函数要返回对象的时候,为了区分于代码块,要用 () 将对象包裹起来
// 报错
var f = (id,name) => {id: id, name: name};
f(6,2);  // SyntaxError: Unexpected token :
 
// 不报错
var f = (id,name) => ({id: id, name: name});
f(6,2);  // {id: 6, name: 2}

// 箭头函数里面没有 this 对象,
// 此时的 this 是外层的 this 对象,即 Window 
// 箭头函数体中的 this 对象,是定义函数时的对象,而不是使用函数时的对象。
function fn(){
  setTimeout(()=>{
    // 定义时,this 绑定的是 fn 中的 this 对象
    console.log(this.a);
  },0)
}
var a = 20;
// fn 的 this 对象为 {a: 19}
fn.call({a: 18});  // 18

8、Set、Map

1)Set 和 数组比较相似,有如下方法:

  size, add, delete, has, clear, forEach

  let aSet = new Set()

// 数组去重
var mySet = new Set([1, 2, 3, 4, 4]);
[...mySet]; // [1, 2, 3, 4]

// 并集
var a = new Set([1, 2, 3]); 
var b = new Set([4, 3, 2]);
var union = new Set([...a, ...b]); // {1, 2, 3, 4} // 交集 var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var intersect = new Set([...a].filter(x => b.has(x))); // {2, 3} // 差集 var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var difference = new Set([...a].filter(x => !b.has(x))); // {1}

2)Map

var myMap = new Map();

方法:set,get,has,delete,clear,forEach





------------恢复内容结束------------

原文地址:https://www.cnblogs.com/zhengyulu/p/14504574.html