原型链
原型链是指对象在访问属性或方法时的查找方式。
1.当访问一个对象的属性或方法时,会先在对象自身上查找属性或方法是否存在,如果存在就使用对象自身的属性或方法。如果不存在就去创建对象的构造函数的原型对象中查找 ,依此类推,直到找到为止。如果到顶层对象中还找不到,则返回 undefined。
2.原型链最顶层为 Object 构造函数的 prototype 原型对象,给 Object.prototype 添加属性或方法可以被除 null 和 undefined 之外的所有数据类型对象使用。
构造函数 prototype
原型链 __proto__
hasOwnProperty():看是不是对象自身底下的属性
contructor查看对象的构造函数 可以用来做判断

instanceof:对象与构造函数是否在原型链上有关系

toString()判断类型; 转换字符串 进制转换



hasOwnProperty 判断键名是否是对象自身的属性

call、apply、bind 改变this指向
call 传参的区别,传字符串
apply 传数组
bind 后面一个括号不能省略 (bind不加括号,改变指向但是现在不执行)

继承:子类继承父类所有属性和行为,父类不受影响。
目的:找到类之间的共性精简代码

继承


原型继承
简单原型继承,出现影响父类的情况


传值和传址
传址: 复杂数据类型; Array Date Math RegExp Object Function等; 传址,在内存中在同一个地址,只是名称不同,会相互影响
传值: 简单数据类型:number string boolean null undefined;

避免传址 (深拷贝)
方式一:新建一个对象,把对象放进去,跟原来的对象地址不一样,不会相互影响

function deepCopy(obj){
let newObj = Array.isArray(obj)?[]:{};
for(let key in obj){
if(obj.hasOwnProperty(key)){
if(typeof obj[key] === "object"){
newObj[key] = deepCopy(obj[key])
}else{
newObj[key] = obj[key];
}
}
}
return newObj;
}
方式二:组合继承

function Dad(){
this.name = "张三";
}
Dad.prototype.hobby = function(){
console.log("喜欢篮球");
}
function Son(){
Dad.call(this);
}
let F = function(){}
F.prototype = Dad.prototype;
Son.prototype = new F();
Son.prototype.constructor = Son;
let newSon = new Son();
newSon.hobby();

方式三:序列化和反序列化;深拷贝
不推荐,如果拷贝对象包含函数,或者undefined等值,此方法就会出现问题
let obj = [1,2,3]
let obj1 = JSON.parse(JSON.stringify(obj));
JSON.stringify:把对象或者数组 转换成 json串;
JSON.parse :把json串转换成对象;

网友评论