JS中几种包含for的遍历方式

jcc 发布于2019-08-22 18:09 / 385人阅读

摘要：区别遍历数组常用调用数组的每个元素，并将元素传递给回调函数这种循环的问题在于无法中途跳出循环，和命令不能奏效和都返回数组，返回的与原数组长度相同只返回符合条件的结果一个值和返回布尔值遍历对象所有的可枚举属性主要是为了遍历对象而设计的，不适

forEach,map,filter区别

forEach

遍历数组常用(调用数组的每个元素，并将元素传递给回调函数)

let arr = [1,2,3,4,5];
arr.forEach((i)=>{
    console.log(i);//1 2 3 4 5
});

这种循环的问题在于无法中途跳出循环，break和return命令不能奏效.
map和filter都返回数组，map返回的与原数组长度相同

map

let arr = ["a","b","c","d"];
let newArr = arr.map((val,key)=>{
    if(val=="c"){
        return val;}
});
console.log(newArr);//[undefined,undefined,"c",undefined];

filter

let arr = ["a","b","c","d"];
let newArr = arr.filter((val,key)=>{
    if(val=="c"){
        return val;
        }
});
console.log(newArr);//["c"]

只返回符合条件的结果一个值
every和some返回布尔值

for-in

遍历对象所有的可枚举属性（主要是为了遍历对象而设计的，不适用于遍历数组）功能类似于Object.keys().

let obj = {
    name:"xiaoming",
    age:15
}
for(let item in obj){
    console.log(item);//name age
}

不可枚举的对象：如constructor,数组的length

let arr = [10, 20, 30, 40, 50];
 
for (let item in arr) {
    console.log(item); // "0" "1" "2" "3" "4"
}

数组的键名是数字，但是for-in循环是以字符串作为键名‘0’、‘1’、‘2’等.

for-of

所有实现了[Symbol.iterator]接口的对象都可以被遍历。可以使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象（比如arguments对象、DOM NodeList 对象）、Generator 对象，以及字符串
for..of获取索引
.entries()返回键值对
.keys()返回键名
.values()返回键值
类似数组的对象：如字符串DOM NodeList 对象、arguments对象等

let str = "hi";
for(let i of str){
    console.log(s);
}//h i

let item = document.querySelectorAll("p");
for(let a of item){
    a.classList.add("test");
}

(function(){
    for(let x of arguments){
        console.log(x);
    }
})("a","b");
//"a"
//"b"

并非所有类似数组的对象都有iterator接口，使用Array.from()将其转化为数组

let ar = {length:2,0:"a",1:"b"};
for(let i of ar){
    console.log(i);//报错
}

for(let i of Array.from(ar)){
    consle.log(i);//"a" "b"
}

普通对象不能直接使用for-of会报错，因为没有iterator接口,for-in可以直接使用，若非要使用for-of需要使用Object.keys方法将键名生成一个数组，然后遍历这个数组。

for(let key of Object.keys(obj)){
    console.log(key+" "+obj[key]);
}

GPU云服务器云服务器 js继承的几种方式服务器请求的几种方式 java创建对象的几种方式几种方式

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95565.html

js中几种跨域的方法

摘要：四通过跨域一个页面嵌入一个外域的页面虽然两个窗体之前能获取彼此的对象，但是却拿不到上的属性和方法，例如一个页面嵌入一个的我是父窗体的方法嵌入的窗体跟的域名不同，很明显是跨域的，虽然能获取到对象，但是拿不到页面的任何方法和属性。 js跨域是指通过js在不同域之间进行相互通信或者数据传输，只要协议，域名，端口号其中有一个不同，就是跨域。下面总结一下我了解到的常用的跨域方法。一：通过jso...

XboxYan 2019-08-21 11:49 评论0 收藏0
JS篇－遍历对象属性(for in、Object.keys、Object.getOwnPropert

摘要：中几种遍历对象的方法，包括它们在使用场景方面各有不同。主要用于遍历对象的可枚举属性，包括自有属性继承自原型的属性输出如下返回一个数组，元素均为对象自有的可枚举属性输出如下用于返回对象的自有属性，包括可枚举和不可枚举的输出如下 js中几种遍历对象的方法，包括for in、Object.keys、Object.getOwnProperty,它们在使用场景方面各有不同。 for in 主要用...

sunnyxd 2019-08-21 11:22 评论0 收藏0
通过面试题，让我们来了解Collection

摘要：说一说迭代器通过集合对象获取其对应的对象判断是否存在下一个元素取出该元素并将迭代器对象指向下一个元素取出元素的方式迭代器。对于使用容器者而言，具体的实现不重要，只要通过容器获取到该实现的迭代器的对象即可，也就是方法。前言欢迎关注微信公众号：Coder编程获取最新原创技术文章和相关免费学习资料，随时随地学习技术知识！** 本章主要介绍Collection集合相关知识，结合面试中会提到...

HelKyle 2019-08-16 15:56 评论0 收藏0
谈谈java中几种常见的散列算法及解决哈希碰撞的方式

摘要：接下来分析几个常见的实现方式。再哈希法再哈希法，就是出现冲突后采用其他的哈希函数计算，直到不再冲突为止。，其中为不同的哈希函数。由表及里，循序渐进，请往下看。随手点赞是对作者最大的鼓励！^0^。什么是哈希表引用：严蔚敏《数据结构（C语言版）》中的内容 showImg(https://segmentfault.com/img/bVZlmE?w=800&h=364); 哈希表就是 ...

沈建明 2019-08-16 10:53 评论0 收藏0
CSS中几种常用的选择器

摘要：类和的背景颜色都为白色大于号指子代元素子代选择器类下的类元素的背景颜色为白色空格指后代元素后代选择器类下的所有类元素的背景颜色为白色与子代选择器不同，后代选择器可以包含下的所有元素，包括子孙加号指相邻元素相邻选择器紧接在类下的类元素的类a和b的背景颜色都为白色大于号‘ > ’指子代元素(子代选择器) .a>.b{ background-color:#fff; } 类a下的类...

赵连江 2019-08-30 15:44 评论0 收藏0