对JavaScript中原型的理解

我卟知道我是谁

我卟知道我是谁

2016-02-19 16:15

生活已是百般艰难,为何不努力一点。下面图老师就给大家分享对JavaScript中原型的理解,希望可以让热爱学习的朋友们体会到设计的小小的乐趣。

  从纯粹的面向对象思想(Java思想)向Javascript语言面向对象思想的转化沉痛而惨烈。Javascript中对象和类的概念转化悄然不动声色,让人迷糊。有时候,对Java理解得越清楚,对Javascript理解起来就越费劲。其中,对Javascript的原型对象的理解颇费功夫。

  按照定义,每个javascript对象都有一个原型对象(简称原型),这个原型是由该对象的构造函数所定义(javascript自动创建的),并且对象继承原型的所有属性和方法(函数),比如 一个String对象 的原型为 String.prototype ,如果我们想要给String类添加方法,可以这样做(比如添加常用的trim()方法):

  js 代码

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

String.prototype.trim = function (){   

  return this.replace(/(^s*)|(s*$)/g, "");   

}  

  这个特性是相当令人惊讶的,因为这破坏了封装性,就好像在Java中你可以对Object进行修改一样。而function() 可以当作数据来给左操作数赋值(而不仅仅是当作动作),也让人吃惊。

  对于Javascript内部类都可以这么改,对于自定义类当然可以这么改,如:

  js 代码

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

function Circle(x,y,r){   

  this.x = x;   

  this.y = y;   

  this.r = r;   

  //this.prototype = null ;     /*这句代码可以看作是隐含存在的,因为javascript 中“类”的定义和函数的定义结构上没有差异,所以可以说,所有函数都隐藏有这样一个属性。*/   

}  

  然后,我们给原型加一个得到面积的方法:

Circle.prototype.area = function(){   

  return this.r * this.r * 3.14159 ;   

}  

  这样使用:

  js 代码

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

var circ = new Circle(0,0,2) ;   

alert(circ.area()) ;  

  为什么要使用原型呢?因为我们可以在类中很轻松的定义我们想要实现的方法,如,还是上面那个求圆面积:

  js 代码

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

function Circle(x,y,r){   

  this.x = x;   

  this.y = y;    

  this.r = r ;   

  this.area = function (){   

    return this.r * this.r * 3.14159 ;    

  }   

}   

//调用:

var circ = new Circle(0,0,2) ;   

alert(circ.area()) ; 

  两者的调用代码完全一样,那为什么要使用原型呢?我感觉主要是为了解决对内部类型的继承问题,也就是说当你无法修改String的构造函数而想要让所有String实例都具有某一方法的时候,你可以用这个prototype。

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)
展开更多 50%)
分享

猜你喜欢

对JavaScript中原型的理解

Web开发
对JavaScript中原型的理解

JavaScript事件的理解

Web开发
JavaScript事件的理解

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

理解JavaScript中的事件

Web开发
理解JavaScript中的事件

仿豆瓣分页原型(Javascript版)

Web开发
仿豆瓣分页原型(Javascript版)

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

AJAX学习:理解JavaScript函数

Web开发
AJAX学习:理解JavaScript函数

小儿对语言的理解

育儿知识 怀孕 孕妇
小儿对语言的理解

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

JS判断汉字

JS判断汉字

如何在WPS文字中正确使用对象排列工具

如何在WPS文字中正确使用对象排列工具
下拉加载更多内容 ↓