1. 继承，原型，原型链理解以及它们之间的关系
//创建一个构造函数
function Fn() {
this.a = 1;
this.b = 2;
}
//使用该构造函数创建实例f1和f2
let f1 = new Fn();
let f2 = new Fn();
console.log(f1, f2, f1 === f2);
//new的过程中发生的事情
//1.创建一个空对象，作为构造函数创建的实例对象
//2.将这个空对象的__proto__指向构造函数的原型对象prototype
//3.将这个空对象复制给构造函数内部的关键字，this
//4.执行构造函数代码 通过this 为创建的空对象添加属性
console.log(
f1,
f2,
f1.__proto__,
f2.__proto__,
Fn.prototype,
f1.__proto__ === Fn.prototype,
f2.__proto__ === Fn.prototype,
f1.__proto__ === f2.__proto__
);
/*每个由构造函数创建出来的实例对象的原型__proto__都指向了它的构造函数的原型对像prototype,而每个
构造函数也都有自己的原型__proto__,它又指向了该构造函数的上层的原型对像prototype,这样可以一致追
溯到Object的最顶层null为止*/
/*
当我们访问构造函数所创建的某个实例的属性时，如果我们访问的这个属性是实例的自身属性时，可以访问到并且返回其属性值，
如果访问的该属性不是实例对象的自身属性，那么就会沿着该实例对象的__proto__逐级向上层的原型对象prototype中去查找，如果在这个
过程中能查找到，就能返回其属性值，如果查到最顶层，也没有查到，那么返回undefined。
我们将构造函数中这种链状形式形成的继承关系称之为原型继承，这种链状形式称之为原型链，通过一下打印(f1.1,f1.__proto__.a)我们可知，
在沿着链状关系向上寻找属性的时候，优先级是逐级降低的(比如在这里的实例f1中的a属性优先级大于通过原型链找到的存在于其构造函数的原型prototype中的a属性,也因此没有被覆盖)。
*/
Fn.prototype.a = 3;
Fn.prototype.b = 4;
Fn.prototype.c = 5;
console.log(f1.a, f1.__proto__.a, f1.c, f1.d, f1.__proto__.d);
//创建一个构造函数 Tn
let Tn = function() {
this.a = 100;
return 1000;
};
//创建一个实例t1
let t1 = new Tn();
console.log(t1);
let Tt = function() {
this.a = 200;
return {
b: 300
};
};
//创建一个实例Tt1
let Tt1 = new Tt();
console.log(Tt1);
/*
如果构造函数内部有return语句，且return的是一个对象，那么通过new命令，返回的是该return语句指定的对象,如果return语句返回的不是对象，那么该return语句会被忽略，直接返回构造函数的实例对象this
*/
2. 使用不同的方法来创建对象和生成原型链
//创建一个对象
let objOne = {
a: 1,
m: function() {
console.log(this);
return this.a + 3;
}
};
//使用Object.create创建一个新对象继承自objOne
let objTwo = Object.create(objOne);
console.log(objOne, objTwo.a, objTwo.m());
//创建objTwo自身的属性
objTwo.a = 100;
console.log(objTwo.m());
/*
使用Object.create()来来创建一个新对象使其继承于一个现存对象，现存对象为当前创建新对象提供__proto__
当在创建的该新对象调用继承的方法的时候，方法内部的this，指向当前创建的继承对象，而非继承的函数所在的原型对象
*/
//创建对象的方法
//1 使用语法结构直接创建
let A = {
value: 'a'
};
let B = [ 1, 2 ];
//2 通过构造器来创建
function MakeObj() {
this.a = 200;
}
let C = new MakeObj();
console.log(C, C.a);
//3 通过Object.create来创建
let Dobject = {
a: 15
};
let Fobject = Object.create(Dobject);
console.log(Fobject, Fobject.a);
//4 通过class创建
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
class Chinese extends Person {
constructor(name, age, sex) {
super(name, age);
this.sex = sex;
}
say() {
console.log('chinese');
}
}
const oneChinese = new Chinese('老王', 50, '男');
console.log(oneChinese);
oneChinese.say();
//查看某个对象本身的属性中是否具有某个属性，而不是从原型链中去查看是否具有某个属性可以使用hasOwnProperty
let newObj = {
height: 200,
width: 100
};
let newObj_one = Object.create(newObj);
newObj_one.length = 300;
console.log(newObj_one.hasOwnProperty('height'), newObj_one.height);
console.log(newObj_one.hasOwnProperty('length'));
let Car = function() {
this.name = 'car';
};
Car.prototype.energy = 'gas';
let myCar = new Car();
myCar.height = 200;
console.log(myCar.hasOwnProperty('name'));
console.log(myCar.hasOwnProperty('height'));
console.log(myCar.hasOwnProperty('energy'), myCar.energy);
网友评论