共同点:
1.都是循环遍历数组中的每一项。
2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前项的索引index,原始数组input。
3.匿名函数中的this都是指Window。
4.只能遍历数组。
1.forEach()
没有返回值。
[javascript] view plain copy
var ary = [12,23,24,42,1]
var res = ary.forEach(function (item,index,input) {
input[index] = item*10
})
console.log(res)//-->undefined
console.log(ary)//-->会对原来的数组产生改变;
2.map()
有返回值,可以return 出来。
[javascript] view plain copy
var ary = [12,23,24,42,1]
var res = ary.map(function (item,index,input) {
return item*10
})
console.log(res)//-->[120,230,240,420,10]
console.log(ary)//-->[12,23,24,42,1];
兼容写法:
不管是forEach还是map在IE6-8下都不兼容(不兼容的情况下在Array.prototype上没有这两个方法),那么需要我们自己封装一个都兼容的方法,代码如下:
[javascript] view plain copy
/**
* forEach遍历数组
* @param callback [function] 回调函数;
* @param context [object] 上下文;
*/
Array.prototype.myForEach = function myForEach(callback,context){
context = context || window
if('forEach' in Array.prototye) {
this.forEach(callback,context)
return
}
//IE6-8下自己编写回调函数执行的逻辑
for(var i = 0,len = this.lengthi <leni++) {
callback &&callback.call(context,this[i],i,this)
}
}
[javascript] view plain copy
/**
* map遍历数组
* @param callback [function] 回调函数;
* @param context [object] 上下文;
*/
Array.prototype.myMap = function myMap(callback,context){
context = context || window
if('map' in Array.prototye) {
return this.map(callback,context)
}
//IE6-8下自己编写回调函数执行的逻辑
var newAry = []
for(var i = 0,len = this.lengthi <leni++) {
if(typeof callback === 'function') {
var val = callback.call(context,this[i],i,this)
newAry[newAry.length] = val
}
}
return newAry
}
使用for...in可以遍历js对象的属性,用法如下: for...in 语句用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。 for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。优点: 遍历的时候更加简洁,效率和for循环相同,不用关心集合下标的问题,减少出错的效率缺点: 不能同时遍历多个集合,在遍历的时候无法修改和删除集合数据,方法不能使用break,continue语句跳出循环,或者使用return从函数体返回,对于空数组不会执行回调函数
forEach不可遍历对象,这也是和for in的区别
优点: 可以遍历数组的键名,遍历对象简洁方便
缺点: 某些情况下,会出现随机顺序的遍历,因为里面的值是string类型,所以增加了转换过程,因此开销比较大
优点: 避免了for in的所有缺点,可以使用break,continue和return,不仅支持数组的遍历,还可以遍历类似数组的对象,支持字符串的遍历,最直接的遍历数组的语法,支持map和set对象遍历
缺点: 不适用于处理原有的原生对象
优点: 程序简洁,结构清晰,循环初始化,循环变量化,循环体和循环条件位置突出
缺点: 结构比while循环复杂,容易出编码错误