大家好,我是IT修真院成都分院第8期的学员,一枚正直纯洁善良的WEB前端程序员。今天给大家分享一下ES6新特性。
1.变量声明const和let
我们都是知道在ES6以前,var关键字声明变量。无论声明在何处,都会被视为声明在函数的最顶部(不在函数内即在全局作用域的最顶部)。这就是函数变量提升例如:
function aa() {
if(bool) {
var test = 'hello man'
} else {
console.log(test)
}
}
以上的代码实际上是:
function aa() {
var test // 变量提升
if(bool) {
test = 'hello man'
} else {
//此处访问test 值为undefined
console.log(test)
}
//此处访问test 值为undefined
}
接下来ES6主角登场:我们通常用let和const来声明,let表示变量、const表示常量。let和const都是块级作用域。怎么理解这个块级作用域?
在一个函数内部在一个代码块内部
说白了 {}大括号内的代码块即为let 和 const的作用域。
function aa() {
if(bool) {
let test = 'hello man'
} else {
//test 在此处访问不到
console.log(test)
}
}
let的作用域是在它所在当前代码块,但不会被提升到当前函数的最顶部。
再来说说const
const name = 'lux' name = 'joe' //再次赋值此时会报错
来对比一下let和var
经典的面试题:输出1~10
var funcs = []
for (var i = 0; i < 10; i++) {
funcs.push(function() { console.log(i) })
}
funcs.forEach(function(func) {
func()
})
解构赋值的用途
交换变量的值
let x = 1;
let y = 2;
[x, y] = [y, x];
从函数返回多个值
// 返回一个数组
function example() {
return [1, 2, 3];
}
let [a, b, c] = example();
// 返回一个对象
function example() {
return {
foo: 1,
bar: 2
};
}
let { foo, bar } = example();
问题
从长远来看,Es6和ts该如何取舍?
答:个人建议:没有什么取舍,先学ES6,再学typescript,如果要用angular2的话。
说一下指针函数吧。
答:箭头函数最直观的三个特点。 不需要function关键字来创建函数 省略return关键字 继承当前上下文的 this 关键字。
注意的点:
函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误。
不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。
不可以使用yield命令,因此箭头函数不能用作 Generator 函数。