千锋教育JavaScript全套视频教程（10天学会Js，前端javascrip

let

1.块级作用域

    // if( true ){

    //   let b = 10;

    //   console.log( b );----10

    // }

    // console.log( b );---undefined

  

 2. TDZ( 暂时性死区 ) ;

变量必须先声明再使用

3.应用

    // let lis = document.querySelectorAll("ul li");

    // 这种情况是因为使用了var声明变量, 变量只有一个, 在循环结束之后变量值为循环结束之后的值!

    // 循环结束之后的值为4， 所以所有事件触发得到的结果都为4；

    // for(var i = 0 ; i < lis.length ; i ++){

    //   lis[i].onclick = function(){

    //     console.log( i );

    //   }

    // }

    // 我们把var关键字改成let之后;

    // - 因为我们的写法创建了四个函数, 每个函数对应一个dom对象;

    // - let声明变量之后变量是局部的, 每个函数对应一个i变量;

    // 原理:闭包 ;

    // for(let i = 0 ; i < lis.length ; i ++){

    //   lis[i].onclick = function(){

    //     console.log( i );

    //   }

    // }

const

 // const : 常量声明;

    // - 常量声明关键字也会激活两个机制;

    // - 额外的机制 :

    //  1. 常量不能为空;

    //  2. 常量在创建之后不能再赋值了;

    // 注意 : 常量我们通常用全大写字母来进行表述;

    const GENDER = "男";

    // GENDER = "女";

    console.log( GENDER );

解构赋值-数组解构

 // 数组解构

  let[a,b]=[10,20]

  console.log(a,b);

 //应用: 换位

  [a,b]=[b,a]

  console.log(a,b);

 // 剩余运算

  let arr=[1,2,3,4,5,6,7,8,9,10]

  let[start,...other]=arr

  console.log(start,other);//1 (9) [2, 3, 4, 5, 6, 7, 8, 9, 10]

  // 应用:伪数组变为真

  var lis=document.querySelectorAll("li")

  lis=[...lis]

  console.log(lis);

解构赋值-对象赋值

  let obj = { a: 10, b: 20 }

  // / 取出对象之中某个key对应的value数据 , 并声明一个变量和key同名;

  let { a, b } = obj

  console.log(a, b);

  // 应用:

  let { random } = Math;

  console.log(random, random());

  document.onclick = function (e) {

    e = e || event;

    let { clientX, clientY } = e;

    console.log(clientX, clientY);

  }

  // let { 对象之中的key名 : 新名称 } = 对象

  let {random:r,PI:p}=Math;

  console.log(r(),p)

    let obj2 = { top : 888 }

    let { top : _top } = obj2;

    console.log( _top );

展开运算

 //...在等号左边叫剩余运算,在等号右边叫展开运算