let const 聲明變量
1. let變量聲明
? let的特點是不會變量提升漫试,
2. const 變量聲明
const雖然是常量肃拜,不允許修改默認賦值团甲,但如果定義的是對象Object挎春,數(shù)組旗唁,那么可以修改對象內(nèi)部的屬性值仑嗅。
3.const和let的異同點
**相同點:** const和let都是在當前塊內(nèi)有效宴倍,執(zhí)行到塊外會被銷毀,也不存在變量提升(TDZ)仓技,不能重復聲明鸵贬。
**不同點:** ?const不能再賦值,let聲明的變量可以重復賦值脖捻。
變量的解構(gòu)賦值
ES6 允許按照一定模式阔逼,從數(shù)組和對象中提取值,對變量進行賦值地沮,這被稱為解構(gòu)(Destructuring)嗜浮。
ES6 允許寫成下面這樣。
1. 數(shù)組的解構(gòu)
let[a,b,c]=[1,2,3];
let[x,,y]=[1,2,3]
;x// 1
y// 3
2. 對象的解構(gòu)?
let{bar,foo}={foo:"aaa",bar:"bbb"};
foo// "aaa"
bar// "bbb"
3. 字符串 函數(shù)參數(shù)也可以解構(gòu) 詳見ES6語法
字符串的擴展
1. includes(), startsWith(), endsWith()
includes():返回布爾值摩疑,表示是否找到了參數(shù)字符串危融。
startsWith():返回布爾值,表示參數(shù)字符串是否在源字符串的頭部雷袋。
endsWith():返回布爾值专挪,表示參數(shù)字符串是否在源字符串的尾部。
var s='Hello world!';
s.startsWith('Hello')// trues.
endsWith('!')// trues.
includes('o')// true
2. repeat()
repeat方法返回一個新字符串,表示將原字符串重復n次寨腔。
'x'.repeat(3)// "xxx"
'hello'.repeat(2)// "hellohello"
'na'.repeat(0)// ""
參數(shù)如果是小數(shù)速侈,會被取整。
3. padStart()迫卢,padEnd()
padStart()用于頭部補全倚搬,padEnd()用于尾部補全。
'x'.padStart(5,'ab')// 'ababx'
'x'.padStart(4,'ab')// 'abax'
padStart的常見用途是為數(shù)值補全指定位數(shù)乾蛤。下面代碼生成10位的數(shù)值字符串每界。
'1'.padStart(10,'0')// "0000000001"
另一個用途是提示字符串格式。
'12'.padStart(10,'YYYY-MM-DD')// "YYYY-MM-12"
'09-12'.padStart(10,'YYYY-MM-DD')// "YYYY-09-12"
4. 模板字符串
如果使用模板字符串表示多行字符串家卖,所有的空格和縮進都會被保留在輸出之中眨层。
模板字符串中嵌入變量,需要將變量名寫在${}之中上荡。
ES6對象新增方法
1趴樱、Object.assign()
實現(xiàn)了拷貝一個對象給另外一個對象,返回一個新的對象酪捡。
console.log(Object.assign(a, b))
// 將對象b拷貝給對象a,并且返回以一個新對象 a可以繼承b的所以屬性叁征,而且是深拷貝,如果對象出現(xiàn)重復逛薇,不會報錯捺疼,后面的會覆蓋前面的
函數(shù)的擴展
1. ES6 允許為函數(shù)的參數(shù)設(shè)置默認值,即直接寫在參數(shù)定義的后面永罚。
functionlog(x,y='World')
? ? ?{console.log(x,y);}
log('Hello')// Hello World
2.箭頭函數(shù)中的this指向
長期以來啤呼,JavaScript語言的this對象一直是一個令人頭痛的問題,在對象方法中使用this呢袱,必須非常小心媳友。例如:
運行上面的代碼會報錯,這是因為setTimeout中的this指向的是全局對象产捞。所以為了讓它能夠正確的運行醇锚,傳統(tǒng)的解決方法有兩種:
classAnimal {
?constructor(){this.type ='animal'}?
? ? says(say){? ? ? ?
? ? ? setTimeout(function(){
? ? ? ? ? ?console.log(this.type +' says '+ say)? ? ? ?
? ? },1000)? ? }}
var animal =new Animal()
animal.says('hi') //undefined says hi
第一種是將this傳給self,再用self來指代this
says(say){
? ?var self = this;? ? ?
? ? ?setTimeout( ?function(){
? ? ? ? console.log(self.type +' says '+ say)? ? ??
?},1000)
2.第二種方法是用bind(this),即
says(say){? ? ?
? ? ?setTimeout(function(){
? ? ? ? ?console.log(this.type +' says '+ say)? ?
? ? ? }.bind(this),1000)
當我們使用箭頭函數(shù)時,函數(shù)體內(nèi)的this對象坯临,就是定義時所在的對象焊唬,而不是使用時所在的對象。
并不是因為箭頭函數(shù)內(nèi)部有綁定this的機制看靠,實際原因是箭頭函數(shù)根本沒有自己的this赶促,它的this是繼承外面的,因此內(nèi)部的this就是外層代碼塊的this挟炬。
數(shù)組的擴展
1. 擴展運算符
擴展運算符(spread)是三個點(...)鸥滨。它好比 rest 參數(shù)的逆運算嗦哆,將一個數(shù)組轉(zhuǎn)為用逗號分隔的參數(shù)序列。
console.log(...[1,2,3]) // 1 2 3
應用Math.max方法婿滓,簡化求出一個數(shù)組最大元素的寫法老速。
Math.max(...[14,3,77])
合并數(shù)組
[...arr1,...arr2,...arr3] ?// [ 'a', 'b', 'c', 'd', 'e' ]
2. Array.from()
Array.from可以將偽數(shù)組轉(zhuǎn)為真正的數(shù)組。
3. Array.of()
Array.of(3,11,8)// [3,11,8]
4. 數(shù)組實例的 find() 和 findIndex()
find():傳入一個回調(diào)函數(shù)凸主,找到數(shù)組中符合當前搜索規(guī)則的第一個元素橘券,返回它,并且終止搜索卿吐。
findIndex():傳入一個回調(diào)函數(shù)旁舰,找到數(shù)組中符合當前搜索規(guī)則的第一個元素,返回它的下標嗡官,終止搜索箭窜。
[1,5,10,15].find(function(value,index,arr){
returnvalue>9;})// 10
5. 數(shù)組實例的fill()
fill方法用于空數(shù)組的初始化非常方便。數(shù)組中已有的元素衍腥,會被全部抹去磺樱。
fill方法還可以接受第二個和第三個參數(shù),用于指定填充的起始位置和結(jié)束位置紧阔。
['a','b','c'].fill(7) // [7, 7, 7]
['a','b','c'].fill(7,1,2) // ['a', 7, 'c']
7. 強大的for-of循環(huán)
for (var value of myArray ){?
console.log(value);}
or-of循環(huán)不僅支持數(shù)組坊罢,還支持大多數(shù)類數(shù)組對象
module
export 命令
1. 寫法1 等于于 寫法2
寫法1
export var firstName = 'Michael';
export var lastName = 'Jackson';
export var year = 1958;
寫法2?
var firstName = 'Michael';
var lastName = 'Jackson';
var year = 1958;
export { firstName, lastName, year};
2. 通常情況下续担,export輸出的變量就是本來的名字擅耽,但是可以使用as關(guān)鍵字重命名。
functionv1(){...}
functionv2(){...}
export{
v1 as streamV1,
v2 as streamV2
,v2 as streamLatestVersion
};
3. 使用export default命令物遇,為模塊指定默認輸出乖仇。其他模塊加載該模塊時,import命令可以為該匿名函數(shù)指定任意名字询兴。
set 函數(shù)
const s = new Set(arr)
Set 函數(shù)可以接受一個數(shù)組(或者具有 iterable 接口的其他數(shù)據(jù)結(jié)構(gòu))作為參數(shù)乃沙,用來初始化。
Array.from 可以講 Set 轉(zhuǎn)換為數(shù)組
數(shù)組的map和filter方法也可以用于 Set 诗舰。 // 我表示懷疑這個說法
1. Set 的幾個比較重要的方法
? add(value):添加某個值警儒,返回Set結(jié)構(gòu)本身。
? delete(value):刪除某個值眶根,返回一個布爾值蜀铲,表示刪除是否成功。
? has(value):返回一個布爾值属百,表示該值是否為Set的成員记劝。
? clear():清除所有成員,沒有返回值
2. Set 的一個布爾運算
let a = new Set([1, 2, 3]);
let b = new Set([4, 3, 2]);
// 并集
let union = new Set([...a, ...b]);
// Set {1, 2, 3, 4}
// 交集
let intersect = new Set([...a].filter(x => b.has(x)));
// set {2, 3}
// 差集
let difference = new Set([...a].filter(x => !b.has(x)));