您的位置: 首页  >  IT文章  >  for in与for of的区别,以及forEach,map,some,every,filter的区别

for in与for of的区别,以及forEach,map,some,every,filter的区别

分类: IT文章 • 2022-05-11 21:40:17

一、for in与for of的区别

1 Array.prototype.method=function(){
2 　　console.log(this.length);
3 }
4 var myArray=[1,2,4,5,6,7]
5 myArray.name="数组"
6 for (var index in myArray) {
7   console.log(myArray[index]);
8 }

使用for in 也可以遍历数组，但是会存在以下问题：

1.index索引为字符串型数字，不能直接进行几何运算

2.遍历顺序有可能不是按照实际数组的内部顺序

3.使用for in会遍历数组所有的可枚举属性，包括原型。例如上栗的原型方法method和name属性

所以for in更适合遍历对象，不要使用for in遍历数组。

那么除了使用for循环，如何更简单的正确的遍历数组达到我们的期望呢（即不遍历method和name），ES6中的for of更胜一筹.

1 Array.prototype.method=function(){
2 　　console.log(this.length);
3 }
4 var myArray=[1,2,4,5,6,7]
5 myArray.name="数组";
6 for (var value of myArray) {
7   console.log(value);
8 }

记住，for in遍历的是数组的索引（即键名），而for of遍历的是数组元素值。

for of遍历的只是数组内的元素，而不包括数组的原型属性method和索引name

遍历对象 通常用for in来遍历对象的键名

 1 Object.prototype.method=function(){
 2 　　console.log(this);
 3 }
 4 var myObject={
 5 　　a:1,
 6 　　b:2,
 7 　　c:3
 8 }
 9 for (var key in myObject) {
10   console.log(key);
11 }

hasOwnPropery方法可以判断某属性是否是该对象的实例属性

1 for (var key in myObject) {
2 　　if（myObject.hasOwnProperty(key)){
3 　　　　console.log(key);
4 　　}
5 }

 同样可以通过ES5的Object.keys(myObject)获取对象的实例属性组成的数组，不包括原型方法和属性。

1 Object.prototype.method=function(){
2 　　console.log(this);
3 }
4 var myObject={
5 　　a:1,
6 　　b:2,
7 　　c:3
8 }
9 Object.keys(myObject).forEach(function(key,index){<br>　　console.log(key,myObject[key])<br>})

二、forEach,map,some,every,filter的区别

forEach() 方法对数组的每一个元素执行一次提供的函数。

map() 方法创建一个新数组，其结果是该数组都执行一次函数，原函数保持不变。

filter() 方法使指定函数测试数组的每一个元素，并放回一个通过元素的新数组。

some() 方法测试该数组有元素通过了指定函数的测试，如果有返回true，否则，返回false。

every() 方法测试该数组是否全部通过指定函数测试，全部通过返回true，否则，返回false。

forEach 遍历数组

1 var arr = ["a", "b", "c"];
2  
3 arr.forEach(function(element,index) {
4     console.log(element,index);      
5 });

map 返回新数组，为当前元素加字符串m

 1 var arr = ["a", "b", "c"];
 2  
 3 arr.map(function(element,index) {
 4     return element += "m";
 5 });
 6  
 7 // 将给定数组的元素转成整数
 8  
 9 ["1", "2", "3"].map(parseInt);         // [1, NaN, NaN]
10 // 等价于
11 ["1", "2", "3"].map(function(value,index,array){
12     return parseInt(value,index);
13 });
14 parseInt(3,1);                         // NaN   parseInt(string, radix) 函数将给定的字符串以指定基数解析成为整数。

filter 返回大于10的元素

1 // 12, 130, 44
2 var arr = [12, 5, 8, 130, 44];
3 arr.filter(function(value){
4     return value>10
5 });
6 // 等价于
7 arr.filter((value)=>value>10);

some 判断当前数组有元素大于10的元素

1 var arr = [12, 5, 8, 130, 44];
2 arr.some(function(value){                  // true
3     return value>10
4 });

every 判断当前数组所有元素是否都大于10

1 var arr = [12, 5, 8, 130, 44];
2 arr.every(function(value){                 // false
3     return value>10
4 });

相关推荐