ES6解构赋值/箭头函数及var let const区别

var let const区别:

1.是否存在变量提升?
var声明的变量存在变量提升(将变量提升到当前作用域的顶部)。即变量可以在声明之前调用,值为undefined。

let和const不存在变量提升。即它们所声明的变量一定要在声明后使用,否则报ReferenceError错。
2.是否存在暂时性死区?
let和const存在暂时性死区。即只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。
在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。
总之,暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。
3.是否允许重复声明变量?
var允许重复声明变量。
let和const在同一作用域不允许重复声明变量。
4.是否存在块级作用域?
var不存在块级作用域。
let和const存在块级作用域。
什么是块级作用域:
ES5中作用域有:全局作用域、函数作用域。没有块作用域的概念。因此也有一系列的问题。
5. 是否能修改声明的变量?
var预解析,变量提升(作用域块),无暂时性死区,可重复声明变量,
let不存在变量提升
var和let可以。
const声明一个只读的常量。一旦声明,常量的值就不能改变。const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

for in 和for of的区别:

for in取key,for of 取value

①从遍历数组角度来说,for···in遍历出来的是key(即下标)for···of遍历出来的是value(即数组的值);

var arr = [99,88,66,77];
for(let i in arr){
    console.log(i);   //0,1,2,3
}
for(let i of arr){
    consoel.log(i);   //99,88,66,77
}
1
2
3
4
5
6
7
②从遍历字符串的角度来说,同数组一样。
③从遍历对象的角度来说,for···in会遍历出来的为对象的key,但for···of会直接报错。

var obj = {name:"Bob",age:25};
for(var i in obj){
	console.log(i)  // name age
}
for(var i of obj){
	console.log(i)   //报错
}

1
2
3
4
5
6
7
8
④如果要使用for…of遍历普通对象,需要配合Object.keys()一起使用。

var person={
    name:'coco',
    age:22,
    locate:{
        country:'China',
        city:'beijing',
    }
}
for(var key of Object.keys(person)){
    //使用Object.keys()方法获取对象key的数组
    console.log(key+": "+person[key]);//name: coco,age: 22,locate: [object Object]
}

es6是解构赋值:

解构赋值是一种JavaScript表达式,通过解构赋斜体样式值,可以将属性/值从对象/数组中取出,赋值废其他变量

//数组结构
var a, b, rest;
[a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20

//对象解构
({ a, b } = { a: 10, b: 20 });
console.log(a); // 10
console.log(b); // 20

// ...rest 解构数组
[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest); // [30, 40, 50]

// ...rest 解构对象(最新)
({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40});
console.log(a); // 10
console.log(b); // 20
console.log(rest); // {c: 30, d: 40}

//解析一个从函数返回
function f() {
  return [1, 2];
}

var a, b; 
[a, b] = f(); 
console.log(a); // 1
console.log(b); // 2

箭头函数与普通函数的区别

箭头函数通过 call() 或 apply() 方法调用一个函数时,只传入了一个参数,对 this 并没有影响

let obj = {
		a:10,
		b:function(n){
			let f = (n) => n + this.a;
			return f(n)
		},
		c:function(n){
			let f = (n) => n + this.a;
			let m = {
				a:20,
			};
			return f.call(m,n)
		}
	};
	console.log(obj.b(10)) //20
	console.log(obj.c(10)) //20
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值