擴(kuò)展運(yùn)算符（spread）是三個點(diǎn)（...）
{
let arr=[1,2,3];
console.log(...arr);//1 2 3
//如果拓展運(yùn)算符后面是一個空數(shù)組犬钢，那么就什么也不執(zhí)行
let a=[];
console.log([...[],1]);//[1]
}
它好比 rest 參數(shù)的逆運(yùn)算移盆，將一個數(shù)組轉(zhuǎn)為用逗號分隔的參數(shù)序列惰拱。
拓展運(yùn)算符有些情況下也可以將字符串和偽數(shù)組轉(zhuǎn)化為真正的數(shù)組,不過外面還得包一層中括號
{
console.log([...'string']);// ["s", "t", "r", "i", "n", "g"]
function show(){
console.log([...arguments]);//[1, 2, 3, 4, 5]
}
show(1,2,3,4,5);
}
用途
- 1合并數(shù)組
{
let arr1=[1,3];
let arr2=[4,3];
let arr=[];
console.log(arr.concat(arr1,arr2));//[1,3,4,3]
//拓展運(yùn)算符
console.log([...arr,...arr1,...arr2]);//[1, 3, 4, 3]
}
- 2結(jié)構(gòu)賦值
{
const [a,...arr]=[1,2,3,45,5];
console.log(a);//1
console.log(arr);//[2, 3, 45, 5]
//只能放在參數(shù)的最后一位判没，否則會報錯胧辽。
const [a,...arr1]=[1,23];
console.log(arr1);//報錯
}
- 3擴(kuò)展運(yùn)算符還可以將字符串轉(zhuǎn)為真正的數(shù)組
{
console.log([...'hello']);//["h", "e", "l", "l", "o"]
console.log(...'hello');//h e l l o
let str=...'hello';//報錯
}
at()方法 數(shù)組或者字符串可以逆序索引元素
const arr = ['a',1,'vc',8,'dsgf']
const str = 'string'
console.log(arr.at(-1)) //dsgf
console.log(str.at(-2)) //n
Array.from()
{
const json={
0:'name',
1:'age',
length:2
};
console.log(Array.from(json));//["name", "age"]
function show(){
console.log(arguments);//[1, 2, 3, 4, callee: function, Symbol(Symbol.iterator): function]
console.log(Array.from(arguments));//[1, 2, 3, 4]
}
show(1,2,3,4);
console.log(Array.from('hello'));//["h", "e", "l", "l", "o"]
}
可以將偽數(shù)組和可遍歷的的對象轉(zhuǎn)化為真正的數(shù)組峻仇，也可以將字符串轉(zhuǎn)化為數(shù)組
Array.of()的操作，將完美一下new Array的方法
{
console.log(Array.of(1,2,3));//[1,2,3]
console.log(Array.of());//[]
console.log(new Array(3));//[undefined × 3]
console.log(Array.of(3));//[3]
}
copyWithin(target,start,end)自己玩自己的方法并且會改變自己邑商，跟splice不同摄咆，splice可以添加數(shù)組以外的元素
{
let arr=[1,2,3,4,5,6];
console.log(arr.copyWithin(1,3,5));//[1,4,5,4,5,6];
console.log(arr.copyWithin(1,3));//[1,4,5,6,5,6]
console.log(arr.copyWithin(0,-2,-1));//[5,2,3,4,5,6];
}
第二個console是在注釋第一個console的情況下打印出來的，對應(yīng)的第三個console是在注釋第一個和第二個console情況下打印出來的人断，如果不注釋不是這種情況吭从，因為copyWidth()會改變原來的數(shù)組
target（必需）：從該位置開始替換數(shù)據(jù)。
start（可選）：從該位置開始讀取數(shù)據(jù)恶迈，默認(rèn)為0涩金。如果為負(fù)值，表示倒
數(shù)暇仲。
end（可選）：到該位置前停止讀取數(shù)據(jù)步做，默認(rèn)等于數(shù)組長度。如果為負(fù)值奈附，表示倒數(shù)全度。
數(shù)組的find()和findIndex()
{
let arr=[1,2,3,4];
arr.find((num)=>{
if (num>2){
console.log(num);// 3 4
}
});
//find方法的回調(diào)函數(shù)可以接受三個參數(shù)，依次為當(dāng)前的值斥滤、當(dāng)前的位置和原數(shù)組将鸵。
arr.find((value,index,obj)=>{
if (value>2){
console.log(value+':'+index+':'+obj);//3:2:1,2,3,4 4:3:1,2,3,4
}
});
//找出數(shù)組中第一個大于2的成員。如果沒有符合條件的成員佑颇，則返回undefined顶掉。
console.log(arr.find((value,index,obj)=>{
return value>2;
}));//3
//返回第一個符合條件的數(shù)組成員的位置，如果所有成員都不符合條件挑胸，則返回-1痒筒。
console.log(arr.findIndex((value,index,obj)=>{
return value>2;
}));//2
}
findLast和findLastIndex方法 數(shù)組或者字符串可以逆序查找元素和index下標(biāo)
findLast 返回找到的元素，找不到返回undefined
findLastIndex 返回找到的index下標(biāo)茬贵，找不到返回-1
const arr = ['a',1,'vc',8,{name:'張三'},'dsgf']
console.log(arr.findLast(item => item.name === '張三')) // {name: '張三'}
console.log(arr.findLastIndex(item => item === 'dsgf')) // 5
數(shù)組的fill()方法
{
//fill方法使用給定值簿透，填充一個數(shù)組。
let arr=[1,2,3];
arr.fill(9);
console.log(arr);//[9,9,9]
console.log(new Array(3).fill(2));//[2,2,2]
//fill方法還可以接受第二個和第三個參數(shù)闷沥，用于指定填充的起始位置和結(jié)束位置萎战。
console.log(arr.fill(7,1,2));//[1,7,3]
}
數(shù)組實例的 entries()，keys() 和 values()
{
const arr=[1,2,3,4,5];
for (let index of arr.keys()){
console.log(index);//0 1 2 3 4
}
console.log(Object.keys(arr));// ["0", "1", "2", "3", "4"]
for (let [index,val] of arr.entries()){
console.log(index+':'+val);//0:1 1:2 2:3 3:4 4:5
}
console.log(Object.values(arr));//[1, 2, 3, 4, 5]
// for (let val of arr.values()){
// console.log(val);//報錯 chrome 和 Firefox 不知道為什么
// }
}
Object.fromEntries 自身可枚舉屬性的鍵值對數(shù)組轉(zhuǎn)化為對象
let arr=[
["name","李四"],
["age",18]
]
console.log(Object.fromEntries(arr));//{"name": "李四","age": 18}
fromEntries和entries是相反的舆逃，可以相互轉(zhuǎn)化的
let json={"name": "李四","age": 18};
console.log(Object.entries(json));//arr=[["name","李四"],["age",18]];
也可以轉(zhuǎn)化map結(jié)構(gòu)的鍵值對數(shù)組
let map=new Map([["name","張三"],["age",15]])
console.log(Object.fromEntries(map));//{"name": "張三","age": 15}
數(shù)組實例的 includes()
{
let arr=[1,2,3,4,5,NaN];
console.log(arr.includes(4));//true
console.log(arr.includes(10))//false
//該方法的第二個參數(shù)表示搜索的起始位置蚂维，默認(rèn)為0戳粒。如果第二個參數(shù)為負(fù)數(shù)，則表示倒數(shù)的位置
console.log(arr.includes(5,-4));//true
}
數(shù)組的空位
{
//由于空位的處理規(guī)則非常不統(tǒng)一虫啥，所以建議避免出現(xiàn)空位蔚约。
console.log(Array.from([,,,]));//[undefined, undefined, undefined]
console.log(...[1,,2]);//1 undefined 2
console.log([,'a','b',,].copyWithin(2,0)); // [,"a",,"a"]
// entries()
console.log([...[,'a'].entries()]); // [[0,undefined], [1,"a"]]
// keys()
console.log([...[,'a'].keys()]); // [0,1]
// values()
//console.log([...[,'a'].values()]); // [undefined,"a"]
// find()
console.log([,'a'].find(x => true)); // undefined
// findIndex()
console.log([,'a'].findIndex(x => true)); // 0
}
ES5 對空位的處理，已經(jīng)很不一致了涂籽，大多數(shù)情況下會忽略空位,ES6 則是明確將空位轉(zhuǎn)為undefined
