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 相关文章推荐
js 与或运算符 || &amp;&amp; 妙用
Dec 09 Javascript
DWR实现模拟Google搜索效果实现原理及代码
Jan 30 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
Oct 20 Javascript
jQuery中eq()方法用法实例
Jan 05 Javascript
JS+CSS相对定位实现的下拉菜单
Oct 06 Javascript
jQuery实现div拖拽效果实例分析
Feb 20 Javascript
在DWR中实现直接获取一个JAVA类的返回值的两种方法
Dec 25 Javascript
详解Vue2 SSR 缓存 Api 数据
Nov 20 Javascript
Vue2.x Todo之自定义指令实现自动聚焦的方法
Jan 08 Javascript
详解easyui 切换主题皮肤
Apr 04 Javascript
解决vue打包后刷新页面报错:Unexpected token
Aug 27 Javascript
用JS创建一个录屏功能
Nov 11 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
使用 MySQL Date/Time 类型
2008/03/26 PHP
PHP设计模式概论【概念、分类、原则等】
2020/05/01 PHP
js兼容标准的表格变色效果
2008/06/28 Javascript
innerText和innerHTML 一些问题分析
2009/05/18 Javascript
基于jQuery实现的Ajax 验证用户名是否存在的实现代码
2011/04/06 Javascript
JavaScript使用cookie实现记住账号密码功能
2015/04/27 Javascript
javascript实现类似java中getClass()得到对象类名的方法
2015/07/27 Javascript
浅析javascript的return语句
2015/12/15 Javascript
Jquery修改image的src属性,图片不加载问题的解决方法
2016/05/17 Javascript
js 判断附件后缀的简单实现方法
2016/10/11 Javascript
Bootstrap table简单使用总结
2017/02/15 Javascript
JavaScript与Java正则表达式写法的区别介绍
2017/08/15 Javascript
微信小程序之蓝牙的链接
2017/09/26 Javascript
vuejs简单验证码功能完整示例
2019/01/08 Javascript
vue实现绑定事件的方法实例代码详解
2019/06/20 Javascript
浅谈对于“不用setInterval,用setTimeout”的理解
2019/08/28 Javascript
NodeJS模块Buffer原理及使用方法解析
2020/11/11 NodeJs
[10:04]国际邀请赛采访专栏:DK.Farseer,mouz.Black^,采访员Josh专访
2013/08/05 DOTA
精确查找PHP WEBSHELL木马的方法(1)
2011/04/12 Python
理解Python中的类与实例
2015/04/27 Python
python dlib人脸识别代码实例
2019/04/04 Python
python GUI库图形界面开发之PyQt5窗口背景与不规则窗口实例
2020/02/25 Python
详解CSS3中Media Queries的相关使用
2015/07/17 HTML / CSS
伦敦高级内衣品牌:Agent Provocateur(大内密探)
2016/08/23 全球购物
如何实现jdbc性能优化
2012/07/30 面试题
js实现弹框效果
2021/03/24 Javascript
大学生入党自我鉴定
2013/10/31 职场文书
食堂个人先进事迹
2014/01/22 职场文书
光信息科学与技术专业职业生涯规划
2014/03/13 职场文书
公司授权委托书格式范文
2014/10/02 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
诚信承诺书
2015/01/19 职场文书
售后服务承诺函格式
2015/01/21 职场文书
团代会闭幕词
2015/01/28 职场文书
2015政治思想表现评语
2015/03/25 职场文书
Mysql基础之常见函数
2021/04/22 MySQL