for\for each\for in


for\for each\for in:

以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性,语句都会被执行。

语法:
for (variable in object) {...}
参数:
数组索引仅是可枚举的整数名,其他方面和别的普通对象属性没有什么区别。for...in 并不能够保证返回的是按一定顺序的索引,但是它会返回所有可枚举属性,包括非整数名称的和继承的。
因为迭代的顺序是依赖于执行环境的,所以数组遍历不一定按次序访问元素。因此当迭代那些访问次序重要的 arrays 时用整数索引去进行for循环(或者使用Array.prototype.forEach()或for...of循环) 。
如果你只要考虑对象本身的属性,而不是它的原型,那么使用getOwnPropertyNames()或执行hasOwnProperty()来确定某属性是否是对象本身的属性(也能使用propertyIsEnumerable)。另外,如果你知道外部不存在任何的干扰代码,你可以扩展内置原型与检查方法。
var obj = {a:1, b:2, c:3}; for (var prop in obj) { console.log("obj." + prop + " = " + obj[prop]); } // Output: // "obj.a = 1" // "obj.b = 2" // "obj.c = 3"
var triangle = {a:1, b:2, c:3}; function ColoredTriangle() { this.color = "red"; } ColoredTriangle.prototype = triangle; var obj = new ColoredTriangle(); for (var prop in obj) { if( obj.hasOwnProperty( prop ) ) { console.log("o." + prop + " = " + obj[prop]); } } // Output: // "o.color = red"
使用一个变量迭代一个对象的所有属性值,对于每一个属性值,有一个指定的语句块被执行.
for each...in是ECMA-357 (E4X)标准的一部分, 大部分非Mozilla浏览器都没有实现该标准, E4X并不是 ECMAScript 标准的一部分.
作为ECMA-357(E4X)标准的一部分,for each...in语句已被废弃,E4X中的大部分特性已被删除,但考虑到向后兼容,for each...in只会被禁用而不会被删除,可以使用ES6中新的for...of语句来代替.
语法:
for each (variable in object) { statement }
参数:
一些对象的内置属性是无法被遍历到的,包括所有的内置方法,例如String对象的indexOf方法.不过,大部分的用户自定义属性都是可遍历的.
警告:永远不要使用for each...in语句遍历数组,仅用来遍历常规对象。
var sum = 0; var obj = {prop1: 5, prop2: 13, prop3: 8}; for each (var item in obj) { sum += item; } print(sum); // 输出"26",也就是5+13+8的值
用于创建一个循环,它包含了三个可选的表达式,三个可选的表达式包围在圆括号中并由分号分隔,后面跟随一个语句或一组语句在循环中执行.
语法:
for ([initialization]; [condition]; [final-expression]) statement
参数:
initialization一个表达式 (包含赋值语句) 或者变量声明。典型地被用于初始化一个计数器。该表达式可以使用var关键字声明新的变量。初始化中的变量不是该循环的局部变量,而是与该循环处在同样的作用域中。该表达式的结果无意义。
condition一个条件表达式被用于确定每一次循环是否能被执行。如果该表达式的结果为true,循环体内的语句将被执行。这个表达式是可选的。如果被忽略,那么就被认为永远为true。如果计算结果为false,那么执行流程将被跳到for语句结构后面的第一条语句。
final-expression每次循环的最后都要执行的表达式。执行时机是在下一次condition的计算之前。通常被用于更新或者递增计数器变量。
statement只要condition的结果为true就会被执行的语句。要在循环体内执行多条语句,使用一个block结构({ ... }) 来包含要执行的语句。没有任何语句要执行,使用一个empty语句(;)。
以下例子声明了变量i并被初始赋值为0,for语句检查i的值是否小于9,如果小于9,则执行语句块内的语句,并且最后将i的值递增。
for (var i = 0; i < 9; i++) { console.log(i); // more statements }
for语句的所有的表达式都是可选的
举个例子,初始化语句(initialization)中的表达式没有被指定:
var i = 0; for (; i < 9; i++) { console.log(i); // more statements }
就像initialization,condition也是可选的。如果你忽略了,为了不要创建了死循环(无限循环),你必须确保循环体内存在可以退出循环的语句,使用break。
for (var i = 0;; i++) { console.log(i); if (i > 3) break; // more statements }
你当然可以忽略所有的表达式。同样的,确保使用了break语句来退出循环并且你还需要修改(递增)一个变量,以确保能够正常执行break语句。
var i = 0; for (;;) { if (i > 3) break; console.log(i); i++; }
以下为在[final-expression]部分中循环计算一个节点的偏移位置,它不需要执行一个语句或者一组语句,因此使用了空语句。
function showOffsetPos (sId) { var nLeft = 0, nTop = 0; for (var oItNode = document.getElementById(sId); // initialization oItNode; // condition nLeft += oItNode.offsetLeft, nTop += oItNode.offsetTop, oItNode = oItNode.offsetParent) // final-expression /* empty statement */ ; console.log("Offset position of \"" + sId + "\" element:\n left: " + nLeft + "px;\n top: " + nTop + "px;"); } // Example call: showOffsetPos("content"); // Output: // "Offset position of "content" element: // left: 0px; // top: 153px;"
forEach()方法对数组的每个元素执行一次提供的函数。
let a = ['a', 'b', 'c']; a.forEach(function(element) { console.log(element); }); // a // b // c
语法:
array.forEach(callback(currentValue, index, array){ //do something }, this) array.forEach(callback[, thisArg])
参数:
callback为数组中每个元素执行的函数,该函数接收三个参数:
thisArg可选可选参数。当执行回调函数时用作this的值(参考对象)。
forEach方法按升序为数组中含有效值的每一项执行一次callback函数,那些已删除(使用delete方法等情况)或者未初始化的项将被跳过(但不包括那些值为undefined 的项)(例如在稀疏数组上)。
callback函数会被依次传入三个参数:
如果给forEach传递了thisArg参数,当调用时,它将被传给callback函数,作为它的this值。否则,将会传入undefined作为它的this值。callback函数最终可观察到this值,这取决于函数观察到this的常用规则。
forEach遍历的范围在第一次调用callback前就会确定。调用forEach后添加到数组中的项不会被callback访问到。如果已经存在的值被改变,则传递给callback的值是forEach遍历到他们那一刻的值。已删除的项不会被遍历到。如果已访问的元素在迭代时被删除了(例如使用shift()) ,之后的元素将被跳过 - 参见下面的示例。
function logArrayElements(element, index, array) { console.log("a[" + index + "] = " + element); } // 注意索引2被跳过了,因为在数组的这个位置没有项 [2, 5, ,9].forEach(logArrayElements); // a[0] = 2 // a[1] = 5 // a[3] = 9 [2, 5,"" ,9].forEach(logArrayElements); // a[0] = 2 // a[1] = 5 // a[2] = // a[3] = 9 [2, 5, undefined ,9].forEach(logArrayElements); // a[0] = 2 // a[1] = 5 // a[2] = undefined // a[3] = 9 let xxx; // undefined [2, 5, xxx ,9].forEach(logArrayElements); // a[0] = 2 // a[1] = 5 // a[2] = undefined // a[3] = 9
//从每个数组中的元素值中更新一个对象的属性:function Counter() { this.sum = 0; this.count = 0; } Counter.prototype.add = function(array) { array.forEach(function(entry) { this.sum += entry; ++this.count; }, this); //console.log(this); }; var obj = new Counter(); obj.add([1, 3, 5, 7]); obj.count; // 4 === (1+1+1+1) obj.sum; // 16 === (1+3+5+7)
因为thisArg参数 (this) 传给了forEach(),每次调用时,它都被传给callback函数,作为它的this值。
5、for...of
ECMAScript 6新方法,使用时参考https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...of
参考文献:

长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号





    联系我们

    欢迎来到TinyMind。

    关于TinyMind的内容或商务合作、网站建议,举报不良信息等均可联系我们。

    TinyMind客服邮箱:support@tinymind.net.cn