js中function()使用方法


Posted in Javascript onDecember 24, 2013

javascript 函数不同于其他的语言,每个函数都是作为一个对象被维护和运行的。通过函数对象的性质,可以很方便的将一个函数赋值给一个变量或者将函数作为参数传递。在继续讲述之前,先看一下函数的使用语法:

以下是引用片段:
function func1(…){…}
var func2=function(…){…};
var func3=function func4(…){…};
var func5=new Function();

<script type="text/javascript"> // 1, 方法调用模式 
// 当一个函数被保存为对象的一个属性时,我们称之它为该对象的一个方法,那么this被绑定到该对象上 
var myObject={ 
name : "myObject" , 
value : 0 , 
increment : function(num){ 
this.value += typeof(num) === 'number' ? num : 0; 
return this; 
} , 
toString : function(){ 
return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
} 
} 
alert(myObject.increment(10).increment(20).toString()); // [Object:myObject {value:30}] 

// 2, 函数调用模式 
// 当一个函数并非一个对象的函数时,那么它被当作一个函数来调用,this被绑定到全局对象上。这是语言设计的一个错误。倘若语言设计正确,当内部函数调用时,this应该仍然绑定到外部函数的this变量上 
var myObject={ 
name : "myObject" , 
value : 0 , 
increment : function(num){ 
this.value += typeof(num) === 'number' ? num : 0; 
return this; 
} , 
toString : function(){ 
return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
}, 
getInfo: function(){ 
var self=this; 
return (function(){ 
//return this.toString(); // 内部匿名函数中this指向了全局对象window, 输出 [object Window] 
return self.toString(); // 定义一个变量selft并给它赋值为this,那么内部函数通过该变量访问到指向该对象的this 
})(); 
} 
} 
alert(myObject.increment(10).increment(20).toString()); // [Object:myObject {value:30}] 

// 3, 构造器调用模式 
// JavaScript是一门基于原型继承的语言, 这意味着对象可以直接从其他对象继承属性, 该语言是无类别的。 
// 如果一个函数前面带上new来调用,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将会被绑定到构造函数的实例上。 
function MyObject(name){ 
this.name = name || 'MyObject'; 
this.value=0; 
this.increment = function(num){ 
this.value += typeof(num) === 'number' ? num : 0; 
}; 
this.toString = function(){ 
return '[Object:' + this.name + ' {value:' + this.value + '}]'; 
} 
this.target = this; 
} 
MyObject.prototype.getInfo = function(){ 
return this.toString(); 
} 
// 同时创建一个MyObject.prototype对象,myObject继承了MyObject.prototype的所有的属性, this绑定到了MyObject的实例上 
var myObject = new MyObject(); 
myObject.increment(10); 
alert(myObject.value); //10 
var otherObject = new MyObject(); 
otherObject.increment(20); 
alert(otherObject.value); //20 
alert(myObject.target===myObject); // ture 
alert(myObject.target.getInfo()); // [Object:MyObject {value:10}] 

// 4, Apply 调用模式 
// JavaScript是一门函数式的面向对象编程语言,所以函数可以拥有方法。 函数的apply方法,如同该对象拥有此方法,此时this指向该对象。 
// apply接收两个参数,第一个是要绑定的对象(this指向的对象),第二个是参数数组. 
function MyObject(name){ 
this.name = name || 'MyObject'; 
this.value = 0; 
this.increment = function(num){ 
this.value += typeof(num) === 'number' ? num : 0; 
}; 
this.toString=function(){ 
return '[Object:'+this.name+' {value:'+this.value+'}]'; 
} 
this.target=this; 
} 
function getInfo(){ 
return this.toString(); 
} 
var myObj = new MyObject(); 
alert(getInfo.apply(myObj)); //[Object:MyObject {value:0}], this指向myObj 
alert(getInfo.apply(window)); //[object Window], this指向window 

// for and while 
function func(a,b){ 
alert(a); // 1 
alert(b); // 2 
for(var i=0;i<arguments.length;i++){ 
alert(arguments[i]); // 1, 2, 1, 2, 3 
} 
var i=0; 
while(i<arguments.length){ 
alert(arguments[i]); // 1, 2, 1, 2, 3 
i=i+1; 
} 
} 
func(1,2,3); 
var i=0 
for (i=0;i<=10;i++) { 
document.write("The number is " + i + "<br/>") 
} 
</script>
Javascript 相关文章推荐
用 JSON 处理缓存
Apr 27 Javascript
Javascript UrlDecode函数代码
Jan 09 Javascript
jQuery获取(选中)单选,复选框,下拉框中的值
Feb 21 Javascript
事件委托与阻止冒泡阻止其父元素事件触发
Sep 02 Javascript
JavaScript实现的字符串replaceAll函数代码分享
Apr 02 Javascript
JavaScript操作URL的相关内容集锦
Oct 29 Javascript
基于JavaScript实现根据手机定位获取当前具体位置(X省X市X县X街道X号)
Dec 29 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
Dec 08 Javascript
JavaScript中的toString()和toLocaleString()方法的区别
Feb 15 Javascript
php输出全部gb2312编码内的汉字方法
Mar 04 Javascript
原生JS改变透明度实现轮播效果
Mar 24 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
Nov 14 jQuery
document节点对象的获取方式示例介绍
Dec 24 #Javascript
JQuery结合CSS操作打印样式的方法
Dec 24 #Javascript
jQuery动态改变图片显示大小(修改版)的实现思路及代码
Dec 24 #Javascript
jquery自动切换tabs选项卡的具体实现
Dec 24 #Javascript
从数组中随机取x条不重复数据的JS代码
Dec 24 #Javascript
JS过滤url参数特殊字符的实现方法
Dec 24 #Javascript
JS控制图片等比例缩放的示例代码
Dec 24 #Javascript
You might like
PHP判断文件是否被引入的方法get_included_files用法示例
2016/11/29 PHP
PHP生成图片缩略图类示例
2017/01/12 PHP
php实现QQ小程序发送模板消息功能
2019/09/18 PHP
会自动逐行上升的文本框
2006/06/30 Javascript
javascript之锁定表格栏位
2007/06/29 Javascript
js获取时间(本周、本季度、本月..)
2013/11/22 Javascript
如何在JavaScript中实现私有属性的写类方式(二)
2013/12/04 Javascript
一个简单的Node.js异步操作管理器分享
2014/04/29 Javascript
QQ空间顶部折页撕开效果示例代码
2014/06/15 Javascript
nodejs分页类代码分享
2014/06/17 NodeJs
jquery实现点击页面计算点击次数
2015/01/23 Javascript
精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
2016/07/01 Javascript
详解JavaScript跨域总结与解决办法
2016/10/31 Javascript
vue axios同步请求解决方案
2017/09/29 Javascript
Vue的移动端多图上传插件vue-easy-uploader的示例代码
2017/11/27 Javascript
Nodejs + Websocket 指定发送及群聊的实现
2020/01/09 NodeJs
js实现文字头像的生成代码
2020/03/07 Javascript
vue插件--仿微信小程序showModel实现模态提示窗功能
2020/08/19 Javascript
react中hook介绍以及使用教程
2020/12/11 Javascript
python实现简单点对点(p2p)聊天
2017/09/13 Python
Python cookbook(数据结构与算法)实现优先级队列的方法示例
2018/02/18 Python
Python文件常见操作实例分析【读写、遍历】
2018/12/10 Python
Flask框架学习笔记之使用Flask实现表单开发详解
2019/08/12 Python
Pytorch之finetune使用详解
2020/01/18 Python
Python3.7将普通图片(png)转换为SVG图片格式(网站logo图标)动起来
2020/04/21 Python
Pycharm编辑器功能之代码折叠效果的实现代码
2020/10/15 Python
美国百货齐全的精品网站,提供美式风格的产品:Overstock.com
2016/07/22 全球购物
瑞典灯具和照明网上商店:Lamp24.se
2018/03/17 全球购物
大学同学十年聚会感言
2014/02/21 职场文书
建筑安全员岗位职责
2014/03/13 职场文书
团员个人总结
2015/02/26 职场文书
2015年化验员工作总结
2015/04/10 职场文书
贫困生证明范文
2015/06/16 职场文书
初中班干部工作总结
2015/08/10 职场文书
浙江省杭州市平均工资标准是多少?
2019/07/09 职场文书
五年级作文之成长
2019/09/16 职场文书