ES5具有遍歷數(shù)組功能的還有map莉擒、filter、some瘫絮、every涨冀、reduce、reduceRight等麦萤,只不過(guò)他們的返回結(jié)果不一樣
1鹿鳖、map():通過(guò)指定函數(shù)處理數(shù)組的每個(gè)元素,并返回處理后的數(shù)組壮莹。
注意:map不會(huì)改變?cè)瓟?shù)組翅帜,map不會(huì)檢查空數(shù)組
var num = [4, 9, 16, 25];
num.map(Math.sqrt) // [2, 3, 4, 5]
console.log(num) // [4, 9, 16, 25]
2、some():用于檢測(cè)數(shù)組中的元素是否滿足指定條件(函數(shù)提供)
- 如果有一個(gè)元素滿足條件垛孔,則表達(dá)式返回true ,
剩余的元素不會(huì)再執(zhí)行檢測(cè)
- 如果沒(méi)有滿足條件的元素藕甩,則返回false
- unction形參和map一樣
some不會(huì)改變?cè)瓟?shù)組,some不會(huì)檢查空數(shù)組
var ages = [3, 10, 18, 20];
ages.some(function(age){ return age>10}) // true
console.log(ages) // [3, 10, 18, 20];
3周荐、every:用于檢測(cè)數(shù)組所有元素是否都符合指定條件(通過(guò)函數(shù)提供)
every和some正好相反:
- 如果數(shù)組中檢測(cè)到有一個(gè)元素不滿足狭莱,則整個(gè)表達(dá)式返回 false ,且剩余的元素不會(huì)再進(jìn)行檢測(cè)概作。
- 如果所有元素都滿足條件腋妙,則返回 true。
var ages = [32, 33, 16, 40];
ages.every(checkAdult) // false
function checkAdult(age) {
return age >= 18;
}
4讯榕、filter:創(chuàng)建一個(gè)新的數(shù)組骤素,新數(shù)組中的元素是通過(guò)檢查指定數(shù)組中符合條件的所有元素
filter會(huì)根據(jù)函數(shù)中的篩選條件將返回的結(jié)果組成一個(gè)新的數(shù)組并返回
var ages = [32, 33, 16, 40];
function checkAdult(age) {
return age >= 18;
}
function myFunction() {
console.log(ages.filter(checkAdult)); // 32 33 40
}
5匙睹、forEach:
沒(méi)有返回值,只針對(duì)每個(gè)元素調(diào)用func济竹。
優(yōu)點(diǎn):代碼簡(jiǎn)介痕檬。
缺點(diǎn):無(wú)法使用break,return等終止循環(huán)送浊。
let list = [1, 2, 3, 4, 5];
let other = [];
list.forEach((d, i) => {
other.push(d * 2);
});
console.log(other);
// print: [2, 4, 6, 8, 10]
6梦谜、for... in 和for... of 的區(qū)別
1、使用for in會(huì)遍歷數(shù)組所有的可枚舉屬性袭景,包括原型
2唁桩、原型方法method和name屬性,所以for in更適合遍歷對(duì)象耸棒,不要使用for in遍歷數(shù)組荒澡。for…in循環(huán)不僅遍歷數(shù)字鍵名,還會(huì)遍歷手動(dòng)添加的其他鍵与殃,甚至包括原型鏈上的鍵单山。
3、for…in遍歷出的結(jié)果是key奈籽;for…of遍歷出的結(jié)果是value
Array.prototype.method=function(){
console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="數(shù)組"
for (var index in myArray) {
console.log(myArray[index]);
}
// 1,2,3,4,5,6,7,'數(shù)組'饥侵,function(){console.log(this.length);}
for in 可以遍歷到myObject的原型方法method,如果不想遍歷原型方法和屬性的話,可以在循環(huán)內(nèi)部判斷一下,hasOwnPropery方法可以判斷某屬性是否是該對(duì)象的實(shí)例屬性
只有屬性存在實(shí)例中才會(huì)返回true
for (var key in myObject) {
if(myObject.hasOwnProperty(key)){
console.log(key);
}
}
同樣可以通過(guò)ES5的Object.keys(myObject)獲取對(duì)象的實(shí)例屬性組成的數(shù)組
如果要取得對(duì)象上所有可枚舉的實(shí)例屬性衣屏,可以使用Object.keys(), 返回字符串?dāng)?shù)組。
Object.prototype.method=function(){
console.log(this);
}
var myObject={
a:1,
b:2,
c:3
}
Object.keys(myObject)
//["a", "b", "c"]
4辩棒、for...of 不會(huì)遍歷原型狼忱,輸出value
Array.prototype.method=function(){
console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="數(shù)組";
for (var value of myArray) {
console.log(value);
}
// 1,2,3,4,5,6,7
for..of適用遍歷數(shù)/數(shù)組對(duì)象/字符串/map/set等擁有迭代器對(duì)象的集合.但是不能遍歷對(duì)象,因?yàn)闆](méi)有迭代器對(duì)象.與forEach()不同的是,它可以正確響應(yīng)break一睁、continue和return語(yǔ)句
for-of循環(huán)不支持普通對(duì)象钻弄,但如果你想迭代一個(gè)對(duì)象的屬性,你可以用for-in循環(huán)(這也是它的本職工作)或內(nèi)建的Object.keys()方法:
for (var key of Object.keys(someObject)) {
console.log(key + ": " + someObject[key]);
}
for-of循環(huán)首先調(diào)用集合的Symbol.iterator方法者吁,緊接著返回一個(gè)新的迭代器對(duì)象窘俺。迭代器對(duì)象可以是任意具有.next()方法的對(duì)象;for-of循環(huán)將重復(fù)調(diào)用這個(gè)方法复凳,每次循環(huán)調(diào)用一次