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 相关文章推荐
jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果
Jun 27 Javascript
js判断浏览器类型的方法
Aug 07 Javascript
javascript 实现字符串反转的三种方法
Nov 23 Javascript
js点击出现悬浮窗效果不使用JQuery插件
Jan 20 Javascript
jquery实现的代替传统checkbox样式插件
Jun 19 Javascript
js操作table元素实现表格行列新增、删除技巧总结
Nov 18 Javascript
jQuery 中ajax异步调用的四种方式
Jun 28 Javascript
简单模拟node.js中require的加载机制
Oct 27 Javascript
详解Vuejs2.0 如何利用proxyTable实现跨域请求
Aug 03 Javascript
在小程序中集成redux/immutable/thunk第三方库的方法
Aug 12 Javascript
vue 自动化路由实现代码
Sep 03 Javascript
Javascript生成器(Generator)的介绍与使用
Jan 31 Javascript
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调用三种数据库的方法(3)
2006/10/09 PHP
使用PHP 5.0创建图形的巧妙方法
2010/10/12 PHP
php进行支付宝开发中return_url和notify_url的区别分析
2014/12/22 PHP
php中get_defined_constants函数用法实例分析
2015/05/12 PHP
PHP执行系统命令函数实例讲解
2021/03/03 PHP
jQuery 页面 Mask实现代码
2010/01/09 Javascript
jquery select多选框的左右移动 具体实现代码
2013/07/03 Javascript
window.showModalDialog()返回值的学习心得总结
2014/01/07 Javascript
动态创建script在IE中缓存js文件时导致编码的解决方法
2014/05/04 Javascript
首页图片漂浮效果示例代码
2014/06/05 Javascript
JS对象与json字符串格式转换实例
2014/10/28 Javascript
JavaScript结合Bootstrap仿微信后台多图文界面管理
2016/07/22 Javascript
jQuery简单实现彩色云标签效果示例
2016/08/01 Javascript
微信小程序 Buffer缓冲区的详解
2017/07/06 Javascript
VUE实现一个分页组件的示例
2017/09/13 Javascript
基于vue的短信验证码倒计时demo
2017/09/13 Javascript
原生js+cookie实现购物车功能的方法分析
2017/12/21 Javascript
Layui组件Table绑定行点击事件和获取行数据的方法
2018/08/19 Javascript
JS获取一个字符串中指定字符串第n次出现的位置
2021/02/10 Javascript
Python中标准库OS的常用方法总结大全
2017/07/19 Python
python opencv人脸检测提取及保存方法
2018/08/03 Python
python安装numpy和pandas的方法步骤
2019/05/27 Python
python操作文件的参数整理
2019/06/11 Python
python爬虫开发之selenium模块详细使用方法与实例全解
2020/03/09 Python
Nike英国官网:Nike.com (UK)
2017/02/13 全球购物
KIKO美国官网:意大利的平价彩妆品牌
2017/05/16 全球购物
6号汽车旅馆预订:Motel 6
2018/02/11 全球购物
世界经理人咨询有限公司面试
2014/09/23 面试题
Prototype如何实现页面局部定时刷新
2013/08/06 面试题
公司年会演讲稿范文
2014/01/11 职场文书
药学专业学生的自我评价分享
2014/02/06 职场文书
护士长竞聘书
2014/03/31 职场文书
党支部四风整改方案
2014/10/25 职场文书
道德模范事迹材料
2014/12/20 职场文书
详解Django中 render() 函数的使用方法
2021/04/22 Python
在Windows Server 2012上安装 .NET Framework 3.5 所遇到的问题
2022/04/29 Servers