美文网首页日常积累
对象枚举 , 数组和对象遍历 三目运算符 对象的深度克隆 —

对象枚举 , 数组和对象遍历 三目运算符 对象的深度克隆 —

作者: 大大大l脸 | 来源:发表于2019-01-24 22:24 被阅读29次

    枚举 遍历

    遍历数组

     // 如何取数组的值关键 :数组有length 
            var arr = ['1苹果', '2香蕉', '3芒果', '4柠檬'];
            for (var i = 0; i < arr.length; i++) {
                console.log(arr[i]); // 1苹果 ,2香蕉,3芒果,4柠檬
            }
    

    遍历对象, var prop in obj 取出对象所有属性的值(不取属性 只取值)

     var obj = {
                a: 123,
                b: 234,
                c: 345,
            };
    
      for (var prop in obj) {
      //  console.log(obj.prop); 结果是undefined 
      //  底层原理结果是:console.log(obj['prop']) 此时的'prop'代表的是一个属性名
       //  obj.name------>obj['name'] 
    
    
    
         if (obj.hasOwnProperty(prop)) { //判断prop 是不是自己的属性。hasOwnProperty(prop),属性名的字符串形式传进去
            console.log(obj[prop]); //此时的prop 代表的是一个变量  系统带的不会遍历到, 只有自己设的才会被遍历到
        //  cosole.log(obj.prop)    obj.prop底部原理是 ————> obj['prop'] 
    //obj.prop 的prop 是字符串''prop''-->obj.''prop''。obj[ ]内部是变量 、表达式、基本类型
    // obj[1+2] =》 obj[3]
    // var a = "A"; var b="B"; obj[a+b] => obj["AB"]
                }
    
        }
    
    
    
    
    

    数组也算特殊类型的对象,也可以用var prop in arr取出数组所有索引的值

     var arr1 = ['我在图书馆', 25, 'xuexi'];
    var key//  和var key in arr1 结果一样 可以在外部申明变量
    for ( key in arr1) {
              console.log(arr1[key]); //我在图书馆  25  xuexi
    
       }
    
    知识点:

    obj.name=obj['name']
    1+''='1';

    下面的案例很好的将这个两个知识点运用到

     var deng = {
                wife1: {
                    name: "小赵",
    
                },
                wife2: {
                    name: "小赵",
    
                },
                wife3: {
                    name: "小赵",
    
                }
                sayWife: function(num) {
    
                    return this['wife' + num]
                }
    
            }
      console.log(deng.sayWife(3)); // {name:''小孙"}
    
    
    

    正确区分数组和对象的方法

     typeof ([ ])--->"object"  
    typeof( {}) ---->"object"
    

    typeof() 无法区分数组和对象。

    1.instanceof
    instanceof: A instanceof B -->> A对象是不是B构造函数构造出来的
    正确说明: 看A对象的原型链上 有没有 B的原型,其实起作用的是 constructor
    [ ] instanceof Array--->true
    var obj={ },obj instanceof Array ---->false
    2.constructor
    [ ].constructor ---->function Array(){}
    var obj={},obj.constructor ---->function Object(){ }

    3.toString(){ } 推荐使用,区别数组和对象
    包装类都重写了自己的toString方法,
    Number.prototype.toString
    Arry.prototype.toString
    Boolean.prototype.toString
    String.prototype.toString
    只有Object.prototype.toString 能够区分

     Object.prototype.toString=functon(){ 
    ---》 识别调用者 并且返回相应的结果  
    
    }  //我们需要找的也是这个调用者的类型。这个调用者 其实也就是函数方法的 this。
    
    

    猜想:通过包装类特点可了解 ,().toString() 是处理调用者的。根据调用者的数据类型可选择下面对应的方法。

    Object.prototype.toString.call( [ ]); // ''[object Array ]''
    bject.prototype.toString.call(123); //''[object Number]''
    bject.prototype.toString.call({ }); //"[object obje
    

    三目运算符

    三目运算符号:
    条件判断?是:否 并且会返回值
    比if else高端点 有返回值

    var Num = 1 > 0 ? ("10" > 9 ? 1 : 0) : 2; //结果是1 
    var Num2 = 1 > 0 ? ("10" > 9 ? 1 : 0) : 2; //结果是0 
    

    克隆

    浅度克隆,互相影响
     function clone(ori, target) {
    
                var tar = target|| {}; //排除没有传target —target= undefied 或者 null
           
                for (var prop in ori) {
    
    
                    tar[prop] = ori[prop];
                }
                return tar;
            }
    
    深度克隆 各自独立

    步骤:
    遍历对象,(var prop in object)
    1,判断是否是原始值 typeof() 判断是否是 object
    2,判断是数组还是对象 使用 toString() 总共有3种方法 instanceof() constructor--->不建议使用 有跨子域的问题。
    3,建立相应的数组或对象
    4,递归

     function deepClone(origin, target) {
                var target = target || {}, // 遍历对象 排除没有传target —target= undefied 或者 null
                    toStr = Object.prototype.toString,
                    arrStr = "[object Array]";
                for (var prop in origin) {
                    // 只取自身的属性和值。避免拿原型链上的属性和值
                    if (origin.hasOwnProperty(prop)) {
                        // 判断是原始值是否是引用值: 方法typeof() null
                        if (origin[prop] !== "null" &&
                            typeof(origin[prop]) == 'Object') {
                            // 判断是 对象还是数组的引用值
                            target[prop] = toStr.call(origin[prop]) == arrStr ? [] : {};
                            deepClone(origin[prop], target[prop]);
    
    
    
    
    
                        } else {
                            // 原始值时:
                            target[prop] = origin[prop];
    
                        }
    
    
    
                    }
                }
                return target;
            }
    

    相关文章

      网友评论

        本文标题:对象枚举 , 数组和对象遍历 三目运算符 对象的深度克隆 —

        本文链接:https://www.haomeiwen.com/subject/dbwyjqtx.html