既然选择了远方,便只顾风雨兼程!
关于es6我也只是跟开始接触,说的不好请大家多多关照,希望能对学习前端的朋友一点帮助。
Babel转码器:
Babel是一个广泛使用的ES6转码器,可以将ES6代码转为ES5代码,从而在现有环境执行。这意味着,你可以用ES6的方式编写程序,又不用担心现有环境是否支持。
Babel下载地址
声明变量let与const:
因为var命令会发生“变量提升”现象,即变量可以在声明之前使用,值是undefined。这种逻辑多多少少有点奇怪,为了纠正这种现象,let改变了语法行为,变量在声明之前使用就会报错。
// var 的情况
console.log(a); //输出undefined
var a=2;
// let 的情况
console.log(a); //自己报错
let a=2;
这表明let声明的变量只他所在的代码块内有效。
let命令非常适合计数器。
let 不会再预解析的时候不会提升
let不允许在声明之前赋值,否则报错,这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。
let不允许重复声明
// 报错
function func() {
let a = 10;
var a = 1;
}
// 报错
function func() {
let a = 10;
let a = 1;
}
let只会在离他最近的作用域有效不会泄露为全局变量。
ES6 允许块级作用域的任意嵌套。
const 命令
const声明一个只读的常量。一旦声明,常量的值就不能改变。
const arr = 3;
arr = 2 //报错
const一旦声明变量,就必须立即初始化,不能留到以后赋值。
const arr; //报错
const的作用域与let命令相同:
只在声明所在的块级作用域内有效。
预解析不会提升变量
不允许重复声明
ES6声明变量的方法
var和function;
let和const;
import命令和class命令。
var a=1;
let b=1;
function fun(){};
import any from "./a.js"
//class 就好比构造函数
class Pad{
fun(){
console.log(123)
}
}
var ad=new Pad();
ad.fun()
变量的解构赋值
变量的结构赋值
//ES5变量赋值
var a = 1;
var b = 2;
//ES6 变量赋值
let [a, b] = [1, 2];
ES6可以从数组中提取值,按照对应位置,对变量赋值。可以从数组中提取值,按照对应位置,对变量赋值。
如果解构不成功,变量的值就等于undefined。
null 和 undefined 不能解构赋值
let [foo, [[bar], baz]] = [1, [[2], 3]];
foo // 1
bar // 2
baz // 3
let [ , , third] = ["foo", "bar", "baz"];
third // "baz"
let [x, , y] = [1, 2, 3];
x // 1
y // 3
let [head, ...tail] = [1, 2, 3, 4];
head // 1
tail // [2, 3, 4]
let [x, y, ...z] = ['a'];
x // "a"
y // undefined
z // []
对象的结构赋值
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
let { bar, foo } = { foo: "aaa", bar: "bbb" };
foo // "aaa"
bar // "bbb"
let { baz } = { foo: "aaa", bar: "bbb" };
baz // undefined
对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。
let { foo: baz } = { foo: "aaa", bar: "bbb" };
baz // "aaa"
foo // 报错 foo is not defined
Interator是遍历器点这里查看详情
用途
交换变量的值
let x = 1;
let y = 2;
[x, y] = [y, x];
四种数据集合
JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Map和Set。这样就有了四种数据集合。
字符串的扩展
》
》
》
》
》
》
》
》
》
待更新
Set
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
//直接赋值
const set = new Set([1, 2, 3, 4, 4]);
//不会出现重复的值
const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));
for (let i of s) {
console.log(i);
}
// 2 3 5 4
Map
待更新
网友评论