每天一篇javascript學(xué)習(xí)小結(jié)（Array數(shù)組）
更新時(shí)間：2015年11月11日 11:57:47 投稿：lijiao
這篇文章主要介紹了javascript中的Array數(shù)組知識(shí)點(diǎn)，對(duì)數(shù)組的基本使用方法，以及各種方法進(jìn)行整理，感興趣的小伙伴們可以參考一下
1、數(shù)組常用方法
var colors = ["red", "blue", "green"]; //creates an array with three strings
alert(colors.toString()); //red,blue,green
alert(colors.valueOf()); //red,blue,green
alert(colors); //red,blue,green
2、數(shù)組map()方法
var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
//item 數(shù)組元素 index元素對(duì)應(yīng)索引 array原數(shù)組
console.log(array === numbers);//true
return item * 2;
});
console.log(mapResult); //[2,4,6,8,10,8,6,4,2]
3、數(shù)組reduce()方法
var values = [1,2,3,4,5];
//接收一個(gè)函數(shù)，然后從左到右遍歷item，直到reduce到一個(gè)值。
var sum = values.reduce(function(prev, cur, index, array){
console.log(array === values);
console.log(index);//1,2,3,4 數(shù)組的索引從1開(kāi)始
return prev + cur;//前后兩個(gè)值相加
});
alert(sum);//15
4、數(shù)組concat()方法
//concat() 方法用于連接兩個(gè)或多個(gè)數(shù)組。
//該方法不會(huì)改變現(xiàn)有的數(shù)組，而僅僅會(huì)返回被連接數(shù)組的一個(gè)副本。
//語(yǔ)法
//arrayObject.concat(arrayX,arrayX,......,arrayX)
var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
alert(colors); //red,green,blue
alert(colors2); //red,green,blue,yellow,black,brown
5、數(shù)組長(zhǎng)度length
var colors = new Array(3); //create an array with three items
var names = new Array("Greg"); //create an array with one item, the string "Greg"
alert(colors.length);//3
alert(names.length);//1
var colors = ["red", "blue", "green"]; //creates an array with three strings
var names = []; //creates an empty array
var values = [1,2,]; //AVOID! Creates an array with 2 or 3 items
var options = [,,,,,]; //AVOID! creates an array with 5 or 6 items
alert(colors.length); //3
alert(names.length); //0
alert(values.length); //2 (FF, Safari, Opera) or 3 (IE)
alert(options.length); //5 (FF, Safari, Opera) or 6 (IE)
var colors = ["red", "blue", "green"]; //creates an array with three strings
colors.length = 2;
alert(colors[2]); //undefined
var colors = ["red", "blue", "green"]; //creates an array with three strings
colors.length = 4;
alert(colors[3]); //undefined
var colors = ["red", "blue", "green"]; //creates an array with three strings
colors[colors.length] = "black"; //add a color
colors[colors.length] = "brown"; //add another color
alert(colors.length); //5
alert(colors[3]); //black
alert(colors[4]); //brown
var colors = ["red", "blue", "green"]; //creates an array with three strings
colors[99] = "black"; //add a color (position 99)
alert(colors.length); //100
6、數(shù)組方法every和some
//every()與some()方法都是JS中數(shù)組的迭代方法。
//every()是對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，如果該函數(shù)對(duì)每一項(xiàng)返回true,則返回true。
//some()是對(duì)數(shù)組中每一項(xiàng)運(yùn)行指定函數(shù)，如果該函數(shù)對(duì)任一項(xiàng)返回true，則返回true。
var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item, index, array){
return (item > 2);
});
alert(everyResult); //false
var someResult = numbers.some(function(item, index, array){
return (item > 2);
});
alert(someResult); //true
7、數(shù)組filter()方法
//從數(shù)組中找到適合條件的元素（比如說(shuō)大于某一個(gè)元素的值）
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]
8、數(shù)組indexOf和lastIndexOf
//indexOf() 方法可返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置。
//語(yǔ)法
//stringObject.indexOf(searchvalue,fromindex)
//searchvalue 必需。規(guī)定需檢索的字符串值。
//fromindex 可選的整數(shù)參數(shù)。規(guī)定在字符串中開(kāi)始檢索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略該參數(shù)，則將從字符串的首字符開(kāi)始檢索。
/*
lastIndexOf() 方法可返回一個(gè)指定的字符串值最后出現(xiàn)的位置，在一個(gè)字符串中的指定位置從后向前搜索。
語(yǔ)法
stringObject.lastIndexOf(searchvalue,fromindex)
searchvalue 必需。規(guī)定需檢索的字符串值。
fromindex 可選的整數(shù)參數(shù)。規(guī)定在字符串中開(kāi)始檢索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略該參數(shù)，則將從字符串的最后一個(gè)字符處開(kāi)始檢索。
*/
var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3
alert(numbers.lastIndexOf(4)); //5
alert(numbers.indexOf(4, 4)); //5
alert(numbers.lastIndexOf(4, 4)); //3
var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];
var morePeople = [person];
alert(people.indexOf(person)); //-1
alert(morePeople.indexOf(person)); //0
9、數(shù)組toLocaleString和toString
var person1 = {
toLocaleString : function () {
return "Nikolaos";
},
toString : function() {
return "Nicholas";
}
};
var person2 = {
toLocaleString : function () {
return "Grigorios";
},
toString : function() {
return "Greg";
}
};
var people = [person1, person2];
alert(people); //Nicholas,Greg
alert(people.toString()); //Nicholas,Greg
alert(people.toLocaleString()); //Nikolaos,Grigorios
10、數(shù)組push和pop方法
var colors = new Array(); //create an array
var count = colors.push("red", "green"); //push two items
alert(count); //2
count = colors.push("black"); //push another item on
alert(count); //3
var item = colors.pop(); //get the last item
alert(item); //"black"
alert(colors.length); //2
11、數(shù)組方法unshift和shift
//unshift() 方法可向數(shù)組的開(kāi)頭添加一個(gè)或更多元素，并返回新的長(zhǎng)度。
//shift() 方法用于把數(shù)組的第一個(gè)元素從其中刪除，并返回第一個(gè)元素的值。
var colors = new Array(); //create an array
var count = colors.unshift("red", "green"); //push two items
alert(count); //2
count = colors.unshift("black"); //push another item on
alert(count); //3
var item = colors.pop(); //get the first item
alert(item); //"green"
alert(colors.length); //2
12、數(shù)組倒序方法reverse
var values = [1, 2, 3, 4, 5];
values.reverse();
alert(values); //5,4,3,2,1
13、數(shù)組排序方法sort
function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
var values = [0, 1, 16, 10, 15];
values.sort(compare);
alert(values); //0,1,10,15,16
//sort 改變?cè)瓟?shù)組
14、數(shù)組方法slice
/*
slice() 方法可從已有的數(shù)組中返回選定的元素。
語(yǔ)法
arrayObject.slice(start,end)
start 必需。規(guī)定從何處開(kāi)始選取。如果是負(fù)數(shù)，那么它規(guī)定從數(shù)組尾部開(kāi)始算起的位置。也就是說(shuō)，-1 指最后一個(gè)元素，-2 指倒數(shù)第二個(gè)元素，以此類推。
end 可選。規(guī)定從何處結(jié)束選取。該參數(shù)是數(shù)組片斷結(jié)束處的數(shù)組下標(biāo)。如果沒(méi)有指定該參數(shù)，那么切分的數(shù)組包含從 start 到數(shù)組結(jié)束的所有元素。如果這個(gè)參數(shù)是負(fù)數(shù)，那么它規(guī)定的是從數(shù)組尾部開(kāi)始算起的元素。
返回值
返回一個(gè)新的數(shù)組，包含從 start 到 end （不包括該元素）的 arrayObject 中的元素。
*/
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors2); //green,blue,yellow,purple
alert(colors3); //green,blue,yellow
15、數(shù)組方法splice
/*
plice() 方法向/從數(shù)組中添加/刪除項(xiàng)目，然后返回被刪除的項(xiàng)目。
注釋：該方法會(huì)改變?cè)紨?shù)組。
語(yǔ)法
arrayObject.splice(index,howmany,item1,.....,itemX)
index 必需。整數(shù)，規(guī)定添加/刪除項(xiàng)目的位置，使用負(fù)數(shù)可從數(shù)組結(jié)尾處規(guī)定位置。
howmany 必需。要?jiǎng)h除的項(xiàng)目數(shù)量。如果設(shè)置為 0，則不會(huì)刪除項(xiàng)目。
item1, ..., itemX 可選。向數(shù)組添加的新項(xiàng)目。
*/
var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); //remove the first item
alert(colors); //green,blue
alert(removed); //red - one item array
removed = colors.splice(1, 0, "yellow", "orange"); //insert two items at position 1
alert(colors); //green,yellow,orange,blue
alert(removed); //empty array
removed = colors.splice(1, 1, "red", "purple"); //insert two values, remove one
alert(colors); //green,red,purple,orange,blue
alert(removed); //yellow - one item array
16、數(shù)組isArray()方法
alert(Array.isArray([])); //true
alert(Array.isArray({})); //false
以上就是今天的javascript學(xué)習(xí)小結(jié)，之后每天還會(huì)繼續(xù)更新，希望大家繼續(xù)關(guān)注。
您可能感興趣的文章:
- 在Javascript中為String對(duì)象添加trim,ltrim,rtrim方法
- Javascript String對(duì)象擴(kuò)展HTML編碼和解碼的方法
- JavaScript中json對(duì)象和string對(duì)象之間相互轉(zhuǎn)化
- 為Javascript中的String對(duì)象添加去除左右空格的方法(示例代碼)
- Javascript中的String對(duì)象詳談
- JavaScript字符串處理(String對(duì)象)詳解
- javascript中String對(duì)象的slice()方法分析
- 淺談JavaScript中的String對(duì)象常用方法
- 深入探討JavaScript String對(duì)象
- JavaScript原生對(duì)象之String對(duì)象的屬性和方法詳解
- JavaScript中string對(duì)象
- 每天一篇javascript學(xué)習(xí)小結(jié)（基礎(chǔ)知識(shí)）
- 每天一篇javascript學(xué)習(xí)小結(jié)（Boolean對(duì)象）
- 每天一篇javascript學(xué)習(xí)小結(jié)（Function對(duì)象）
- 每天一篇javascript學(xué)習(xí)小結(jié)（String對(duì)象）
相關(guān)文章
JavaScript實(shí)現(xiàn)簡(jiǎn)單隨機(jī)點(diǎn)名器
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡(jiǎn)單隨機(jī)點(diǎn)名器，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
JavaScript中好用的數(shù)組對(duì)象排序方法分享
在日常工作中，我們經(jīng)常需要對(duì)數(shù)組對(duì)象進(jìn)行排序，尤其是在處理數(shù)據(jù)可視化需求中。本文將介紹一些簡(jiǎn)單而又實(shí)用的方法，幫助你實(shí)現(xiàn)對(duì)數(shù)組對(duì)象的某幾個(gè) key 進(jìn)行排序2023-05-05
suggestion開(kāi)發(fā)小結(jié)以及對(duì)鍵盤事件的總結(jié)（針對(duì)中文輸入法狀態(tài)）
suggestion開(kāi)發(fā)小結(jié)以及對(duì)鍵盤事件的總結(jié)（針對(duì)中文輸入法狀態(tài)）,需要的朋友可以參考下。2011-12-12
bootstrap Table服務(wù)端處理分頁(yè)(后臺(tái)是.net)
這篇文章主要為大家詳細(xì)介紹了bootstrap Table服務(wù)端處理分頁(yè)，后臺(tái)是.net，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-10-10
這篇文章主要介紹了JS往數(shù)組中添加項(xiàng)性能分析的相關(guān)資料,需要的朋友可以參考下2015-02-02
JavaScript實(shí)現(xiàn)自動(dòng)彈出窗口并自動(dòng)關(guān)閉窗口的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)自動(dòng)彈出窗口并自動(dòng)關(guān)閉窗口的方法,可實(shí)現(xiàn)從頁(yè)面左側(cè)彈出窗口5秒后窗口向右移動(dòng)并消失的效果,涉及javascript針對(duì)頁(yè)面窗口及樣式的定義操作技巧,需要的朋友可以參考下2015-08-08
BootStrap中Tab頁(yè)簽切換實(shí)例代碼
這篇文章主要介紹了BootStrap中Tab頁(yè)簽切換實(shí)例代碼的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下2016-05-05
微信小程序?qū)崿F(xiàn)類似微信點(diǎn)擊語(yǔ)音播放效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)類似微信點(diǎn)擊語(yǔ)音播放效果，不會(huì)互相干擾播放狀態(tài)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要介紹了webpack打包js的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
JS實(shí)現(xiàn)課程表小程序(仿超級(jí)課程表)加入自定義背景功能
這篇文章主要介紹了JS實(shí)現(xiàn)課程表小程序(仿超級(jí)課程表)加入自定義背景功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-12-12