• 10th week (1)


    //1、for in 循环
    /=====================================/
    //=>语法: for (variable in object) {...}
    //for...in语句以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性,语句都会被执行。
    //=> variable (变量):每次迭代时,将不同的属性名分配给变量
    //=> object (对象) :被迭代枚举其属性的对象

    var obj = {a:'A',b:'B',1:'c',2:'d',};
    //obj对象有两个属性是数字,分别为1和2,值分别为'c'和'd'
    for (var key in obj){
        //key存储的值为字符串类型的
       // console.log(typeof key); //=> string
        console.log(obj[key]);  // = > c d A B
    }
    // 结果为 =>c d A B ,  在 for in 循环遍历的时候,把对象的数字属性名排在前面
    //并且排列的时候按照数字由小到大排列,非数字的属性名按照之前编写的顺序排列
    

    //循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性
    //for...in 循环只遍历可枚举属性。像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototype和String.prototype的不可枚举属性,例如 String 的 indexOf() 方法或 Object的toString()方法。循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性

    var oobj = {a: 1, b: 2, c: 3};
    
    function Fn() {
        this.color = 'red';
    }
    Fn.prototype = oobj;   //Fn的原型指向oobj这个对象
    
    var obj2 = new Fn();    //new一个Fn这个构造函数的实例
    console.log(obj2.a);    //obj2.a是obj2对象原型上的属性   = > 1
    
    //obj.propertyIsEnumerable(prop) 方法返回一个布尔值,表示指定的属性是否可枚举。
    
    console.log(obj2.propertyIsEnumerable('a'));    // => false  不可枚举,但是仍然可以遍历到
    console.log(obj2.propertyIsEnumerable('color'));    //  = > true  可枚举
    console.log(obj2.hasOwnProperty('color'));  //  => true
    
    for (var prop in obj2) {
        console.log('obj2.' + prop + '=' + obj2[prop]);  //  =>  obj2.color=red  obj2.a=1  obj2.b=2  obj2.c=3
        //obj.hasOwnProperty(prop) 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性
        //可以通过这个方法可以做条件判断,属性是私有的还是公有的,输出私有的属性
        if (obj2.hasOwnProperty(prop)) {
            console.log('obj2.' + prop + '=' + obj2[prop]);  // obj2.color=red
        }
    }
    

    // for...in不应该用于迭代一个 Array,其中索引顺序很重要
    //数组索引只是具有整数名称的枚举属性,并且与通用对象属性相同。不能保证for ... in将以任何特定的顺序返回索引。for ... in循环语句将返回所有可枚举属性,包括非整数类型的名称和继承的那些。
    //因为迭代的顺序是依赖于执行环境的,所以数组遍历不一定按次序访问元素。因此当迭代访问顺序很重要的数组时,最好用整数索引去进行for循环(或者使用 Array.prototype.forEach() 或 for...of 循环)。
    /=====================================/

    //2、for of语句在可迭代对象(包括 Array,Map,Set,String,TypedArray,arguments对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句

    //语法: for (variable of object) {...} 相当于 for (let 值 of 数组 ) {...}
    //variable表示值,object是一个定义了迭代行为的对象,如:数组

    //遍历数组Array
    let arr = [1, 2, 3];
    
    for (let value of arr) {
        value += 1;
        console.log(value);   // => 2 3 4
    }
    
    //遍历String
    let iterable = "abcd";
    
    for (let value of iterable) {
        console.log(value);     // => a b c d
    }
    
    //遍历类数组对象arguments
    (function() {
        for (let argument of arguments) {
            console.log(argument);  // 1 2 3
        }
    })(1, 2, 3);
    
    // 对于for...of的循环,可以由break, throw 或return终止
    function* foo(){
        yield 1;
        yield 2;
        yield 3;
    };
    
    for (let o of foo()) {
        console.log(o);
        break; // closes iterator, triggers return
    }
    

    /=====================================/

    //** 【 for...in 和 for...of 的区别】 **
    //无论是for...in还是for...of语句都是迭代一些东西。它们之间的主要区别在于它们的迭代方式。

    //for...in 语句以原始插入顺序迭代对象的可枚举属性。
    //for...of 语句遍历可迭代对象定义要迭代的数据。

    Object.prototype.objCustom = function() {};
    Array.prototype.arrCustom = function() {};
    
    let arryNum = [3, 5, 7];
    arryNum.foo = 'hello';
    
    for (let i in arryNum) {
        console.log(i); // =>  0, 1, 2, "foo", "arrCustom", "objCustom"
    }
    
    for (let i in arryNum) {
        if (arryNum.hasOwnProperty(i)) {
            console.log(i); // => 0, 1, 2, "foo"
        }
    }
    
    for (let i of arryNum) {
        console.log(i); // =>  3, 5, 7
    }
    

    //3、Array.prototype.forEach() 对数组的每个元素执行一次提供的函数,相当于遍历数组中的每一项,对每一项执行一次函数
    //语法:
    /* array.forEach(callback(currentValue, index, array){
    * //do something
    * }, this)
    *
    * array.forEach(callback[, thisArg])
    * /

    //回调函数callback 为数组中每个元素执行的函数,该函数接收三个参数
    //currentValue -> 数组中正在处理的当前元素。
    //index可选 -> 数组中正在处理的当前元素的索引
    //array可选 ->forEach()方法正在操作的数组。
    //thisArg可选 ->可选参数。当执行回调 函数时用作this的值(参考对象)。

    // forEach 方法按升序为数组中含有效值的每一项执行一次callback 函数,那些已删除或者未初始化的项将被跳过(例如在稀疏数组上)。
    // callback 函数会被依次传入三个参数:数组当前项的值、数组当前项的索引、数组对象本身

    参考资料:
    https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach




  • 相关阅读:
    【编译原理】文法解析算法以及左递归消除算法
    【编译原理】 DFA词法分析和递归下降语法分析代码
    编译原理 第三章 词法分析(下)
    详解KMP算法
    编译原理 第三章 词法分析(上)
    ExtJs4.0入门错误
    致好友的一封信
    解析Xml四种方法
    Spring AOP实现原理
    Spring Ioc知识整理
  • 原文地址:https://www.cnblogs.com/xcee/p/9934439.html
Copyright © 2020-2023  润新知