javascript面向对象和原型————呱呱2号

面向对象

一、工厂方式

function createObject(name,age){
  let obj = new Object();
  this.name = name;
  this.age = age;
  return obj;            
}
let objA = createObject('Tom',24);
let objB = createObject('Jane',23);
typeof ObjA;    //Object
typeof ObjB;    //Object
ObjA instanceof Object;
ObjA instanceof Object;
//方法缺点:不能区分对象实例,所有对象实例都由Object实例化

2、构造函数方式

function Box(name,age){
  this.name = name;
  this.age = age;     
  this.run = function (){
    return this.name + this.age;
  }  
}
function Desk(name,age){
  this.name = name;
  this.age = age;   
  this.run = function (){
    return this.name + this.age;
  }       
}
let box = new Box('Tom',24);
let desk = new Desk('Jane',23);
box instanceof Box;  //true
box instanceof Desk;  //false
desk instanceof Desk;  //true
//
//知识延伸,对象冒充
let o = new Object();
Box.call(o,'Ha',25);
o.name;

构造函数方式和原型情势变量存款和储蓄的章程

图片 1

图片 2

 3、原型

  大家创造的每1个函数都有多个prototype(原型属性),那特天性是二个指标,它的用途是带有能够由特定类型的全数实例共享的质量和措施。逻辑上得以那样通晓:prototype通过调用构造函数而创办的百般目的的原型对象。使用原型的益处可以让具备目的实例共享它所含有的品质和办法。也便是说,不必在构造函数中定义对象新闻,而是可以平昔将那些音讯添加到原型中。(笔者要好的明白,通过构造函数成立的靶子会自行成立2个原型对象prototype。)

function Box(){}

Box.prototype.name = ‘Lee’;  //原型属性

Box.prototype.age = 100;

Box.prototype.run = function () {  //原型方法

  return this.name + this.age + ‘运行中’;

}

表达:原型对象内的属性和措施都被实例对象共用

let box1 = new Box();

let box2 = new Box();

Object.is(box一.run,box二.run);  //true  Object.is(),判断七个变量是还是不是相等
(等于box1.run === box二.run);

证实box1和box第22中学的run方法都指向同四个引用地址。

图片 3

在原型方式注明中,多了多少个属性,那四个属性都以制造对象时自动生成的。__proto__属性是实例指向原型对象的贰个指针,它的效率正是指向构造函数的原型属性constructor。通过那多少个属性,就能够访问到原型里的特性和格局了。

//判断2个实例对象是还是不是针对了原型对象,只要实例化了,会自动指向的

Box.prototype.isPrototypeOf(box壹);  //true    接着上边的代码

let obj = new Object();  //

Box.prototype.isPrototypeOf(obj);

 

比方实例对象中有name属性,原型对象中也有name属性,通过 .
访问name会打印处实例对象中的name属性。

function Box () {}

Box.prototype.name = ‘guaguaerhao’;

let box1 = new Box();

box一.name = ‘呱呱二号’;

console.log(box1.name);  //呱呱二号

原型格局的实施流程:

一、先找找实例对象中是或不是存在属性,借使存在,则赶回

2、假诺实例对象中一向不应该属性,则在原型对象中找找,假如存在,则赶回

 判断实例中是或不是留存属性

box1.hasOwnProperty(‘name’);  //true

(name in
box一)  //不管是原型中有name属性依旧实例中有name属性,都会回来true

看清唯有原型中是或不是存在属性

function hasPrototypeProperty(object,property){

  return !object.hasOwnProperty(property) && (property in object);

}

肆、字面量原型情势

function Box () {}

Box.prototype = {

  constructor: Box,  //将原型对象的constructor强制指向回Box

  name: ‘guaguaerhao’,

  age: 24,

  run: function(){

    return this.name + this.age;

  }

}

 ps:原型中最大的败笔就是它的长处,共享。原型情势创造的目的,省略了构造函数字传送参,带来的缺点就是开头化的值都以1样的。

 伍、构造函数加原型形式(构造函数和方法分别,未有1种包装的痛感,感觉很零碎)

function Box(name,age){    //不共享的选取构造函数

  this.name = name;

  this.age = age;

  this.family = [‘爸爸’,’妈妈’,’哥哥’,’我’];

}

 博克斯.prototype = {    //共享的应用原型

  constructor: Box,

  run: function () {

    return this.name + this.age;

  }

}

陆、动态原型格局

 function Box(name,age){

  this.name = name;

  this.age = age;

  //然则,实例化对象的时候,每便都会成立run()方法,浪费内存,因为她在每二个对象中都以千篇壹律的效果,未有须求,每便实例化都创制,实际上只要求创立叁遍。

  Box.prototype.run = function () {

    return this.name + this.age;

  }

}

所以

function Box(name,age){

  this.name = name;

  this.name = age;

  if(typeof this.run !== ‘function’){  //只会实例化一回

    Box.prototype.run = function () {

      return this.name + this.age;

    }

  }

}

7、寄生构造函数(工厂情势+构造函数)

function Box(name,age){

  let obj = new Object();

  obj.name = name;

  obj.age = age;  

  obj.run = function (){

    return this.name + this.age;

  }

  return obj;

}

let obj = new Box(‘ha’,24);

obj.run();

7、寄生构造函数(工厂情势+构造函数)

function Box(name,age){

  let obj = new Object();

  obj.name = name;

  obj.age = age;  

  obj.run = function (){

    return this.name + this.age;

  }

  return obj;

}

let obj = Box(‘ha’,24);

obj.run();

 继承

一、继承是面向对象中相比基本的定义,ECMAScript只帮忙继承:

图片 4

function Parent(){

  this.name = ‘p’;

}

function Child(){

  this.name = ‘c’;

}

//通过原型链继承,父类实例化后的靶子实例,赋值给子类型的原型属性

//new Parent()会将构造函数里的新闻和原型的音讯都付出Child

Child.prototype = new Parent();

二、对象冒充方式

为了消除引用共享和超类型不可能传参的难题,采纳一种叫借用构造函数的技术,只怕成为目的冒充

function Parent(name,age){

  this.name = name;

  this.age = age;

}

//Parent.prototype.family = ‘家庭’;  //child实例十分小概访问

function Child(name,age){

  Parent.call(this,name,age);  //对象冒充,给父类传递参数,对象冒充只可以一连构造函数中的属性,原型中的不能够访问

}

let child = new Child(‘haha’,24);

child.name;

child.family;  //undefined

三、原型链加借用构造函数,组合方式

function Parent(age){

  this.age = age;

}

Parent.prototype.run = function () {  //化解了法子共享

  return this.age;

}

function Child(age){

  Parent.call(this,age);

}

Child.prototype = new Parent();

(四-陆未周详,日后再补,邪恶脸)

四、原型式继承:那种持续借助原型并依照已有的对象创设新对象,同事不必为此成立自定义类型。

//一时中间转播函数

function obj(o){  //o表示即将传递进入的三个对象

  function
F(){}  //F构造是2个如今新建的对象,用来储存传递过来的对象

  F.prototype = o;  //将o对象实例赋值给F构造的原型对象

  return new F();  //最终回来这几个获得传递过来的指标的目的实例

}

 

//其实F.prototype = o;就一定于 Child.prototype = new Parent();

 

//那是字面量的宣示格局,约等于var box = new Box();

var box = {

  name: ‘lee’,

  age: 100,

  family: [‘haha’,’hehe’]

}

//box1就等于new F();

var box1 = obj(box);

alert(box1.name);

box1.family.push(‘xixi’);

alert(box1.family);    //[‘haha’,’hehe’,’xixi’]

 

var box2 = obj(box);

alert(box2.family);    //[‘haha’,’hehe’,’xixi’]  //对象的引用属性,共享了

 

五、寄生式继承(原型式加工厂格局):

function obj(o){  //o代表将要传递进入的2个对象

  function
F(){}  //F构造是三个一时半刻新建的目的,用来囤积传递过来的靶子

  F.prototype = o;  //将o对象实例赋值给F构造的原型对象

  return new F();  //最后回到那一个获得传递过来的靶子的靶子实例

}

//寄生函数

function create(o){

  var f = obj(o);

  f.run = function () {

    return this.name;

  }

  return f;

}

var box = {

  name: ‘lee’,

  age: 100,

  family: [‘haha’,’hehe’]

}

var box1 = create(box);

alert(box1.name);

陆、寄生组合继承

//临时中转函数

function obj(o){  //o代表将要传递进入的3个指标

  function
F(){}  //F构造是一个一时半刻新建的对象,用来储存传递过来的对象

  F.prototype = o;  //将o对象实例赋值给F构造的原型对象

  return new F();  //最终回到这些得到传递过来的目标的目的实例

}

//寄生函数

function create(box,desk){

  var f = obj(box.prototype);

  desk.prototype = f;

  return f;

}

function Box(name,age){

  this.name = name;

  this.age = age;

}

Box.prototype.run = function(){

  return this.name + this.age + ‘运行中…’

}

function Desk(name,age){

  Box.call(this.name);

  this.age = age;

}

//通过寄生组合继承来实现延续

create(Box,Desk);  //那句话用来顶替Desk.prototype = new Box()

 

let desk = new Desk(‘lee’,100);

alert(desk.run());

(一、原型链继承,2、借用构造函数继承(对象冒充继承)叁、组合继承(结合前二种)四、原型式继承)

 

 

 

G

M

T

 

Detect language Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bengali Bosnian Bulgarian Catalan Cebuano Chichewa Chinese (Simplified) Chinese (Traditional) Croatian Czech Danish Dutch English Esperanto Estonian Filipino Finnish French Galician Georgian German Greek Gujarati Haitian Creole Hausa Hebrew Hindi Hmong Hungarian Icelandic Igbo Indonesian Irish Italian Japanese Javanese Kannada Kazakh Khmer Korean Lao Latin Latvian Lithuanian Macedonian Malagasy Malay Malayalam Maltese Maori Marathi Mongolian Myanmar (Burmese) Nepali Norwegian Persian Polish Portuguese Punjabi Romanian Russian Serbian Sesotho Sinhala Slovak Slovenian Somali Spanish Sundanese Swahili Swedish Tajik Tamil Telugu Thai Turkish Ukrainian Urdu Uzbek Vietnamese Welsh Yiddish Yoruba Zulu   Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bengali Bosnian Bulgarian Catalan Cebuano Chichewa Chinese (Simplified) Chinese (Traditional) Croatian Czech Danish Dutch English Esperanto Estonian Filipino Finnish French Galician Georgian German Greek Gujarati Haitian Creole Hausa Hebrew Hindi Hmong Hungarian Icelandic Igbo Indonesian Irish Italian Japanese Javanese Kannada Kazakh Khmer Korean Lao Latin Latvian Lithuanian Macedonian Malagasy Malay Malayalam Maltese Maori Marathi Mongolian Myanmar (Burmese) Nepali Norwegian Persian Polish Portuguese Punjabi Romanian Russian Serbian Sesotho Sinhala Slovak Slovenian Somali Spanish Sundanese Swahili Swedish Tajik Tamil Telugu Thai Turkish Ukrainian Urdu Uzbek Vietnamese Welsh Yiddish Yoruba Zulu          

 

 

 

Text-to-speech function is limited to 200 characters

 

  Options : History : Feedback : Donate Close