- 1)concat方法:不會(huì)改變?cè)瓟?shù)組徘公,會(huì)返回一個(gè)拼接后的新數(shù)組
var arr1 = [1,2,3];
var arr2 = [3,4];
arr1.concat(arr2);
console.log(arr1.length); // 3
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [3, 4]
console.log(arr1.concat(arr2)) // [1, 2, 3, 3, 4]
- 2)slice方法:不會(huì)改變?cè)瓟?shù)組,會(huì)返回一個(gè)截取后的新數(shù)組
var arr = [1,2,3,4,5,6];
arr.slice(1,4);
console.log(arr); // (6) [1, 2, 3, 4, 5, 6]
console.log(arr.length); // 6
console.log(arr.slice(1,4)); // (3) [2, 3, 4]
// slice方法的手動(dòng)實(shí)現(xiàn)研叫,不綁定到原型鏈上
function my_slice(start, end) {
var start = start || 0;
var end = end || this.length; //this指向調(diào)用的對(duì)象锤窑,當(dāng)用了call后,能夠改變this的指向嚷炉,也就是指向傳進(jìn)來的對(duì)象渊啰,這是關(guān)鍵
var result = [];
for (var i = start; i < end; i++) {
result.push(this[i]);
}
return result;
}
arr = [1, 2, 3, 4, 5, 6];
console.log(my_slice.call(arr)); // [1, 2, 3, 4, 5, 6]
console.log(my_slice.call(arr, 1, 4)); // [2, 3, 4]
console.log(my_slice.call(arr, 1, 6)); // [2, 3, 4, 5, 6]
// // slice方法的手動(dòng)實(shí)現(xiàn),綁定到原型鏈上
Array.prototype.my_slice = function(start, end) {
var result = [];
var start = start || 0;
var end = end || this.length;
for (var i = start; i < end; i++) {
result.push(this[i]);
}
return result;
}
var arr = [1,2,3,4,5,6];
console.log(arr.my_slice()); // [1, 2, 3, 4, 5, 6]
console.log(arr.my_slice(1,4)); // [2, 3, 4]
console.log(arr.my_slice(1,6)); // [2, 3, 4, 5, 6]
- 3)join方法:不會(huì)改變?cè)瓟?shù)組申屹,會(huì)返回一個(gè)字符串
var arr = [1,2,3,4,5];
arr.join('-');
console.log(arr); // [1, 2, 3, 4, 5]
console.log(arr.length); // 5
console.log(arr.join('-')); // '1-2-3-4-5'
- 4)push/pop方法:會(huì)改變?cè)瓟?shù)組
var arr = [1, 2, 3, 4, 5];
arr.push(6);
console.log(arr); // (6) [1, 2, 3, 4, 5, 6]
console.log(arr.push(7)); // 7
console.log(arr); // (7) [1, 2, 3, 4, 5, 6, 7]
arr.pop();
console.log(arr); // (6) [1, 2, 3, 4, 5, 6]
console.log(arr.pop()); // 6
- 5)shift/unshift方法:會(huì)改變數(shù)組
var arr = [1,2,3,4,5];
arr.shift();
console.log(arr); // (4) [2, 3, 4, 5]
console.log(arr.length); // 4
arr.unshift(6);
console.log(arr); // (5) [6, 2, 3, 4, 5]
console.log(arr.length); // 5
- 6)sort方法:會(huì)改變數(shù)組
var arr = [21, 1, 3, 45, 2];
arr.sort();
console.log(arr); // (5) [1, 2, 21, 3, 45]
arr.sort(function(a, b) {
if (a < b) {
return -1;
} else if (a > b) {
return 1;
} else {
return 0;
}
})
console.log(arr); // (5) [1, 2, 3, 21, 45]
- 7)reverse方法:會(huì)改變數(shù)組
var arr = [21, 1, 3, 45, 2];
arr.reverse();
console.log(arr); // (5) [2, 45, 3, 1, 21]
- 8)splice方法:會(huì)改變數(shù)組绘证,并以數(shù)組形式返回被刪除的部分,插入時(shí)返回空數(shù)組
var arr = [1, 2, 3, 4, 5];
console.log(arr.splice(1,3)); // (3) [2, 3, 4] 返回被刪除的數(shù)
console.log(arr); // (2) [1, 5]
var arr1 = [1,2,3,4,5];
console.log(arr1.splice(1,0,7,8)); // [] 插入時(shí)返回空數(shù)組
console.log(arr1); // (7) [1, 7, 8, 2, 3, 4, 5]
var arr2 = [1,2,3,4,5];
console.log(arr2.splice(1,1,7,8)); // [2] 返回被替換掉的數(shù)
console.log(arr2); // (6) [1, 7, 8, 3, 4, 5]
- 9)indexOf/lastIndexOf方法:不會(huì)改變數(shù)組哗讥,返回指定數(shù)值的數(shù)組下標(biāo)
var arr = [1, 2, 3, 2, 5];
console.log(arr.indexOf(2)); // 1 返回值為2的數(shù)組的下標(biāo)
console.log(arr.indexOf(2,2)); // 3 第一個(gè)參數(shù)表示要查找的數(shù)嚷那,第二個(gè)參數(shù)表示查找起點(diǎn)位置的索引
console.log(arr.indexOf(6)); // -1
console.log(arr.lastIndexOf(2)); // 3 從數(shù)組的末尾開始向前查找,返回正序下標(biāo)
console.log(arr.lastIndexOf(2,2)); // 1 從數(shù)組的末尾開始向前查找杆煞,返回正序下標(biāo)
- 10)forEach方法:不會(huì)改變數(shù)組且方法沒有返回值
var arr = [1, 2, 3, 2, 5];
arr.forEach(function(a, index, array) { // 循環(huán)遍歷,對(duì)每一項(xiàng)運(yùn)行給定函數(shù),這個(gè)方法沒有返回值
console.log(a, index, array === arr); // 參數(shù)分別為:遍歷的數(shù)組內(nèi)容,內(nèi)容對(duì)應(yīng)的數(shù)組索引,數(shù)組本身
// 1 0 true
// 2 1 true
// 3 2 true
// 2 3 true
// 5 4 true
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.forEach(function(a) { // forEach方法沒有返回值
return a * 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // undefined
- 11)map方法:不會(huì)改變?cè)瓟?shù)組且返回一個(gè)新數(shù)組
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.map(function(a) { // 對(duì)每一項(xiàng)運(yùn)行給定函數(shù)魏宽,返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)組
return a * 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // (5) [2, 4, 6, 4, 10]
- 12)filter方法:不會(huì)改變?cè)瓟?shù)組,且返回一個(gè)新數(shù)組
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.filter(function(a) { // 返回滿足過濾條件組成的數(shù)組
return a > 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // (2) [3, 5]
- 13)every方法:不會(huì)改變?cè)瓟?shù)組决乎,且返回一個(gè)布爾值
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.every(function(a) { // 判斷數(shù)組中每一項(xiàng)都是否滿足條件队询,所有項(xiàng)都滿足條件才會(huì)返回true
return a > 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // false
- 14)some方法:不會(huì)改變?cè)瓟?shù)組,且返回一個(gè)布爾值
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.some(function(a) { // 判斷數(shù)組中每一項(xiàng)都是否滿足條件构诚,只要有一項(xiàng)滿足條件就會(huì)返回true
return a > 2;
})
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(arr1); // true
- 15)reduce方法:不會(huì)改變?cè)瓟?shù)組娘摔,迭代數(shù)組的所有項(xiàng),然后構(gòu)建一個(gè)最終返回的值唤反,從數(shù)組的第一項(xiàng)開始凳寺,逐個(gè)遍歷到最后
var arr = [1, 2, 3, 2, 5];
// reduce方法有兩個(gè)參數(shù):在每一項(xiàng)上調(diào)用的函數(shù)和(可選的)作為歸并基礎(chǔ)的初始值
// reduce方法的函數(shù)接收 4 個(gè)參數(shù):前一個(gè)值、當(dāng)前值彤侍、項(xiàng)的索引和數(shù)組對(duì)象
// 這個(gè)函數(shù)返回的任何值都會(huì)作為第一個(gè)參數(shù)自動(dòng)傳給下一項(xiàng)
// 第一次迭代發(fā)生在數(shù)組的第二項(xiàng)上肠缨,因此第一個(gè)參數(shù)是數(shù)組的第一項(xiàng),第二個(gè)參數(shù)是數(shù)組的第二項(xiàng)
var sum = arr.reduce(function(pre, cur, index, array) {
return pre + cur;
}, 10)
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(sum); // 23
- 16)reduceRight:不會(huì)改變?cè)瓟?shù)組盏阶,迭代數(shù)組的所有項(xiàng)晒奕,從數(shù)組的最后一項(xiàng)開始,向前遍歷到第一項(xiàng)
var arr = [1, 2, 3, 2, 5];
var sum = arr.reduceRight(function(pre, cur, index, array) {
return pre + cur;
}, 10)
console.log(arr); // (5) [1, 2, 3, 2, 5]
console.log(sum); // 23
- 17)fill:會(huì)改變?cè)瓟?shù)組,元素填充
// arr.fill(value, start, end)
var arr = [1, 2, 3, 2, 5];
arr.fill(1,2,4); // 用1填充數(shù)組中從起始索引到終止索引內(nèi)的全部元素
console.log(arr); // (5) [1, 2, 1, 1, 5]
- 18)find:不會(huì)改變?cè)瓟?shù)組脑慧,返回?cái)?shù)組中滿足提供的測(cè)試函數(shù)的第一個(gè)元素的值
function big(element) {
return element >= 2;
}
var arr = [1, 2, 3, 2, 5];
var arr1 = arr.find(big); // 返回?cái)?shù)組中滿足提供的測(cè)試函數(shù)的第一個(gè)元素的值
console.log(arr1); // 2
console.log(arr); // (5) [1, 2, 3, 2, 5]
- 19)includes方法:用來判斷一個(gè)數(shù)組是否包含一個(gè)指定的值魄眉,返回 true或 false
var arr = [1, 2, 3, 2, 5];
console.log(arr.includes(2)); // true
console.log(arr.includes(6)); // false
- 20)toLocaleString:不會(huì)改變?cè)瓟?shù)組,返回一個(gè)字符串表示數(shù)組中的元素闷袒,數(shù)組中的元素將使用各自的 toLocaleString 方法轉(zhuǎn)成字符串坑律,這些字符串將使用一個(gè)特定語言環(huán)境的字符串(例如一個(gè)逗號(hào) “,”)隔開
var arr = [11111111, 2222222];
console.log(arr.toLocaleString()); // 11,111,111,2,222,222
console.log(arr); // (2) [11111111, 2222222]
- 21)toString:不會(huì)改變?cè)瓟?shù)組,返回一個(gè)字符串囊骤,表示指定的數(shù)組及其元素
var arr = [1,2,3];
arr.toString();
console.log(arr.toString()); // '1,2,3'
console.log(arr); // (3) [1, 2, 3]
- 22)Array.from:將偽數(shù)組或可迭代對(duì)象(包括arguments Array,Map,Set,String…)轉(zhuǎn)換成數(shù)組對(duì)象
// arrayLike:想要轉(zhuǎn)換成數(shù)組的偽數(shù)組對(duì)象或可迭代對(duì)象
// mapFn (可選參數(shù)):如果指定了該參數(shù)晃择,新數(shù)組中的每個(gè)元素會(huì)執(zhí)行該回調(diào)函數(shù)
// thisArg (可選參數(shù)):可選參數(shù),執(zhí)行回調(diào)函數(shù) mapFn 時(shí) this 對(duì)象
// 返回值:一個(gè)新的數(shù)組實(shí)例
Array.from(arrayLike, mapFn, thisArg)
toString()方法與toLocalString()方法區(qū)別:
??????1)toLocalString()是調(diào)用每個(gè)數(shù)組元素的 toLocaleString() 方法也物,然后使用地區(qū)特定的分隔符把生成的字符串連接起來宫屠,形成一個(gè)字符串;
??????2)toString()方法獲取的是String(傳統(tǒng)字符串),而toLocaleString()方法獲取的是LocaleString(本地環(huán)境字符串)滑蚯;
??????3)如果你開發(fā)的腳本在世界范圍都有人使用浪蹂,那么將對(duì)象轉(zhuǎn)換成字符串時(shí)請(qǐng)使用toString()方法來完成;
??????4)LocaleString()會(huì)根據(jù)你機(jī)器的本地環(huán)境來返回字符串告材,它和toString()返回的值在不同的本地環(huán)境下使用的符號(hào)會(huì)有微妙的變化乌逐;
??????5)使用toString()是保險(xiǎn)的,返回唯一值的方法,它不會(huì)因?yàn)楸镜丨h(huán)境的改變而發(fā)生變化创葡;如果是為了返回時(shí)間類型的數(shù)據(jù)浙踢,推薦使用LocaleString();若是在后臺(tái)處理字符串灿渴,請(qǐng)務(wù)必使用toString()洛波;
###toString()、toLocaleString()骚露、valueOf()方法的區(qū)別
// JS Array
var arr = [12421,22232,3333];
console.log(arr.valueOf()); // (3) [12421, 22232, 3333] 返回?cái)?shù)組本身
console.log(arr.toString()); // '12421,22232,3333' 把數(shù)組轉(zhuǎn)換為字符串蹬挤,并返回結(jié)果,每一項(xiàng)以逗號(hào)分割
console.log(arr.toLocaleString()); // '12,421,22,232,3,333' 把數(shù)組轉(zhuǎn)換為本地?cái)?shù)組棘幸,并返回結(jié)果
// JS Boolean
var boolean = new Boolean();
console.log(boolean.valueOf()); // false 返回 Boolean 對(duì)象的原始值
// 根據(jù)原始布爾值或者 booleanObject 對(duì)象的值返回字符串 "true" 或 "false",默認(rèn)為"false"
console.log(boolean.toString()); // 'false'
// Boolean對(duì)象沒有toLocalString()方法,但是在Boolean對(duì)象上使用這個(gè)方法也不會(huì)報(bào)錯(cuò)
// JS Math
console.log(Math.PI.valueOf()); // 3.141592653589793
// JS Number
var num = new Number(11337);
console.log(num.valueOf()); // 11337
console.log(num.toString()); // '11337'
console.log(num.toLocaleString()); // '11,337'
// JS String
var str = 'fsflgs';
console.log(str.valueOf()); // 'fsflgs'
console.log(str.toString()); // 'fsflgs'
console.log(str.toLocaleString()); // 'fsflgs'
// JS Date
var date = new Date();
console.log(date); // Thu Sep 13 2018 21:51:58 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)
console.log(date.toLocaleString()); // 2018/9/13 下午9:51:58
會(huì)改變?cè)瓟?shù)組的方法
pop焰扳、push、shift误续、unshift吨悍、fill、sort蹋嵌、reverse育瓜、splice
參考鏈接:
js數(shù)組方法大全
Javascript toString()、toLocaleString()栽烂、valueOf()三個(gè)方法的區(qū)別