JavaScript灵活性

一提及JavaScript,大家都会想到其基于对象、简单、跨平台,然而其灵活性也值得大家津津乐道的!

一、数值调用方法

Number.prototype.add = function(x){
	return this + x;
};

由于 Number 的实例就是数值,在数值上调用某个方法,数值会自动转为实例对象

2[‘add‘](3);
//5 调用方法之所以写成8[‘add‘],而不是8.add,是因为数值后面的点,会被解释为小数点,而不是点运算符。

(2).add(3);
//5

等价于:

2..add(3); //5第一个点解释为小数点,第二个点解释为点运算符。

Number.prototype.sub = function(x){
	return this - x;
}

2[‘add‘](3)[‘sub‘](1);//4
级联调用

总之,现在我们可以在数值上直接调用方法了。

二、数值调用属性

Number.prototype.double = function(){ return this + this; };
Number.prototype.square = function(){ return this * this; };

(2).double().square();		//16
2['double']()['square']();	//16
2..double().square();		//16

但是,可以将上述两个方法的调用改为读取属性的方式,ES5规定,每个对象的属性都有一个取值方法get,用来自定义该属性的读取操作。

<pre name="code" class="javascript">Number.prototype = Object.defineProperty(Number.prototype,"double",{
	get:function(){
		return this + this;
	}
});

Number.prototype = Object.defineProperty(Number.prototype,"square",{
	get:function(){
		return this * this;
	}
});

(2).double.square;	//16
2['double']['square'];	//16

参考自:http://www.ruanyifeng.com/blog/2015/02/flexible-javascript.html

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-24 16:16:56

JavaScript灵活性的相关文章

JavaScript 框架设计 司徒正美 编著

第1章 种子模块 1.1 命名空间 1.2 对象扩展 1.3 数组化 1.4 类型的判定 1.5 主流框架引入的机制--domReady 1.6 无冲突处理 第2章 模块加载系统 2.1 AMD规范 2.2 加载器所在路径的探知 2.3 require方法 2.4 define方法 第3章 语言模块 3.1 字符串的扩展与修复 3.2 数组的扩展与修复 3.3 数值的扩展与修复 3.4 函数的扩展与修复 3.5 日期的扩展与修复 第4章 浏览器嗅探与特征侦测 4.1 判定浏览器 4.2 事件的支

JavaScript 定义方法的3种方法

在JavaScript的世界里,定义函数的方法多种多样,这正是JavaScript灵活性的体现,但是正是这个原因让初学者摸不着头脑,尤其对于没有 语言基础的同学.正所谓条条大道通罗马,但是如果道路太多,会让行路者不知所措,因为不知道走那条路才是正途,呵呵,废话一大篇,闲言少叙,先看代码:/*第一种方法,使用function语句,格式如下*/ function fn(){ alert("这是使用function语句进行函数定义"); } fn(); /*第二种方法,使用Function(

深入理解js构造函数

一.JavaScript对象的创建方式 在JavaScript中,创建对象的方式包括两种:对象字面量和使用new表达式. 1.1 对象字面量是一种灵活方便的书写方式,例如: var o1 = { p:"hello world", alertP:function(){ alert(this.p); } } 这样,就用对象字面量创建了一个对象o1,它具有一个成员变量p以及一个成员方法alertP. 这种写法的缺点是:每创建一个新的对象都需要写出完整的定义语句,不便于创建大量相同类型的对象,

shui-构造函数

原作者网址:https://www.2cto.com/kf/201402/281841.html 在JavaScript中,创建对象的方式包括两种: 对象字面量 使用new表达式 对象字面量是一种灵活方便的书写方式,例如: var o1 = { p:"I'm in Object literal", alertP:function(){ alert(this.p); } }这样,就用对象字面量创建了一个对象o1,它具有一个成员变量p以及一个成员方法alertP.这种写法不需要定义构造函数

理解javascript原型和作用域系列(7)——原型的灵活性

在Java和C#中,你可以简单的理解class是一个模子,对象就是被这个模子压出来的一批一批月饼(中秋节刚过完).压个啥样,就得是个啥样,不能随便动,动一动就坏了. 而在javascript中,就没有模子了,月饼被换成了面团,你可以捏成自己想要的样子. 首先,对象属性可以随时改动. 对象或者函数,刚开始new出来之后,可能啥属性都没有.但是你可以这会儿加一个,过一会儿在加两个,非常灵活. 在jQuery的源码中,对象被创建时什么属性都没有,都是代码一步一步执行时,一个一个加上的. 其次,如果继承

《JavaScript高级程序设计》第21-25章

第二十一章 Ajax 与 Comet 1.XMLHttpRequest对象 1)创建XMLHttpRequest对象 function createXHR(){ if (typeof XMLHttpRequest != "undefined"){ return new XMLHttpRequest(); } else if (typeof ActiveXObject != "undefined"){ if (typeof arguments.callee.activ

JavaScript设计模式 - 迭代器模式

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示. 迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也可以按顺序访问其中的每个元素 许多浏览器都支持 Javascript 的 Array.prototype.forEach 迭代器可以分为 内部迭代器 和 外部迭代器 一.jQuery 中的迭代器 1 $.each( [1,2,3,4], function (i, n) { 2 console.log( "当

Javascript引擎单线程机制及setTimeout执行原理说明

setTimeout用法在实际项目中还是会时常遇到.比如浏览器会聪明的等到一个函数堆栈结束后才改变DOM,如果再这个函数堆栈中把页面背景先从白色设为红色,再设回白色,那么浏览器会认为DOM没有发生任何改变而忽略这两句话,因此我们可以通过setTimeout把“设回白色”函数加入下一个堆栈,那么就可以确保背景颜色发生过改变了(虽然速度很快可能无法被察觉). 总之,setTimeout增加了Javascript函数调用的灵活性,为函数执行顺序的调度提供极大便利. 然后,我们从基础的层面来看看:理解J

JavaScript操作的DOM对象

什么叫DOM? DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C出台的推荐标准,每个浏览器都有一些细微的差别,其中以Mozilla的浏览器最与标准接近. DOM属于浏览器,而不是JavaScript语言规范里的规定的核心内容. DOM节点树 在HTML中所有的事物都有节点,DOM将HTML文档视作节点树,通过DOM,节点树中的是所有节点都可以通过JavaScript进行访问,所有的HTML元素都可以