js數(shù)組的操作方法


檢測(cè)數(shù)組方法

isArray()判斷是否是數(shù)組

var a = [1,2,3,4,5];
Array.isArray(a);
//true

轉(zhuǎn)換方法

toString()數(shù)組轉(zhuǎn)換字符串方法
數(shù)組的 valueOf 會(huì)默認(rèn)調(diào)用 toString 方法昂拂,所以他們的返回值一樣,都是逗號(hào)分隔每一項(xiàng)組成的字符串

var months = ['Jan', 'Feb', 'Mar', 'Apr'];
months.toString(); // "Jan,Feb,Mar,Apr"

toLocaleString()數(shù)組轉(zhuǎn)換字符串方法
調(diào)用數(shù)組每一項(xiàng)的 toLocaleString 方法椿每,有時(shí)和 toString 方法的結(jié)果是一樣的七芭。有時(shí)也不同秦踪,比如 Date 對(duì)象元素組成的數(shù)組里懂鸵,返回的結(jié)果會(huì)不同。

棧方法

push()pop()方法允許將數(shù)組當(dāng)做棧來(lái)使用
push()方法在數(shù)組的尾部添加一個(gè)或多個(gè)元素痪宰,并返回?cái)?shù)組新的長(zhǎng)度叼架。
pop()方法則相反:它刪除數(shù)組的最后一個(gè)元素,減小數(shù)組長(zhǎng)度并返回它刪除的值

var arr=[]; //arr:[]
arr.push(1,2); //arr:[1,2]
arr.pop(); //arr:[1]
arr.push(3) //arr:[1,3]

隊(duì)列方法

unshift()shift()方法將數(shù)組當(dāng)做隊(duì)列來(lái)使用
unshift()數(shù)組前面添加新元素衣撬,操作原數(shù)組乖订,返回新數(shù)組
shift()刪除數(shù)組第一項(xiàng),操作原數(shù)組具练,返回刪除項(xiàng)

var a = [1, 2, 3];
var b = a.shift();

console.log(a); // [2, 3]
console.log(b); // 1

var c = [1, 2, 3];
var d = c.unshift(4, 5);

console.log(c); // [4, 5, 1, 2, 3]
console.log(d); // 5

重排序方法

reverse() 將數(shù)組反序

var a = [5,1,3,2,4];
var b = a.reverse(); //a:[4,2,3,1,5] b:[4,2,3,1,5]

sort() 按指定的參數(shù)對(duì)數(shù)組進(jìn)行排序,從小到大排序.

var a = [5,1,3,2,4];
var b = a.sort(); //a:[1,2,3,4,5] b:[1,2,3,4,5]

操作方法

concat()合并數(shù)組返回新數(shù)組

var arr1 = ['a', 'b', 'c'];
var arr2 = ['d', 'e', 'f'];

var arr3 = arr1.concat(arr2);

console.log(arr3); //["a", "b", "c", "d", "e", "f"]

slice()基于當(dāng)前數(shù)組創(chuàng)建新數(shù)組乍构,返回新數(shù)組
傳入兩個(gè)參數(shù) 起始位置(包含) 結(jié)束位置(不包含),虎頭蛇尾扛点,有始無(wú)終哥遮。
傳遞的參數(shù)中有一個(gè)負(fù)數(shù),則用數(shù)組長(zhǎng)度加上該數(shù)來(lái)確定位置陵究。長(zhǎng)度為 5 的數(shù)組 slice(-2眠饮,-1) 與 slice(3, 4) 結(jié)果相同。
結(jié)束位置小于起始位置铜邮,則返回空數(shù)組

var a = ['1', '2', '3', '4'];
var sliced = a.slice(1, 3);

console.log(a); // ['1', '2', '3', '4']
console.log(sliced); // ['2', '3']

splice()實(shí)現(xiàn)數(shù)組刪除仪召、插入、替換牲距。返回被刪除元素組成的數(shù)組
可以實(shí)現(xiàn) 刪除返咱、插入(元素個(gè)數(shù)大于要?jiǎng)h除的元素個(gè)數(shù))、替換(刪除一個(gè)牍鞠,再添加一個(gè))
返回被刪除元素組成的數(shù)組,如果沒(méi)有被刪除元素评姨,返回空數(shù)組
參數(shù): 起始位置(包含)难述、要?jiǎng)h除的元素個(gè)數(shù)、元素

var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

myFish.splice(2, 0, 'drum');
// ["angel", "clown", "drum", "mandarin", "sturgeon"]

myFish.splice(2, 1);
// ["angel", "clown", "mandarin", "sturgeon"]

myFish.splice(-1, 0, 'drum');
//["angel", "clown", "mandarin", "drum", "sturgeon"]

位置方法

indexOf()從前往后查找
接受兩個(gè)參數(shù):查找的值吐句、查找起始位置,不存在胁后,返回 -1 ;存在嗦枢,返回位置攀芯。

var a = [2, 9, 9];
a.indexOf(2); // 0
a.indexOf(7); // -1

if (a.indexOf(7) === -1) {
// element doesn't exist in array
}

lastIndexOf()從后往前查找
接受兩個(gè)參數(shù):查找的值、查找起始位置,不存在文虏,返回 -1 侣诺;存在殖演,返回位置。

var numbers = [2, 5, 9, 2];
numbers.lastIndexOf(2); // 3
numbers.lastIndexOf(7); // -1
numbers.lastIndexOf(2, 3); // 3
numbers.lastIndexOf(2, 2); // 0
numbers.lastIndexOf(2, -2); // 0
numbers.lastIndexOf(2, -1); // 3

迭代方法

ECMAScript 5 提供了5個(gè)迭代方法年鸳,他們的參數(shù)都是給定的函數(shù)(當(dāng)前元素趴久、位置(索引)、數(shù)組本身) 可選的搔确,執(zhí)行回調(diào)是的 this 值
every()對(duì)數(shù)組的每一項(xiàng)都運(yùn)行給定的函數(shù)彼棍,每一項(xiàng)都返回 ture,則返回 true

function isBigEnough(element, index, array) {
    return element < 10;
}

[2, 5, 8, 3, 4].every(isBigEnough); // true

some() 對(duì)數(shù)組的每一項(xiàng)都運(yùn)行給定的函數(shù),任意一項(xiàng)返回 ture,則返回 true

function isBiggerThan10(element, index, array) {
    return element > 10;
}

[2, 5, 8, 1, 4].some(isBiggerThan10); // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true

fifter() 對(duì)數(shù)組的每一項(xiàng)都運(yùn)行給定的函數(shù)膳算,返回 結(jié)果為 ture 的項(xiàng)組成的數(shù)組

var words = ["spray", "limit", "elite", "exuberant", "destruction", "present", "happy"];

var longWords = words.filter(function(word){
    return word.length > 6;
});
//["exuberant", "destruction", "present"]

map() 對(duì)數(shù)組的每一項(xiàng)都運(yùn)行給定的函數(shù)座硕,返回每次函數(shù)調(diào)用的結(jié)果組成一個(gè)新數(shù)組

var numbers = [1, 5, 10, 15];
var doubles = numbers.map(function(x) {
    return x * 2;
});
// doubles is now [2, 10, 20, 30]
// numbers is still [1, 5, 10, 15]

forEach()方法從頭到位遍歷數(shù)組, 為每個(gè)元素調(diào)用指定的函數(shù)

var arr =[1,2,3,4,5];
//創(chuàng)建個(gè)帶有元素的數(shù)組
arr.forEach(function(element){
    console.log(element);//輸出arr的1,2,3,4,5;
});

歸并方法

ECMAScript 5 新增了兩個(gè)歸并數(shù)組的方法:reduce()和reduceRight()涕蜂。這兩個(gè)方法都會(huì)迭代數(shù)組的所有項(xiàng)华匾,然后構(gòu)建一個(gè)最終的返回值。
這兩個(gè)方法比上面的五個(gè)迭代方法回調(diào)函數(shù)多了一個(gè)參數(shù):上一項(xiàng)的值
回調(diào)函數(shù)參數(shù):上一項(xiàng)宇葱、當(dāng)前元素瘦真、位置、數(shù)組
reduce()從前往后遍歷

var numbers = [0, 1, 2, 3];
var result = numbers.reduce(function(accumulator, currentValue) {
    return accumulator + currentValue;
});
console.log(result);// expected output: 6

reduceRight()從后往前遍歷

var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
    return a.concat(b);
}, []);
// flattened is [4, 5, 2, 3, 0, 1]

其他

join()將數(shù)組的元素組起一個(gè)字符串黍瞧,數(shù)組分隔的逗號(hào)用參數(shù)代替

var a = [1,2,3,4,5];
var b = a.join(',');//a:[1,2,3,4,5] b:"1,2,3,4,5"

valueOf()返回?cái)?shù)組對(duì)象的原始值

var colors=["red","blue","green"];
alert(colors.valueOf());  //red,blue,green

小總結(jié)

  • 隊(duì)列方法和棧方法操作的都是原數(shù)組诸尽,增加數(shù)組元素的時(shí)候,返回值是數(shù)組長(zhǎng)度印颤;刪除數(shù)組元素的時(shí)候您机,返回值是被刪除的元素。
  • 那些方法改變了原數(shù)組年局?
  1. 棧方法:push际看、pop
  2. 隊(duì)列方法:shift、unshift
  3. 重排序方法:reverse矢否、sort
  • 那些方法返回的是新數(shù)組仲闽?
  1. 重排序方法:reverse、sort
  2. 操作方法:splice僵朗、slice赖欣、concat
  3. 迭代方法中:filter、map

ECMAScript6.0新增的方法

from()將類似數(shù)組的對(duì)象(array-like object)和可遍歷(iterable)的對(duì)象轉(zhuǎn)為真正的數(shù)組

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]

Array.from('foo');
// ["f", "o", "o"]

of() 用于將一組值验庙,轉(zhuǎn)換為數(shù)組顶吮。這個(gè)方法的主要目的,是彌補(bǔ)數(shù)組構(gòu)造函數(shù) Array() 的不足粪薛。因?yàn)閰?shù)個(gè)數(shù)的不同悴了,會(huì)導(dǎo)致 Array() 的行為有差異。

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

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

copyWithin() 將指定位置的元素復(fù)制到其他位置(會(huì)覆蓋原有元素),返回當(dāng)前數(shù)組湃交。該方法會(huì)修改當(dāng)前數(shù)組熟空。
它接受三個(gè)參數(shù)。

  1. target(必需):從該位置開(kāi)始替換數(shù)據(jù)巡揍。
  2. start(可選):從該位置開(kāi)始讀取數(shù)據(jù)痛阻,默認(rèn)為0。如果為負(fù)值腮敌,表示倒數(shù)阱当。
  3. end(可選):到該位置前停止讀取數(shù)據(jù),默認(rèn)等于數(shù)組長(zhǎng)度糜工。如果為負(fù)值弊添,表示倒數(shù)。
[1, 2, 3, 4, 5].copyWithin(-2);
// [1, 2, 3, 1, 2]


[1, 2, 3, 4, 5].copyWithin(0, 3);
// [4, 5, 3, 4, 5]


[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
// [4, 2, 3, 4, 5]


[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);
// [1, 2, 3, 3, 4]

fill() 使用給定值捌木,填充一個(gè)數(shù)組油坝。
會(huì)抹除數(shù)組原有的元素
還可以接受第二個(gè)和第三個(gè)參數(shù),用于指定填充的起始位置和結(jié)束位置刨裆。

var numbers = [1, 2, 3]
numbers.fill(1);
// results in [1, 1, 1]

['a', 'b', 'c'].fill(7, 1, 2)
// ['a', 7, 'c']
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末澈圈,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子帆啃,更是在濱河造成了極大的恐慌瞬女,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,914評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件努潘,死亡現(xiàn)場(chǎng)離奇詭異诽偷,居然都是意外死亡,警方通過(guò)查閱死者的電腦和手機(jī)疯坤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評(píng)論 2 383
  • 文/潘曉璐 我一進(jìn)店門(mén)报慕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái),“玉大人压怠,你說(shuō)我怎么就攤上這事眠冈。” “怎么了菌瘫?”我有些...
    開(kāi)封第一講書(shū)人閱讀 156,531評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵洋闽,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我突梦,道長(zhǎng),這世上最難降的妖魔是什么羽利? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,309評(píng)論 1 282
  • 正文 為了忘掉前任宫患,我火速辦了婚禮,結(jié)果婚禮上这弧,老公的妹妹穿的比我還像新娘娃闲。我一直安慰自己虚汛,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,381評(píng)論 5 384
  • 文/花漫 我一把揭開(kāi)白布皇帮。 她就那樣靜靜地躺著卷哩,像睡著了一般。 火紅的嫁衣襯著肌膚如雪属拾。 梳的紋絲不亂的頭發(fā)上将谊,一...
    開(kāi)封第一講書(shū)人閱讀 49,730評(píng)論 1 289
  • 那天,我揣著相機(jī)與錄音渐白,去河邊找鬼尊浓。 笑死,一個(gè)胖子當(dāng)著我的面吹牛纯衍,可吹牛的內(nèi)容都是我干的栋齿。 我是一名探鬼主播,決...
    沈念sama閱讀 38,882評(píng)論 3 404
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼襟诸,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼瓦堵!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起歌亲,我...
    開(kāi)封第一講書(shū)人閱讀 37,643評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤菇用,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后应结,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體刨疼,經(jīng)...
    沈念sama閱讀 44,095評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,448評(píng)論 2 325
  • 正文 我和宋清朗相戀三年鹅龄,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了揩慕。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,566評(píng)論 1 339
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡扮休,死狀恐怖迎卤,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情玷坠,我是刑警寧澤蜗搔,帶...
    沈念sama閱讀 34,253評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站八堡,受9級(jí)特大地震影響樟凄,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜兄渺,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,829評(píng)論 3 312
  • 文/蒙蒙 一缝龄、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦叔壤、人聲如沸瞎饲。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,715評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)嗅战。三九已至,卻和暖如春俺亮,著一層夾襖步出監(jiān)牢的瞬間驮捍,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,945評(píng)論 1 264
  • 我被黑心中介騙來(lái)泰國(guó)打工铅辞, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留厌漂,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,248評(píng)論 2 360
  • 正文 我出身青樓斟珊,卻偏偏與公主長(zhǎng)得像苇倡,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子囤踩,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,440評(píng)論 2 348