狗万官网酒店 > 狗万官网下载 > JS运用prototype送类添加方法操作详解_javascript艺术

JS运用prototype送类添加方法操作详解_javascript艺术

来源: 2019-08-04 19:43 我来投稿 参与评论
这篇文章主要介绍了JS运用prototype送类添加方法操作,构成实例形式分析了javascript利用prototype落实给类添加方法的相关操作技能,要求的爱人可以参考下

本文实例讲述了JS运用prototype送类添加方法操作。分享给大家供大家参考,实际如下:

1.如何定义一个简单的类?

以下是一番没有其他属性和艺术的类的概念:

function MyClass(){};

你可能会想,这不就是个简单的函数声明?正确,本条函数就是一番类的概念之落实。如何使用这个类呢?瞧下面的编码:

var cls1 = new MyClass();

这样,运用new就足以变动MyClass的一个实例了。故而在js外方得以说函数就是类,类就是函数。

2.送类增加属性和艺术

function MyClass(name,age){
  this.name = name;
  this.age = age;
}
var cls1 = new MyClass("lily",18);
alert(cls1.name);

副上面的编码可以见到,在函数内采取this就能送函数本身增加属性值。而在地方的编码中就送myClass函数增加了name和age属性。

同样,还可以行使this送这个类增加一个 toString 艺术,代码如下:

function MyClass(name,age){
  this.name = name;
  this.age = age;
  this.toString() = function(){
    alert(this.name +":"+ this.age);
  };
}
var cls1 = new MyClass("liming",10);
cls1.toString();

咱已经成功之送MyClass追加了toString艺术。此外也得以用以下代码来补充方法:

function MyClass(name,age){
  this.name = name;
  this.age = age;
}
var cls1 = new MyClass("liming",10);
cls1.toString() = function(){
            alert(this.name +":"+ this.age);
          };
cls1.toString(); // [liming:10]
var cls2 = new MyClass("zhang",10);
cls2.toString(); //报错

虽然这样也能送这个类添加一个艺术,但这种方法只是送cls1本条规矩增加了点子,并未给MyClass自己增加方法。

cls2并不存在toString艺术。

3.引出prototype

副上面我们已经清楚要送MyClss类的自己增加方法,要求讲方法定义在MyClass本条函数内部,这样的话,每声明一个新的实例,就会将MyClass自己复制一遍,这显然不是最优的解法。

既然不能将一个类(函数)所包含的主意都定义在函数的里间,这就是说,如何来送一个类添加方法呢?这就要求用到函数的prototype属性了。

每一个函数都会包含一个prototype属性,本条属性指向了一下prototype目标,咱可以指定函数对应的prototype目标。如果不指定,则函数的prototype属性将指向一个默认的prototype目标,并且次默认的prototype目标的constructor属性又会指向该函数。

顶用构造函数创建一个新的对象时,新的对象会获取构造函数的prototype属性所指向的prototype目标的任何属性和艺术,说来,组织函数对应的prototype目标所做的另外操作都会反映到其它所生成的目标上,总体的那些目标将共享与组织函数对应的prototype目标的习性和艺术。

虽然新创建的目标可以利用它的组织函数所指向的prototype目标的习性和艺术,但不能像构造函数那样直接调用prototype目标(目标没有prototype属性)。

大概,就是如果我们采用函数的prototype目标来送函数添加方法,这就是说在创立一个新的对象的时光,并不会复制这个函数的任何方法,而是指向了这函数的任何方法。

实际看下面的编码:

function MyClass(name,age){
  this.name = name;
  this.age = age;
}
MyClass.prototype.toString = function(){
  //
}
var cls1 = new MyClass("liming",10);
cls1.toString(); //
var cls2 = new MyClass("zhang",10);
cls2.toString();

如果要进入多个艺术,也得以利用下面的主意:

function MyClass(name,age){
  this.name = name;
  this.age = age;
}
MyClass.prototype = {
  toString:function(){
    //
  },
  sayHellow:function(){
    //
  }
};

这就是js外方给类添加方法的落实,其它是运用prototype来促成封装的。

感兴趣的爱人可以利用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun面试上述代码运行效果。

更多关于JavaScript相关内容感兴趣的读者群可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调整技巧总结》、《JavaScript多少结构与做法技巧总结》、《JavaScript遍历算法与艺术总结》及《JavaScript和合学运算用法总结》

瞩望本文所述对大学者JavaScript程序设计有所帮助。

义务编辑:狗万官网酒店
 
 
0% (0)
 
 
0% (0)
机长评论( ) 请自觉遵守互联网相关的富民政策法规,不准发布色情、暴力、反动的议论。
地名: 匿名?