JS高级——ES6新属性

let和const：

var let const 的区别：

一， 原始js使用var进行变量的定义

只存在两个作用域：全局作用域 局部作用域

ES6出台：更新定义变量的方式 let const

新增一个作用域：块级作用域 {} 全局作用域 局部作用域

二，利用var 定义变量 存在变量的默认提升功能，let与const不会

三，利用var定义变量可以重复定义，但是let 和const不可以

var index=20
var index=30
console.log(index)  //30
let index=20
let index=30  //报错

四，利用var定义的变量，会自动挂载到window,但是let和const不会

var x=20
console.log(window.x)  //20
let y=30
console.log(window.y)  //undefined

五，let和const 存在暂时性死区问题 使用let或者const定义变量 在声明之前 永远不可用

var a=30
if(true){
    a=40
    console.log(a)
    const a=50   //报错
}

六，let定义变量 const定义常量(定义必赋值)

let x=20
x=40
console.log(x)  //40
const http="http://localhost:8088"
// http=123   //如果二次赋值  结果报错
console.log(http)  

---

箭头函数 function对比问题

function：

                1.function this对象的指向性不明确，随之环境的变化会发生变化

                2.function 定义的函数，具有默认的提升

                3.function 可以作为构造函数，this会根据new 指向空对象

                4.存在arguments集合

//由用户自行输入数字个数，返回求和结果
//function arguments参数集合 实参的结合
function fun2(a,b,c){
    console.log(arguments)//arguments中的内容与形参的个数无关
    let sum=0
    for(var n=0;n<arguments.length;n++){
        sum+=arguments[n]
    }
    return sum
//计算所有实参的和
}
console.log(fun2(1,2,3,4,5,6))

箭头函数：

                1.箭头函数this用于指向生产环境 ，不跟随调用这发生变化

                2.不存在函数的提升功能

                3.无法作为构造函数

                4.不存在arguments,rest参数 代替arguments;

        定义箭头函数：

show()
let show=(a,b,...args)=>{
    console.log(args) //rest参数 只会保存形参之后的实参
}

箭头函数案例：

//箭头函数的简化写法
//1.如果箭头函数内部，只有一个参数，可以省略()
//2.如果箭头函数内部，有且只有一行语句，并且该语句为return语句 ，可以省略return以及花括号
//编写一个箭头函数 输入一个数字，返回其平方
let pow = n=>n*n
console.log(pow(6))

//点击box后，延时3s将其背景色改为蓝色
var box=document.getElementById("box")
box.onclick=function(){
           
    //延时定时器 ，3s后
    setTimeout(()=>{
        console.log(this)   //因为定时器属异步操作   所以this指向window
        this.style.backgroundColor="blue"
    },3000)
}

---

This的指向性问题：

this指向三种  

                1.由new调用，指向构造函数创建出来的对象

                2.在window下调用，window对象

                3.对象中调用或者事件过程中调用， 指向调用的对象