转---- javascript prototype介绍的文章
JavaScript是基于对象的,任何元素都可以看成对象。然而,类型和对象是不同的。本文中,我们除了讨论类型和对象的一些特点之外,更重要的是研究如何写出好的并且利于重用的类型。毕竟,JavaScript这种流行的脚本语言如果能够进行良好的封装,并形成一个庞大的类型库,对于重用是非常有意义的。
|
例子代码
|
说明
|
|
| 1 |
Object.prototype.Property = 1;
Object.prototype.Method = function () {
alert(1);
}
var obj = new Object();
alert(obj.Property);
obj.Method();
|
可以在类型上使用proptotype来为类型添加行为。这些行为只能在类型的实例上体现。
JS中允许的类型有Array, Boolean, Date, Enumerator, Error, Function, Number, Object, RegExp, String |
| 2 |
var obj = new Object();
obj.prototype.Property = 1; //Error //Error
obj.prototype.Method = function()
{
alert(1);
}
|
在实例上不能使用prototype,否则发生编译错误
|
|
3
|
Object.Property = 1;
Object.Method = function()
{
alert(1);
}
alert(Object.Property);
Object.Method();
|
可以为类型定义“静态”的属性和方法,直接在类型上调用即可
|
|
4
|
Object.Property = 1;
Object.Method = function()
{
alert(1);
}
var obj = new Object();
alert(obj.Property); //Error
obj.Method(); //Error
|
实例不能调用类型的静态属性或方法,否则发生对象未定义的错误。
|
|
5
|
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
var obj = new Aclass();
alert(obj.Property);
obj.Method();
|
这个例子演示了通常的在JavaScript中定义一个类型的方法
|
|
6
|
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
Aclass.prototype.Property2 = 2;
Aclass.prototype.Method2 = function
{
alert(2);
}
var obj = new Aclass();
alert(obj.Property2);
obj.Method2();
|
可以在外部使用prototype为自定义的类型添加属性和方法。
|
|
7
|
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
Aclass.prototype.Property = 2;
Aclass.prototype.Method = function
{
alert(2);
}
var obj = new Aclass();
alert(obj.Property);
obj.Method();
|
在外部不能通过prototype改变自定义类型的属性或方法。
该例子可以看到:调用的属性和方法仍是最初定义的结果。
|
|
8
|
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
var obj = new Aclass();
obj.Property = 2;
obj.Method = function()
{
alert(2);
}
alert(obj.Property);
obj.Method();
|
可以在对象上改变属性。(这个是肯定的)
也可以在对象上改变方法。(和普遍的面向对象的概念不同)
|
|
9
|
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
var obj = new Aclass();
obj.Property2 = 2;
obj.Method2 = function()
{
alert(2);
}
alert(obj.Property2);
obj.Method2();
|
可以在对象上增加属性或方法
|
|
10
|
function AClass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
function AClass2()
{
this.Property2 = 2;
this.Method2 = function()
{
alert(2);
}
}
AClass2.prototype = new AClass();
var obj = new AClass2();
alert(obj.Property);
obj.Method();
alert(obj.Property2);
obj.Method2();
|
这个例子说明了一个类型如何从另一个类型继承。
|
|
11
|
function AClass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
function AClass2()
{
this.Property2 = 2;
this.Method2 = function()
{
alert(2);
}
}
AClass2.prototype = new AClass();
AClass2.prototype.Property = 3;
AClass2.prototype.Method = function()
{
alert(4);
}
var obj = new AClass2();
alert(obj.Property);
obj.Method();
|
这个例子说明了子类如何重写父类的属性或方法。
|
转---- javascript prototype介绍的文章的更多相关文章
- javascript prototype原型链的原理
javascript prototype原型链的原理 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: <script type="text/javasc ...
- JavaScript入门介绍(一)
JavaScript入门介绍 [经常使用的调试工具][w3school.com.cn在线编辑] [Chrome浏览器 开发调试工具]按F121.代码后台输出调试:console.log("t ...
- JavaScript Prototype in Plain Language
非常好的文章: http://javascriptissexy.com/javascript-prototype-in-plain-detailed-language/ jan. 25 2013 14 ...
- JavaScript prototype原型用法
JavaScript对象原型 所有JavaScript对象都从原型继承属性和方法. <!DOCTYPE html> <html> <meta charset=" ...
- JavaScript — event介绍以及兼容处理
JavaScript - event介绍以及兼容处理 1.事件流 浏览器发展到第四代时(IE4及 Netscape Communicator 4),浏览器开发团队遇到一个问题:页面的哪个部分会拥有某个 ...
- illustrating javascript prototype & prototype chain
illustrating javascript prototype & prototype chain 图解 js 原型和原型链 proto & prototype func; // ...
- [原创]javascript prototype 对象 函数 <精简的美丽......>
精简的美丽...... javascript prototype 对象 函数 在javascript中我们都知道创建一个对象使用如下代码var x = {}对象可以拥有属性和方法var x = { ...
- JavaScript入门介绍(二)
JavaScript入门介绍 [函数] 函数function 是Javascript的基础模块单元,用于代码的复用.信息影藏和组合调用. function a(){} 函数对象Function Lit ...
- javascript的介绍,实现和输出以及语法-javascript学习之旅(1)
javascript的介绍 : 1.javascript死互联网最流行的脚本语言,可用于web和html,并且可用于服务器,pc和移动端 2.javascript脚本语言: 1.是一种轻量级的脚本语言 ...
随机推荐
- Spring MVC 入门示例讲解
在本例中,我们将使用Spring MVC框架构建一个入门级web应用程序.Spring MVC 是Spring框架最重要的的模块之一.它以强大的Spring IoC容器为基础,并充分利用容器的特性来简 ...
- 关于安装qt之后的qmake命令
今天通过在archlinux中安装qt5发现了关于qmake这个命令的一些事情. 1. /bin/qmake 是 /bin/qtchooser 的符号链接,/bin/qtchooser 由一个叫 qt ...
- Ajax提交整个表单
//view页面 <script> $(function () { $("#btnAdd").click(function () { var pars = $(&quo ...
- 通过Trainingkit对Azure有一个初步的了解
学习Azure有一个非常不错的资料库Azure training kit. 这里面包含了很多Azure团队编写的实例代码,以及为初学Azure的开发人员准备的新手教学课程. 开发人员可以从http:/ ...
- Linux之grep命令详解
简介 grep (global search regular expression(RE) and print out the line,全面搜索正则表达式并把行打印出来)是一种强大的文本搜索工具,它 ...
- Bash:-变量替换后利用大括号获取数字存在的间隔
比如脚本输入位置变量:1_5 输出效果为: 1 2 3 4 5 脚本代码如下: #!/bin/bash i=1_5 for j in $(eval echo {${i/_/\..}});do echo ...
- Oracle分组排序查询
用sql查询每个分组中amount最大的前两条记录: SELECT *FROM HW trWHERE(SELECT COUNT(*) FROM HW WHERE tr.DEPID=DEPID AND ...
- Linux常见命令汇总
1.rz sz上传下载 若未安装使用:yum install lrzsz 安装 上传: rz 覆盖上传: rz -y 下载: sz bbb.jpg
- C++ Programming language读书笔记
C语言,结构化程序设计.自顶向下.逐步求精及模块化的程序设计方法;使用三种基本控制结构构造程序,任何程序都可由顺序.选择.循环三种基本控制结构构造. 模块结构:"独立功能,单出.入口&quo ...
- 制作圆角:《CSS3 Border-radius》
今天我们在一起来看看CSS3中制作圆角的属性border-radius的具体用法.如今CSS3中的border-radius出现后,让我们没有那么多的烦恼了,首先制作圆角图片的时间是省了,而且其还有多 ...