5、JavaScript面向对象

5.1 原型对象

JavaScript、Java、C#… 面向对象JavaScript有些区别换一下思维方式

• 类模板
• 对象具体的实例

var Student = {
  name:"jiang",
  age:18,
  run:function (){
    console.log(this.name + " is running");
  }
};
var xiao = {
  name: "xiaoming"
};

//原型对象父类——xiao的原型是Student
xiao.__proto__ = Student;

/**调用
 * Student.run()
 * 结果是jiang is running
 * xiao.run()
 * 结果是xiaoming is running
 * */

5.2 class继承

1. 定义一个类属性和方法

   class Student{
     //构造器
     constructor(name) {
       this.name = name;
     }
     hello(){
       console.log('hello,JavaScript');
     }
   }
   var jiang = new Student("jiangjiang");
   
   /**调用
    * jiang.hello()
    * 结果是hello,JavaScript
    * jiang.name
    * 结果是'jiangjiang'
    */
   

2. 继承 —— 本质查看对象的原型

   class Pupil extends Student{
     constructor(name,age) {
       super(name); // 记得用super调用父类的构造方法
       this.age = age;
     }
     myAge(){
       console.log('I am a pupil.')
     }
   }
   var xiao = new Pupil("xiaoming",10);
   
   /**调用
    * xiao.myAge() 结果是I am a pupil.
    * xiao.age     结果是10
    * xiao.name    结果是'xiaoming'
    * xiao 结果是Pupil {name: 'xiaoming', age: 10}
    */
   

5.3 原型链

参考javascript——原型与原型链 - 雅昕 - 博客园 (cnblogs.com)

__ proto__原型链就是顺着__proto__所在的一条链子Js中原型链是实现继承的主要方法

• 概念当我们访问一个对象的属性时如果这个对象内部不存在这个属性那么他就会去prototype里找这个属性这个prototype又会有自己的prototype于是就这样一直找下去

• 基本思想利用原型让一个引用类型继承另一个引用类型的属性和方法

• 作用减少内存消耗提高代码的复用率

每个构造函数都有一个属性prototype指向一个原型对象每个原型对象也有一个属性constructor指向函数通过new 构造函数() 创建出来的对象内部有一个不可见的属性prototype指向构造函数的原型。