JavaScript數(shù)組有哪些方法甜刻?

1. Array.from() 方法從一個(gè)類似數(shù)組或可迭代對象中創(chuàng)建一個(gè)新的呻袭,淺拷貝的數(shù)組實(shí)例。

console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"]

console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]

let s = new Set(['foo', window]); 
Array.from(s); 
// ["foo", window]

function f() {
  return Array.from(arguments);
}
f(1, 2, 3);
// [1, 2, 3]

function combine(){ 
    let arr = [].concat.apply([], arguments);  //沒有去重復(fù)的新數(shù)組 
    return Array.from(new Set(arr));
} 
var m = [1, 2, 2], n = [2,3,3]; 
console.log(combine(m,n));                     // [1, 2, 3]

2.Array.isArray() 用于確定傳遞的值是否是一個(gè)Array泄朴。

Array.isArray([1, 2, 3]);  
// true
Array.isArray({foo: 123}); 
// false
Array.isArray("foobar");   
// false
Array.isArray(undefined);  
// false

3.Array.of() 方法創(chuàng)建一個(gè)具有可變數(shù)量參數(shù)的新數(shù)組實(shí)例重抖,而不考慮參數(shù)的數(shù)量或類型。

Array.of() 和 Array 構(gòu)造函數(shù)之間的區(qū)別在于處理整數(shù)參數(shù):Array.of(7) 創(chuàng)建一個(gè)具有單個(gè)元素 7 的數(shù)組祖灰,而 Array(7) 創(chuàng)建一個(gè)長度為7的空數(shù)組(注意:這是指一個(gè)有7個(gè)空位(empty)的數(shù)組,而不是由7個(gè)undefined組成的數(shù)組)畔规。

Array.of(7);       // [7] 
Array.of(1, 2, 3); // [1, 2, 3]
Array(7);          // [ , , , , , , ]
Array(1, 2, 3);    // [1, 2, 3]

4. concat() 方法用于合并兩個(gè)或多個(gè)數(shù)組局扶。此方法不會更改現(xiàn)有數(shù)組,而是返回一個(gè)新數(shù)組。

var array1 = ['a', 'b', 'c'];
var array2 = ['d', 'e', 'f'];
console.log(array1.concat(array2));
// expected output: Array ["a", "b", "c", "d", "e", "f"]

5.copyWithin() 方法淺復(fù)制數(shù)組的一部分到同一數(shù)組中的另一個(gè)位置三妈,并返回它畜埋,不會改變原數(shù)組的長度。

var array1 = ['a', 'b', 'c', 'd', 'e'];
// copy to index 0 the element at index 3

console.log(array1.copyWithin(0, 3, 4));
// expected output: Array ["d", "b", "c", "d", "e"]

// copy to index 1 all elements from index 3 to the end
console.log(array1.copyWithin(1, 3));
// expected output: Array ["d", "d", "e", "d", "e"]

6.entries() 方法返回一個(gè)新的Array Iterator對象畴蒲,該對象包含數(shù)組中每個(gè)索引的鍵/值對悠鞍。

var array1 = ['a', 'b', 'c'];

var iterator1 = array1.entries();

console.log(iterator1.next().value);
// expected output: Array [0, "a"]

console.log(iterator1.next().value);
// expected output: Array [1, "b"]

7.every() 方法測試一個(gè)數(shù)組內(nèi)的所有元素是否都能通過某個(gè)指定函數(shù)的測試。它返回一個(gè)布爾值模燥。

function isBelowThreshold(currentValue) {
  return currentValue < 40;
}

var array1 = [1, 30, 39, 29, 10, 13];

console.log(array1.every(isBelowThreshold));
// expected output: true

8. fill() 方法用一個(gè)固定值填充一個(gè)數(shù)組中從起始索引到終止索引內(nèi)的全部元素咖祭。不包括終止索引。

var array1 = [1, 2, 3, 4];

// fill with 0 from position 2 until position 4
console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

// fill with 5 from position 1
console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]

9. filter() 方法創(chuàng)建一個(gè)新數(shù)組, 其包含通過所提供函數(shù)實(shí)現(xiàn)的測試的所有元素蔫骂。

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44] 

10. find() 方法返回?cái)?shù)組中滿足提供的測試函數(shù)的第一個(gè)元素的值么翰。否則返回 undefined。

var array1 = [5, 12, 8, 130, 44];

var found = array1.find(function(element) {
  return element > 10;
});

console.log(found);
// expected output: 12

11.findIndex()方法返回?cái)?shù)組中滿足提供的測試函數(shù)的第一個(gè)元素的索引辽旋。否則返回-1浩嫌。

var array1 = [5, 12, 8, 130, 44];

function isLargeNumber(element) {
  return element > 13;
}

console.log(array1.findIndex(isLargeNumber));
// expected output: 3

12. flat() 方法會按照一個(gè)可指定的深度遞歸遍歷數(shù)組,并將所有元素與遍歷到的子數(shù)組中的元素合并為一個(gè)新數(shù)組返回 ,flat() 方法會移除數(shù)組中的空項(xiàng)补胚。

var arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

//使用 Infinity 作為深度码耐,展開任意深度的嵌套數(shù)組
arr3.flat(Infinity); 
// [1, 2, 3, 4, 5, 6]

13. flatMap()方法首先使用映射函數(shù)映射每個(gè)元素,然后將結(jié)果壓縮成一個(gè)新數(shù)組溶其。它與 map和 深度值1的 flat幾乎相同骚腥,但 flatMap 通常在合并成一種方法的效率稍微高一些。

let arr = ["今天天氣不錯(cuò)", "", "早上好"]

arr.map(s => s.split(""))
// [["今", "天", "天", "氣", "不", "錯(cuò)"],[],["早", "上", "好"]]

arr.flatMap(s => s.split(''));
// ["今", "天", "天", "氣", "不", "錯(cuò)", "早", "上", "好"]

14.forEach() 方法對數(shù)組的每個(gè)元素執(zhí)行一次提供的函數(shù)握联。

const items = ['item1', 'item2', 'item3'];
const copy = [];

// before
for (let i=0; i<items.length; i++) {
  copy.push(items[i]);
}

// after
items.forEach(function(item){
  copy.push(item);
});

15. includes() 方法用來判斷一個(gè)數(shù)組是否包含一個(gè)指定的值桦沉,根據(jù)情況,如果包含則返回 true金闽,否則返回false纯露。

var array1 = [1, 2, 3];

console.log(array1.includes(2));
// expected output: true

var pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// expected output: true

console.log(pets.includes('at'));
// expected output: false

16. indexOf()方法返回在數(shù)組中可以找到一個(gè)給定元素的第一個(gè)索引,如果不存在代芜,則返回-1埠褪。

var beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];

console.log(beasts.indexOf('bison'));
// expected output: 1

// start from index 2
console.log(beasts.indexOf('bison', 2));
// expected output: 4

console.log(beasts.indexOf('giraffe'));
// expected output: -1

17. join()方法將一個(gè)數(shù)組(或一個(gè)類數(shù)組對象)的所有元素連接成一個(gè)字符串并返回這個(gè)字符串。如果數(shù)組只有一個(gè)項(xiàng)目挤庇,那么將返回該項(xiàng)目而不使用分隔符钞速。

var elements = ['Fire', 'Air', 'Water'];

console.log(elements.join());
// expected output: "Fire,Air,Water"

console.log(elements.join(''));
// expected output: "FireAirWater"

console.log(elements.join('-'));
// expected output: "Fire-Air-Water"

18. keys() 方法返回一個(gè)包含數(shù)組中每個(gè)索引鍵的Array Iterator對象。

var array1 = ['a', 'b', 'c'];
var iterator = array1.keys(); 
  
for (let key of iterator) {
  console.log(key); // expected output: 0 1 2
}

19. lastIndexOf() 方法返回指定元素(也即有效的 JavaScript 值或變量)在數(shù)組中的最后一個(gè)的索引嫡秕,如果不存在則返回 -1渴语。從數(shù)組的后面向前查找,從 fromIndex 處開始昆咽。

var animals = ['Dodo', 'Tiger', 'Penguin', 'Dodo'];

console.log(animals.lastIndexOf('Dodo'));
// expected output: 3

console.log(animals.lastIndexOf('Tiger'));
// expected output: 1

20.map() 方法創(chuàng)建一個(gè)新數(shù)組驾凶,其結(jié)果是該數(shù)組中的每個(gè)元素都調(diào)用一個(gè)提供的函數(shù)后返回的結(jié)果牙甫。

var array1 = [1, 4, 9, 16];

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

21. pop()方法從數(shù)組中刪除最后一個(gè)元素,并返回該元素的值调违。此方法更改數(shù)組的長度窟哺。

var plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop());
// expected output: "tomato"

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"]

plants.pop();

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage"]

22. push() 方法將一個(gè)或多個(gè)元素添加到數(shù)組的末尾,并返回該數(shù)組的新長度技肩。

var animals = ['pigs', 'goats', 'sheep'];

console.log(animals.push('cows'));
// expected output: 4

console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows"]

animals.push('chickens');

console.log(animals);
// expected output: Array ["pigs", "goats", "sheep", "cows", "chickens"]

23. reduce() 方法對數(shù)組中的每個(gè)元素執(zhí)行一個(gè)由您提供的reducer函數(shù)(升序執(zhí)行)且轨,將其結(jié)果匯總為單個(gè)返回值。

const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;

// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10

// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, 5));
// expected output: 15

24. reduceRight() 方法接受一個(gè)函數(shù)作為累加器(accumulator)和數(shù)組的每個(gè)值(從右到左)將其減少為單個(gè)值虚婿。

const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight(
  (accumulator, currentValue) => accumulator.concat(currentValue)
);

console.log(array1);
// expected output: Array [4, 5, 2, 3, 0, 1]

25. reverse() 方法將數(shù)組中元素的位置顛倒旋奢,并返回該數(shù)組。該方法會改變原數(shù)組雳锋。

var array1 = ['one', 'two', 'three'];
console.log('array1: ', array1);
// expected output: Array ['one', 'two', 'three']

var reversed = array1.reverse(); 
console.log('reversed: ', reversed);
// expected output: Array ['three', 'two', 'one']

/* Careful: reverse is destructive. It also changes
the original array */ 
console.log('array1: ', array1);
// expected output: Array ['three', 'two', 'one']

26. shift() 方法從數(shù)組中刪除第一個(gè)元素黄绩,并返回該元素的值。此方法更改數(shù)組的長度玷过。

var array1 = [1, 2, 3];

var firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

27.slice() 方法返回一個(gè)新的數(shù)組對象爽丹,這一對象是一個(gè)由 begin 和 end 決定的原數(shù)組的淺拷貝(包括 begin,不包括end)辛蚊。原始數(shù)組不會被改變粤蝎。

var animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

28. some() 方法測試是否至少有一個(gè)元素可以通過被提供的函數(shù)方法。該方法返回一個(gè)Boolean類型的值袋马。

ar array = [1, 2, 3, 4, 5];

var even = function(element) {
  // checks whether an element is even
  return element % 2 === 0;
};

console.log(array.some(even));
// expected output: true

29.sort()方法用原地算法對數(shù)組的元素進(jìn)行排序初澎,并返回?cái)?shù)組。默認(rèn)排序順序是在將元素轉(zhuǎn)換為字符串虑凛,然后比較它們的UTF-16代碼單元值序列時(shí)構(gòu)建的

由于它取決于具體實(shí)現(xiàn)碑宴,因此無法保證排序的時(shí)間和空間復(fù)雜性

var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return a - b;
});
console.log(numbers);

也可以寫成:
var numbers = [4, 2, 5, 1, 3]; 
numbers.sort((a, b) => a - b); 
console.log(numbers);

// [1, 2, 3, 4, 5]

30. splice() 方法通過刪除或替換現(xiàn)有元素或者原地添加新的元素來修改數(shù)組,并以數(shù)組形式返回被修改的內(nèi)容。此方法會改變原數(shù)組桑谍。

var months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'June']

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ['Jan', 'Feb', 'March', 'April', 'May']

31. toLocaleString() 返回一個(gè)字符串表示數(shù)組中的元素延柠。數(shù)組中的元素將使用各自的 toLocaleString 方法轉(zhuǎn)成字符串,這些字符串將使用一個(gè)特定語言環(huán)境的字符串(例如一個(gè)逗號 ",")隔開锣披。

var array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')];
var localeString = array1.toLocaleString('en', {timeZone: "UTC"});

console.log(localeString);
// expected output: "1,a,12/21/1997, 2:12:00 PM",
// This assumes "en" locale and UTC timezone - your results may vary

32. toString() 返回一個(gè)字符串贞间,表示指定的數(shù)組及其元素。

var array1 = [1, 2, 'a', '1a'];

console.log(array1.toString());
// expected output: "1,2,a,1a"

33.unshift() 方法將一個(gè)或多個(gè)元素添加到數(shù)組的開頭雹仿,并返回該數(shù)組的新長度(該方法修改原有數(shù)組)增热。

var array1 = [1, 2, 3];

console.log(array1.unshift(4, 5));
// expected output: 5

console.log(array1);
// expected output: Array [4, 5, 1, 2, 3]

33. values() 方法返回一個(gè)新的 Array Iterator 對象,該對象包含數(shù)組每個(gè)索引的值.

const array1 = ['a', 'b', 'c'];
const iterator = array1.values();

for (const value of iterator) {
  console.log(value); // expected output: "a" "b" "c"
}

本文參考資料:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/@@iterator

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末胧辽,一起剝皮案震驚了整個(gè)濱河市峻仇,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌邑商,老刑警劉巖础浮,帶你破解...
    沈念sama閱讀 206,482評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件帆调,死亡現(xiàn)場離奇詭異奠骄,居然都是意外死亡豆同,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,377評論 2 382
  • 文/潘曉璐 我一進(jìn)店門含鳞,熙熙樓的掌柜王于貴愁眉苦臉地迎上來影锈,“玉大人,你說我怎么就攤上這事蝉绷⊙纪ⅲ” “怎么了?”我有些...
    開封第一講書人閱讀 152,762評論 0 342
  • 文/不壞的土叔 我叫張陵熔吗,是天一觀的道長辆床。 經(jīng)常有香客問我,道長桅狠,這世上最難降的妖魔是什么讼载? 我笑而不...
    開封第一講書人閱讀 55,273評論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮中跌,結(jié)果婚禮上咨堤,老公的妹妹穿的比我還像新娘。我一直安慰自己漩符,他們只是感情好一喘,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,289評論 5 373
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著嗜暴,像睡著了一般凸克。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上闷沥,一...
    開封第一講書人閱讀 49,046評論 1 285
  • 那天萎战,我揣著相機(jī)與錄音,去河邊找鬼狐赡。 笑死撞鹉,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的颖侄。 我是一名探鬼主播鸟雏,決...
    沈念sama閱讀 38,351評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼览祖!你這毒婦竟也來了孝鹊?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,988評論 0 259
  • 序言:老撾萬榮一對情侶失蹤展蒂,失蹤者是張志新(化名)和其女友劉穎又活,沒想到半個(gè)月后苔咪,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,476評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡柳骄,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,948評論 2 324
  • 正文 我和宋清朗相戀三年团赏,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片耐薯。...
    茶點(diǎn)故事閱讀 38,064評論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡舔清,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出曲初,到底是詐尸還是另有隱情体谒,我是刑警寧澤,帶...
    沈念sama閱讀 33,712評論 4 323
  • 正文 年R本政府宣布臼婆,位于F島的核電站抒痒,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏颁褂。R本人自食惡果不足惜故响,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,261評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望痢虹。 院中可真熱鬧被去,春花似錦、人聲如沸奖唯。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,264評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽丰捷。三九已至坯墨,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間病往,已是汗流浹背捣染。 一陣腳步聲響...
    開封第一講書人閱讀 31,486評論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留停巷,地道東北人耍攘。 一個(gè)月前我還...
    沈念sama閱讀 45,511評論 2 354
  • 正文 我出身青樓,卻偏偏與公主長得像畔勤,于是被迫代替她去往敵國和親蕾各。 傳聞我的和親對象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,802評論 2 345

推薦閱讀更多精彩內(nèi)容