枚举 遍历
遍历数组
// 如何取数组的值关键 :数组有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;
}