這篇文章主要介紹“JS中Array對象的用法”,在日常操作中,相信很多人在JS中Array對象的用法問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”JS中Array對象的用法”的疑惑有所幫助!接下來,請跟著小編一起來學(xué)習(xí)吧!
專注于為中小企業(yè)提供做網(wǎng)站、成都做網(wǎng)站服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)青白江免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了上1000+企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。
方法從一個(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]
用于確定傳遞的值是否是一個(gè)Array
。
Array.isArray([1, 2, 3]); // true Array.isArray({ foo: 123 }); // false Array.isArray("foobar"); // false Array.isArray(undefined); // false
用于異步監(jiān)視數(shù)組發(fā)生的變化
已被廢棄 語法:Array.observe(arr, callback)
方法創(chuàng)建一個(gè)具有可變數(shù)量參數(shù)的新數(shù)組實(shí)例,而不考慮參數(shù)的數(shù)量或類型。
Array.of(7); // [7] Array.of(1, 2, 3); // [1, 2, 3] Array(7); // [ , , , , , , ] Array(1, 2, 3); // [1, 2, 3] //es5 if (!Array.of) { Array.of = function () { return Array.prototype.slice.call(arguments); }; }
方法用于合并兩個(gè)或多個(gè)數(shù)組。此方法不會(huì)更改現(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"]
方法淺復(fù)制數(shù)組的一部分到同一數(shù)組中的另一個(gè)位置,并返回它,而不修改其大小。
var array1 = [1, 2, 3, 4, 5]; // place at position 0 the element between position 3 and 4 console.log(array1.copyWithin(0, 3, 4)); // expected output: Array [4, 2, 3, 4, 5] // place at position 1 the elements after position 3 console.log(array1.copyWithin(1, 3)); // expected output: Array [4, 4, 5, 4, 5]
方法返回一個(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"]
方法測試數(shù)組的所有元素是否都通過了指定函數(shù)的測試。
var array1 = [1, 30, 39, 29, 10, 13]; console.log(array1.every((x) => x < 40)); //out true
方法用一個(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]
方法創(chuàng)建一個(gè)新數(shù)組,其包含通過所提供函數(shù)實(shí)現(xiàn)的測試的所有元素。
var words = ["spray", "limit", "elite", "exuberant", "destruction", "present"]; const result = words.filter((word) => word.length > 6); console.log(result); // expected output: Array ["exuberant", "destruction", "present"]
方法返回?cái)?shù)組中滿足提供的測試函數(shù)的第一個(gè)元素的值。否則返回undefined
。
var array1 = [5, 12, 8, 130, 44]; var found = array1.find((x) => x > 10); console.log(found); // expected output: 12
方法返回?cái)?shù)組中滿足提供的測試函數(shù)的第一個(gè)元素的索引。否則返回-1
。
var array1 = [5, 12, 8, 130, 44]; var index = array1.findIndex((x) => x > 10); console.log(index); // expected output: 1
方法會(huì)遞歸到指定深度將所有子數(shù)組連接,并返回一個(gè)新數(shù)組。
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] var arr4 = [1, 2, , 4, 5]; arr4.flat(); // [1, 2, 4, 5]
方法首先使用映射函數(shù)映射每個(gè)元素,然后將結(jié)果壓縮成一個(gè)新數(shù)組。它與map
和深度值1
的flat
幾乎相同,但flatMap
通常在合并成一種方法的效率稍微高一些。
var arr1 = [1, 2, 3, 4]; arr1.map((x) => [x * 2]); // [[2], [4], [6], [8]] arr1.flatMap((x) => [x * 2]); // [2, 4, 6, 8] // only one level is flattened arr1.flatMap((x) => [[x * 2]]); // [[2], [4], [6], [8]]
方法對數(shù)組的每個(gè)元素執(zhí)行一次提供的函數(shù)。
var array1 = ["a", "b", "c"]; array1.forEach((value, index, arr) => console.log(value)); // output 'a' // output 'b' // output 'c'
方法用來判斷一個(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
方法返回在數(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
方法將一個(gè)數(shù)組(或一個(gè)類數(shù)組對象)的所有元素連接成一個(gè)字符串并返回這個(gè)字符
var elements = ["Fire", "Wind", "Rain"]; console.log(elements.join()); // expected output: Fire,Wind,Rain console.log(elements.join("")); // expected output: FireWindRain console.log(elements.join("-")); // expected output: Fire-Wind-Rain //數(shù)組[1,2,3,3,4,5]求和 eval([1, 2, 3, 3, 4, 5].join("+")) = 18;
方法返回一個(gè)新的Array
迭代器,它包含數(shù)組中每個(gè)索引的鍵。
var array1 = ["a", "b", "c"]; var iterator = array1.keys(); for (let key of iterator) { console.log(key); // expected output: 0 1 2 }
方法返回指定元素(也即有效的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
方法創(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]
方法從數(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"]
方法將一個(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"]
方法對累加器和數(shù)組中的每個(gè)元素(從左到右)應(yīng)用一個(gè)函數(shù),將其減少為單個(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
方法接受一個(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]
方法將數(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']
方法從數(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
方法返回一個(gè)從開始到結(jié)束(不包括結(jié)束)選擇的數(shù)組的一部分淺拷貝到一個(gè)新數(shù)組對象。且原始數(shù)組不會(huì)被修改。
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"]
方法測試數(shù)組中的某些元素是否通過由提供的函數(shù)實(shí)現(xiàn)的測試。
var 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
方法用原地算法對數(shù)組的元素進(jìn)行排序,并返回?cái)?shù)組。排序不一定是穩(wěn)定的。默認(rèn)排序順序是根據(jù)字符串Unicode
碼點(diǎn)。
var months = ["March", "Jan", "Feb", "Dec"]; months.sort(); console.log(months); // expected output: Array ["Dec", "Feb", "Jan", "March"] var array1 = [1, 30, 4, 21]; array1.sort(); console.log(array1); // expected output: Array [1, 21, 30, 4]
方法通過刪除現(xiàn)有元素和/或添加新元素來更改一個(gè)數(shù)組的內(nèi)容。
var months = ["Jan", "March", "April", "June"]; months.splice(1, 0, "Feb"); // 增 console.log(months); // expected output: Array ['Jan', 'Feb', 'March', 'April', 'June'] months.splice(4, 1, "May"); // 改 console.log(months); // expected output: Array ['Jan', 'Feb', 'March', 'April', 'May'] // 刪 months.splice(4, 1); console.log(months); //output: ["Jan", "Feb", "March", "April"]
返回一個(gè)字符串表示數(shù)組中的元素。數(shù)組中的元素將使用各自的toLocaleString
方法轉(zhuǎn)成字符串,這些字符串將使用一個(gè)特定語言環(huán)境的字符串(例如一個(gè)逗號(hào) ",
")隔開。
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 var prices = ["¥7", 500, 8123, 12]; prices.toLocaleString("ja-JP", { style: "currency", currency: "JPY" }); // "¥7,¥500,¥8,123,¥12"
返回一個(gè)字符串,代表該數(shù)組的源代碼。
該特性是非標(biāo)準(zhǔn)的,請盡量不要在生產(chǎn)環(huán)境中使用它!
var alpha = new Array("a", "b", "c"); alpha.toSource(); //返回["a", "b", "c"]
返回一個(gè)字符串,表示指定的數(shù)組及其元素。
var array1 = [1, 2, "a", "1a"]; console.log(array1.toString()); // expected output: "1,2,a,1a"
方法將一個(gè)或多個(gè)元素添加到數(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]
方法返回一個(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" }
到此,關(guān)于“JS中Array對象的用法”的學(xué)習(xí)就結(jié)束了,希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí),快去試試吧!若想繼續(xù)學(xué)習(xí)更多相關(guān)知識(shí),請繼續(xù)關(guān)注創(chuàng)新互聯(lián)網(wǎng)站,小編會(huì)繼續(xù)努力為大家?guī)砀鄬?shí)用的文章!
網(wǎng)站題目:JS中Array對象的用法
鏈接分享:http://jinyejixie.com/article48/gdjcep.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計(jì)公司、微信公眾號(hào)、網(wǎng)站維護(hù)、軟件開發(fā)、網(wǎng)頁設(shè)計(jì)公司、外貿(mào)網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)