1.原型概念：
<!-- 每个函数都有一个原型属性 prototype 是一个指针指向一个对象
用途是包含可以由特点类型的所有实例共享的属性和方法 -->
<script>
function Person(name,age){
this.name = name;
this.age = age;
this.eat = function(){
document.write(`${name}${age}会吃饭`)
}
}
Person.prototype.eat = function (){
document.write('姓名：${this.name}年龄：${this.age}会吃饭')
}
let p1 = new Person('zhangsan',20)
let p2 = new Person('lisi',30)
p1.eat()
p2.eat()
</script>
2.原型方法去除空格：
<script>
/* function clearSpace(){
} */
/* 去除前面空格 */
String.prototype.clearQSpace = function (){
/* return this.replace(/^\s+/,''); 去除字符串前面空格
return this.replace(/\s+$/,''); 去除字符串后面空格
return this.replace(/^\s+|\s+$/g,''); 去除字符串中间空格 */
return this.replace(/\s/g,''); /* 去除全局所有空格 */
}
let nStr = ' abc'.clearQSpace();
console.log(nStr);
</script>
3.面向对象之继承：
<script>
function Person(name,age){
this.name = name;
this.age = age;
}
let p1 = new Person('zhangsan',30)
function Student (){
}
/* instance of 来判断这个实例()p1是不是这个构造函数(Person)实例化出来的对象 */
console.log(p1 instanceof Student);
/* 万物皆对象 */
console.log(p1 instanceof Object);
</script>
4.原型链实例化继承：
<script>
function Person(){
this.head = 1;
this.foot = 2;
}
function Student(name,no){
this.name = name;
this.no = no;
}
/* 让学生类 继承 人类的 属性 */
Student.prototype = new Person();
Student.prototype.constructor = Student;
let stu1 = new Student();
console.log(stu1);
/* console.log(stu1.head);
console.log(stu1.foot); */
</script>
原型链实例化继承练习：
<script>
/* 写一个类 Car color price 属性 */
/* 类 BMW 继承Car的所有属性 并实例化BMW这个类
写个方法可以把 color 和 price 打印到页面上 */
function Car(){
this.color = '蓝色';
this.price = '1000w';
}
function BMW(){
}
BMW.prototype = new Car();
BMW.prototype.constructor = BMW;
let BMW1 = new BMW();
console.log(BMW1.color);
console.log(BMW1.price);
</script>
5.直接继承原型链：
<script>
function Person(){
/* this.head = 1 ;
this.foot = 2 ; */
}
Person.prototype.head = 1;
Person.prototype.foot = 2;
let p1 = new Person
function Student(){
}
/* Student 想要继承Person的属性 */
/* 直接继承 prototype*/
Student.prototype = Person.prototype;
let stu1 = new Student();
/* console.log(stu1.head);
console.log(stu1.foot);
console.log('stu1',stu1); */
/* 缺点：
任何对Student.prototype的修改，都会反映到Person.prototype */
Student.prototype.name = 'zhangsan'
console.log('p1',p1);
</script>
直接继承原型链练习：
<!-- 写一个类Car color price 属性 使用直接继承prototype的方式实现
类Bmw 继承car 的所有属性 并实例化Bmw这个类
写个方法把 color 和price 打印到页面上 -->
<script>
function Car(){
}
Car.prototype.color = '白色'
Car.prototype.price = '100w'
function Bmw(){
this.print = function (){
document.write(`${this.color}--${this.price}`)
}
}
Bmw.prototype = Car.prototype
let b1 = new Bmw();
b1.print()
</script>
6.利用空对象作为中介继承以及空对象封装：
<script>
/**
* @param 子类
* @param 父类
* */
function extend(child, parent) {
function f() { }
f.prototype = parent.prototype;
child.prototype = new f();
child.prototype.constructor = child;
}
// Object.prototype.foot = 2;
/*
空对象，几乎不占内存
修改Student的prototype对象，不会影响到Person的prototype对象
*/
/* 父类 */
function Person() { }
Person.prototype.head = 1;
Person.prototype.foot = 2;
/* 子类想继承父类的属性 */
function Student() { }
/* 新建一个空对象 */
// function f(){}
// /* 把父类的原型直接赋值给空对象的原型上 */
// f.prototype = Person.prototype;
// /* 把空对象的实例化对象 给到子类的原型上 */
// Student.prototype = new f();
// /* ★constructor构造器都是指向自己的 */
// Student.prototype.constructor = Student;
extend(Student, Person)
let stu1 = new Student();
console.log(stu1.foot);
console.log(stu1);
/* 不会影响到Person的prototype对象 */
// Student.prototype.age = 30;
// let p = new Person();
// console.log(p);
/* 原型链就是一层一层向上找的过程 */
/* 原型链继承就是利用了上面这种特性 */
/* 写一个类 Car color price 属性 */
/* 类 Bmw 继承Car的所有属性 并实例化Bmw这个类
写个方法可以把 color 和 price 打印到页面上 */
function Car() {
}
Car.prototype.color = '白色'
Car.prototype.price = '100w'
// function f(){}
// f.prototype = Car.prototype;
// Bmw.prototype = new f();
// Bmw.prototype.constructor = Bmw;
extend(Bmw, Car)
function Bmw() {
this.print = function () {
document.write(`${this.color}--${this.price}`);
}
}
let b1 = new Bmw();
b1.print();
</script>
