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

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

作者: 大大大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;
        }

相关文章

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

    枚举 遍历 遍历数组 遍历对象, var prop in obj 取出对象所有属性的值(不取属性 只取值) 数组也...

  • vue.js 动态绑定 class

    数据变量 三目运算符 对象 数组 数据、对象混合

  • forEach、for-in与for-of的区别

    遍历数组推荐for of ,遍历对象推荐 for in for in可以用来便利数组和对象 for in在遍历数组...

  • JS语句2+函数1

    for in 语句——>遍历字符串,数组和对象 for in语句是一种精准的迭代语句,可以用来枚举对象的属性 ...

  • 数值类型扩展

    数组的扩展 Array, from()将类数组对象和可遍历对象转化为真正的数组。 和它类似的是扩展运算符, 一样可...

  • 扩展运算符

    对象的扩展运算符(...)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中。 由于数组是特殊的对象,所以对象的...

  • 扩展运算符(...)

    对象中的扩展运算符(...)用于去除参数对象中的所有可遍历属性,拷贝到当前对象中。 扩展运算符同样可以运用到对数组...

  • C# 枚举器和可枚举类型

    在C#中能够使用foreach语句遍历数组和List等对象的原因就在于这些对象是可枚举类型,这些可枚举类型能够获取...

  • 循环 ,去除空格,placeholder

    1.循环 for:基础循环,常用来便利连续数组和字符串; for in:可以遍历对象,数组和字符串;遍历可枚举属性...

  • 面向对象4

    一、判断数组和对象 二、浅克隆 三、深克隆 四、引用值 五、类数组

网友评论

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

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