您的位置:首页 > Web前端 > JavaScript

js基础知识点补充(5)

2019-08-10 11:32 141 查看
版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。 本文链接:https://blog.csdn.net/ygj0727/article/details/98961567

原型链
原型本身也是个对象,因此原型对象也有原型 对象就有__proto__
由多级父元素逐级继承形成的链式结构

原型链保存着:所有对象的成员(方法和属性)
作用域链保存:所有的变量

原型链作用:控制对象访问成员的使用顺序:优先使用自己的,自己没有,才延原型链向父级查找
作用域链作用:控制变量的使用顺序(优先使用活动对象(AO)中的局部变量,局部中没有,才去延用作用域链向父级作用域查找)

原型链最顶端:Object.prototype
作用域链的终点:window

简单概况:
所有不需要"对象."访问的变量都保存在作用域链中
所有需要用"对象."访问的变量都保存在原型链中

typeof只能识别 原始类型、funtion函数,object引用类型
var n=5,s=‘hello’,b=true,nu=null,un;
var fun = function(){
var obj1={}
var obj2=[];
console.log(
typeof n,//number
typeof s,//string
typeof b,//boolean
typeof nu,//object
typeof un,//undefiend
typeof fun,//function
typeof obj1,//object
typeof obj2,//object
)
}

// 1、验证原型对象
// 如果一个对象的原型对象是Array.prototype
// 1)Object.getPrototypeOf(obj) 获得指定obj的原型对象
// == Array.prototype
/console.log(
Object.getPrototypeOf(obj1) == Array.prototype,
Object.getPrototypeOf(obj2) == Array.prototype
)/
// 2) var bool = father.isPrototypeOf(child); 判断father是否是child的父对象
/console.log(
Array.prototype.isPrototypeOf(obj1),
Array.prototype.isPrototypeOf(obj2)
)/
// 2、验证构造函数
// 1)如果一个对象的构造函数是Array
// obj1.constructor == Array
/console.log(
obj1.constructor == Array,
obj2.constructor == Array,
)/

// 2) var bool = obj instanceof Array 判断obj是否由构造函数Array创建出来

// instance:实例  一个类型中的一个具体的对象
// 实例化 :用new创建一个对象
console.log(
obj1 instanceof Array,
obj2 instanceof Array,
)
var obj3 = {};
obj3.__proto__ = obj2;
// 3、检查内部属性class
// class是每个对象中记录对象创建时适用的类型的属性  --  DNA
// 一旦对象被创建,class属性就无法被修改!!!  无法轻易访问
// 获的class
// 唯一的方法:调用Object.protoype中的toString()
// 输出结果:[object 				Object]
// 引用类型的对象   		class属性值
console.log(obj1.toString())
console.log(obj2.toString())
console.log(obj3.toString())
// 但是几乎所有内置对象的原型对象都重写Object中String方法,所以内置对象的子对象,都无法直接调用Object的toString
// 解决:call
// 任意对象.任意方法.call(替换的对象)
console.log(Object.prototype.toString.call(obj2));
// 最严格的的鉴别数组方法
console.log(
Object.prototype.toString.call(obj1) == "[object Array]",
Object.prototype.toString.call(obj2) == "[object Array]",
Object.prototype.toString.call(obj3) == "[object Array]",
)
// 4、Array.isArray(obj)
console.log(
Array.isArray(obj1),
Array.isArray(obj2),
Array.isArray(obj3),
)

两种类型间的继承
如果发现多个类型之间拥有相同的属性结构和方法
定义父类型
父类型的构造函数,集中定义相同的属性结构
function Flyer(name,speed){
this.name = name;
this.speed = speed;
}
Flyer.prototype.fly = function(){
console.log(

${this.name}以${this.speed}的速度在飞行!
);
}
//2.让子类型原型对象继承父类型原型对象
//3.在子类构造函数中借用父类型构造函数 达到请父类型构造函数帮忙初始化属性结构
// 飞机
function Plane(name,speed,score){
// 问题:直接调用父类型构造函数,其中的this默认是window
// 解决:call 只要是this不是想要,就可以用call随便替换 父类型构造函数.call(this,参数…)
//Flyer(name,speed);//this --> window
Flyer.call(this,name,speed);
this.score=score;
}
// 让Plane的型原型对象继承Flyer的原型对象
Object.setPrototypeOf(Plane.prototype,Flyer.prototype);
/Plane.prototype.fly=function(){
console.log(
${this.name}以${this.speed}的速度在飞行!
);
}/
Plane.prototype.getScore = function(){
console.log(
击落${this.name}得分是${this.score}
);
}
// 蜜蜂
function Bee(name,speed,award){
Flyer.call(this,name,speed)
// 击落以后获得 1 Life
this.award = award;
}
// 让Bee的原型对象继承Flyer原型对象
Object.setPrototypeOf(Bee.prototype,Flyer.prototype);
/Bee.prototype.fly = function(){
console.log(
${this.name}以${this.speed}的速度在飞行!
);
}/
Bee.prototype.getAward=function(){
console.log(
击落${this.name}获得${this.award}生命
);
}

var f16 = new Plane("F16",1000,20);
f16.fly();
f16.getScore();
var bee = new Bee("小蜜蜂",50,"1 Life");
bee.fly();
bee.getAward();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: