Javascript

js基础之阮一峰的面向对象编程

本文主要是介绍js基础之阮一峰的面向对象编程,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

一  原型

1.复用:面对对象

面向对象编程是class来实现对象(类-接口)的继承,js则是通过“原型对象”.

public  class Person {
    int age;
    public Person(int a){
     age=a;
    }
    void speak(){
        System.out.println("今年我"+this.age+"岁");
    }
} 

很重要的一个方面,就是对象的继承,这对于代码的复用是非常有用的。

function Person(name){
   this.name=name;
   this.sum=function(){
       alert("this.name")
   }

}

  

2.构造函数的缺点:无法共享

JavaScript 通过构造函数生成新对象,因此构造函数可以视为对象的模板

构造函数继承的缺点:  

二个实例,拥有的方法也变成二个了,浪费系统资源。方法是共享的,应该也共享。

这个问题的解决方法,就是 JavaScript 的原型对象(prototype)。

js中继承机制的思想:是所有的方法和变量都可以共享。定义在原型上就可以共享。

js中函数的原型属性都指向一个对象。

function Dog(name, age) {
    this.name = name;
    this.age = age;
    this.log = function () {
        console.log(this.name + ":" + this.age);
    }
}

let dog1 = new Dog("小黄", 5);
let dog2=new Dog("小花",6);

 对普通的函数没有作用,对构造函数有作用。在外面用上prototype,原型属性和方法。原型对象的属性不是实例对象的属性。

二 原型链

所有对象都有自己的原型链,一个对象可充当的其他对象的原型; 原型对象也是对象,也有自己的原型。因此形成原型链“prototype Chain”

一层层追溯到最顶层就是Object.prototype,所有对象都继承了Object.prototype的属性。这就是所有对象都有valueOftoString方法的原因

Object.prototype的原型是null,没有任何属性和方法。

覆盖”:读取对象的某个属性时,JavaScript 引擎先寻找对象本身的属性,如果找不到,就到它的原型去找,如果还是找不到,就到原型的原型去找。如果直到最顶层的Object.prototype还是找不到,则返回undefined

                如果对象自身和它的原型,都定义了一个同名属性,那么优先读取对象自身的属性,这叫做“覆盖”(overriding)。

缺点:一级级查找,找不到,会遍历整个原型链,那么很影响属性。

 

三 constructor属性

prototype对象有一个constructor属性,默认执行原型对象所在的构造函数。因在原型上,那么构造可以被所有对象继承。

 

function f(){}
var f=new f();
f.prototype.constructor===f
f.hasOwnProperty(constructor)

 

f 是 构造函数f 的 实例对象, f 本身没有construct。

修改原型的属性或方法时,同时也要修改constructor,不然导致这个属性不再指向Person。由于Person的新原型是一个普通对象,而普通对象的contructor属性指向Object构造函数,导致Person.prototype.constructor变成了Object

下面代码中,要么将constructor属性重新指向原来的构造函数,要么只在原型对象上添加方法,这样可以保证instanceof运算符不会失真。

 

C.prototype = {
  constructor: C,
  method1: function (...) { ... },
  // ...
};

// 更好的写法
C.prototype.method1 = function (...) { ... };

  

四 面试题

 1.原型继承 

  B继承A,先有A与B,(就是先生成function A(){});

 缺点:新实例无法向父类构造函数传参。

B.prototype=new A();
let newB=new B();

 2.call借用构造函数构成

在子元素的里面写上

fu.call(this,name),

 3.组合继承

引用自:https://javascript.ruanyifeng.com/oop/prototype.html#toc1

 

这篇关于js基础之阮一峰的面向对象编程的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!