本文列舉一些我們開(kāi)發(fā)常用的ES6新特性昨忆, 如下:
image
1.塊級(jí)作用域變量let,const
- let, const不會(huì)出現(xiàn)變量提升
- let 和 const 不允許重復(fù)聲明(會(huì)拋出錯(cuò)誤)
- let 和 const 定義的變量在定義語(yǔ)句之前,如果使用會(huì)拋出錯(cuò)誤(形成了暫時(shí)性死區(qū))
- let 聲明變量夷家, const聲明常量
2.新增基本數(shù)據(jù)類型Symbol
ES6 引入了一種新的原始數(shù)據(jù)類型Symbol脖隶,表示獨(dú)一無(wú)二的值
保證每個(gè)屬性的名字都是獨(dú)一無(wú)二的就好了嗅定,這樣就從根本上防止屬性名的沖突
3.結(jié)構(gòu)賦值
var [a,b,c]=[11,22,33]
console.log(a,b,c)//11 22 33
var {name,age}={name:"張三",age:"20"}
console.log(name,age)//張三 20
4.給形參設(shè)置默認(rèn)值&箭頭函數(shù)
給形參設(shè)置默認(rèn)值
function defaultValue (a=10, b=20) {
console.log(a, b) // 10,20
}
defaultValue(100, 200) // 100, 200
defaultValue(11) // 11, 20
箭頭函數(shù)
//普通函數(shù)
var fun1 = function(a){
console.log(a);
}
//箭頭函數(shù)
var fun1 = (a)=>{console.log(a);}
fun1(3);
5.對(duì)象或者數(shù)組的展開(kāi)符 ...
var arr = [1,2,3];
console.log(...arr)// 1 2 3
6.String的include方法
includes("元素"); 用于判斷字符串中是否包含某個(gè)字符
存在返回true 不存在返回false
7.Array新增API:isArray/from/of 和新增方法:entries()/kes()/values()等
- isArray判斷是否是數(shù)組
- Array.from() 方法從一個(gè)類似數(shù)組或可迭代對(duì)象中創(chuàng)建一個(gè)新的數(shù)組實(shí)例顾患。
var a = {
0:'0',
1:'1',
2:'2',
length:3
}
a = Array.from(a)
console.log(a) // ["000", "111", "222"]
- Array.of() 方法創(chuàng)建一個(gè)具有可變數(shù)量參數(shù)的新數(shù)組實(shí)例番捂,而不考慮參數(shù)的數(shù)量或類型。
console.log(Array.of(1,2,3,{}, true)) //[1,2,3,{},true]
- Array.prototype.entries
entries()返回一個(gè)新的Array Iterator對(duì)象江解,該對(duì)象包含數(shù)組中每個(gè)索引的鍵/值對(duì)设预。 - Array.prototype.keys
keys() 方法返回一個(gè)包含數(shù)組中每個(gè)索引鍵的Array Iterator對(duì)象。 - Array.prototype.values
values() 方法返回一個(gè)新的 Array Iterator 對(duì)象犁河,該對(duì)象包含數(shù)組每個(gè)索引的值
8.增加class語(yǔ)法糖
class 類名{
constructor(){} // 構(gòu)造函數(shù)
run(){}// 函數(shù)屬性
dark(){}// 函數(shù)屬性
}
9.新增模塊化(import/export)
export導(dǎo)出變量鳖枕,模塊,函數(shù)等
export function sum(num1,num2){
return num1+num2;
}
等價(jià)于
function sun (num1,num2){
return num1+num2;
}
export sum;
import導(dǎo)入寫(xiě)法
import {identifer1,indentifer2} from "./example.js" // import {標(biāo)識(shí)符1桨螺,標(biāo)識(shí)符2} from "本地模塊路徑"
10.新增Map宾符,Set數(shù)據(jù)結(jié)構(gòu)
set()沒(méi)有重復(fù)的有序列表集合
- set包含的方法
add()、has()灭翔、delete()魏烫、clear()等
Map() 用來(lái)存放鍵值對(duì)的集合 key/value
- get(key)根據(jù)key值取得value
var map = new Map();
map.set("name","張三");
map.set("age",20);
console.log(map)//Map {"name" => "張三", "age" => 20}
- has() 判斷是否存在某個(gè)鍵值對(duì)
- clear() 清空集合
11.模板字符串
語(yǔ)法:
tag `string text ${expression} string text`
12.for...of 和 for...in
for...of 具有 iterator 接口,就可以用for...of循環(huán)遍歷屬性值肝箱,可終止
使用的范圍包括數(shù)組哄褒、Set 和 Map 結(jié)構(gòu)、某些類似數(shù)組的對(duì)象狭园、Generator 對(duì)象读处,以及字符串
for...in 遍歷對(duì)象自身的和繼承的可枚舉的屬性, 不能直接獲取屬性值〕可以中斷循環(huán)