`
nanjingjiangbiao_T
  • 浏览: 2599910 次
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

js 函数function用法

 
阅读更多

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>


参考推荐:

js中call与apply用法

JavaScript对象模型-执行模型

ECMAScript 继承机制实现


分享到:
评论

相关推荐

    js中function函数的使用方法.docx

    js中function函数的使用方法.docx

    javascript函数的解释

    javascript函数的解释,解释了具体函数的功能,一、函数JavaScript函数集合 1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document-&gt;html-&gt;(head,body) 4.一个浏览器窗口中的DOM顺序是:...

    【KETTLE教材】JS内嵌方法

    【KETTLE教材】JS内嵌方法: 详细介绍kettle中使用javascript时内嵌的function

    js入门之Function函数的使用方法【新手必看】

    在javascript里,将函数绑定给一个对象,用对象调用的函数称为方法,容易跟C#搞混。 一、函数的属性  在函数体内,可以通过arguments.length获取传入函数的实参个数。  function fun1 (x,y){  [removed]...

    js说明文档各种函数使用方法

    此文档主要讲的是js的使用,查询语句,function的各种函数参数功能

    js核心基础之构造函数constructor用法实例分析

    本文实例讲述了js核心基础之构造函数constructor用法。分享给大家供大家参考,具体如下: 在js中,可以利用构造函数来创建特定类型的对象,其中,有一些原生的构造函数,Object、Array、等等,所以,当type of ...

    javascript函数

    本章的重点是用户定义的JavaScript函数的定义和调用。另外还有一点比较重要,即JavaScript支持很多内部的函数,诸如类Array的方法eval()、parseInt()和sort()等。客户端JavaScript还定义了其他函数,如document....

    js function定义函数的几种不错方法

    js function定义函数的4种方法1.最基本的作为一个本本分分的函数声明使用。 复制代码代码如下: 代码如下: function func(){} 或 var func=function(){}; 2.作为一个类构造器使用: 复制代码代码如下: 代码如下: ...

    javascript实现根据函数名称字符串动态执行函数的方法示例

    本文实例讲述了javascript实现根据函数名称字符串动态执行函数的方法。分享给大家供大家参考,具体如下: [removed] //动态函数调用,调用者使用targetFunction function targetFunction() { alert&#40;11111&#41;;...

    JavaScript中的Function函数

    首先给大家介绍JavaScript中function定义函数的几种方法: 1.最基本的作为一个本本分分的函数声明使用。 复制代码 代码如下: function func(){} 或 复制代码 代码如下: var func=function(){}; 2.作为一个类构造...

    JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】

    典型的JavaScript函数定义: function 函数名称(参数表){ //函数执行部分 return ; } //注意:参数列表直接写形参名即可 return语句:return返回函数的返回值并结束函数运行 函数也可以看做数据来进行传递 参数...

    js中function()使用方法

    在继续讲述之前,先看一下函数的使用语法: 以下是引用片段: function func1(…){…} var func2=function(…){…}; var func3=function func4(…){…}; var func5=new Function(); 代码如下: [removed] // 1, 方法...

    详解javascript函数的参数

    javascript函数可以用任意多个参数来调用,而不用管函数定义时指定了几个参数。因为函数是弱类型的,没有方法去声明它所期望的参数类型,并且给任何函数传递任何类型的值都是合法的。 1.Js函数可以传入不同的参数,...

    你可能不知道的JavaScript的new Function()方法

    ”你可能并不知道可以传给 new Function() 一个字符串作为函数的body来构造一个 JavaScript函数。编程中并不经常用到,但有时候应该是很有用的. 下面是 new Function 的基本用法: 代码如下:// 最后一个参数是函数的 ...

    微信小程序Page中data数据操作和函数调用方法

    //index.js Page({ data: { text: This is page data., sliderOffset: 0, sliderLeft: 0, state:{ genre:[], genre_index: 0, model:[], model_index: 0, terminalStatus:'', } }, onLoad: function...

    JavaScript回调函数callback用法解析

    这篇文章主要介绍了JavaScript回调函数callback用法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 JavaScript回调函数的使用是很常见的,引用官方回调...

    浅谈javascript函数劫持[转自xfocus]第1/3页

    一、概述 javascript函数劫持,也就是老外提到的javascript hijacking技术。最早还是和剑心同学讨论问题时偶然看到的一段代码,大概这样写的: window.alert = function(s) {}; 觉得这种用法很巧妙新颖,和API Hook...

    JS立即执行的匿名函数用法分析

    本文实例讲述了JS立即执行的匿名函数用法。分享给大家供大家参考,具体如下: ;(function() {})(); 1.他叫做立即运行的匿名函数(也叫立即调用函数) 2.当一个匿名函数被括起来,然后再在后面加一个括号,这个匿名...

    JavaScript匿名函数用法分析

    本文实例讲述了JavaScript匿名函数用法。分享给大家供大家参考。具体如下: 一、定义一个函数 在JavaScript中,可以通过“函数声明”和“函数表达式”来定义一个函数,比如 1、通过“函数声明”来定义一个函数 ...

    JavaScript 函数调用规则

    JavaScript函数调用规则一 (1)全局函数调用: function makeArray( arg1, arg2 ){ return [this , arg1 , arg2 ]; } 这是一个最常用的定义函数方式。相信学习JavaScript的人对它的调用并不陌生。 调用代码如下: ...

Global site tag (gtag.js) - Google Analytics