JavaScript中的类和原型的理解
来源:互联网 发布:网络瓶颈有哪些 编辑:程序博客网 时间:2024/06/05 15:48
在JavaScript中,类的所有实例对象都从同一个原型对象上继承属性。因此,原型对象是类的核心。
示例中定义了inherit()函数,这个函数返回一个新创建的对象,后者继承自某个原型对象。
如果定义一个原型对象,然后通过inherit()函数创建一个继承自它的对象,这样就定义了一个JavaScript类。
通常,类的实例还需要进一步的初始化,通常是通过定义一个函数来创建并初始化这个新对象。
示例给一个表示“值的范围”的类定义了原型对象,还定义了一个“工厂”函数用以创建并初始化类的实例。
// 返回一个继承自原型对象proto的属性的新对象// 这里可以用到ES5的Object.create()函数function inherit(proto) { if(proto == null) throw TypeError(); //proto是一个对象,但不能是null if(Object.create) return Object.create(proto); //如果Object.create()存在,使用它 var t = typeof proto; //否则进一步检查 if(t!=='object' && t!=='function') throw TypeError(); var f = function() {}; // 定义一个空构造函数 f.prototype = proto; // 将其原型属性设置为proto return new f(); // 使用F()创建proto的继承对象}// range.js:实现一个能表示值的范围的类// 这个工厂方法返回一个新的"范围对象"function range(from,to){ //使用inherit()函数来创建对象,这个对象继承自在下面定义的原型对象 //原型对象作为函数的一个属性存储,并定义所有"范围对象"所共享的方法 var r=inherit(range.methods); //存储新的"范围对象"的起始位置和结束位置 //这两个属性是不可继承的,每个对象都拥有唯一的属性 r.from=from; r.to=to; //返回这个新创建的对象 return r;}//原型对象定义方法,这些方法为每个范围对象所继承range.methods={ //如果x在范围内,则返回true;否则返回false //这个方法可以比较数字范围,也可以比较字符串和日期范围 includes:function(x){ return this.from<=x && x<=this.to; }, //对于范围内的每个整数都调用一次f //这个方法只可用做数字范围 foreach:function(f){ for(var x=Math.ceil(this.from);x<=this.to;x++) f(x); }, //返回表示这个范围的字符串 toString:function(){ return "("+this.from+"..."+this.to+")"; }};//这里是使用"范围对象"的一些例子var r=range(1,3); //创建一个范围对象r.includes(2); //=>true:2在这个范围内r.foreach(console.log); //=>输出1 2 3console.log(r); //输出(1...3)
以上代码定义了一个工厂函数range(),用来创建新的范围对象。
给range()函数定义了一个属性range.methods,用以快捷地存放定义类的原型对象。
range()函数给每个范围对象都定义了from和to属性,用以定义范围的起始位置和结束位置,这两个属性是非共享的,当然也是不可继承的。
最后,注意在range.methods中定义的那些可共享、可继承的方法都用到了from和to属性,而且使用了this关键字,为了指代它们,二者使用this关键字来指代调用这个方法的对象。然和类的方法都可以通过this的这种基本用法来读取对象的属性。
需要说明的是:通过"工厂函数"来定义类并不是JavaScript中定义类的常用方法,而是通常用构造函数来定义类。
0 0
- JavaScript中的类和原型的理解
- javascript中的原型理解
- 理解JavaScript中的原型
- 如何理解javascript中的prototype(原型)和原型链?
- 【web前端-理解js原型】理解Javascript中的原型对象、原型链和继承
- JavaScript原型链的理解和分析
- Javascript对象和原型继承的理解
- 深入理解JavaScript的原型和原型链
- 深入理解JavaScript系列--------强大的原型和原型链
- javascript原型的理解
- javascript 的原型理解
- JavaScript 原型的理解
- javascript原型的理解
- 简单理解JavaScript中的原型
- 深入理解JavaScript 原型和原型链
- Javascript的类和原型
- 屌丝对javascript中的prototype(原型)的理解
- javaScript prototype原型的理解
- java Callable与Future的介绍
- 习惯命令
- Facebook分享报错:应用程序配置禁止了给定网址
- 【xampp】在phpmyadmin中修改了用户的密码,登录不了数据库
- Android 属性动画(Property Animation) 完全解析 (上)
- JavaScript中的类和原型的理解
- ListView 显示(数据变化后滚动到)最底部。
- WinAPI:ChooseColor 和 CFHookProc
- LeetCode—10.Regular Expression Matching
- Eclipse自动编译NDK/JNI的三种方法
- zabbix英文模式下“ 数据包计划程序微型端口”乱码解决
- NSBundle pathForResource取不到值问题
- TIOBE 2015年10月编程语言排行榜
- CSS3 经典教程系列:CSS3 线性渐变(linear-gradient)