JavaScript web programming------functions (general functions, dynamic functions, anonymous functions)-JS Tutorial-php.cn

JavaScript web programming------functions (general functions, dynamic functions, anonymous functions)

黄舟

Release： 2016-12-30 16:45:14

Original

1679 people have browsed it

Function
1. General function
Format:
function function name (formal parameters...)
{
Execution statement;
return return value;
}
A function is a package of multiple execution statements and will only be run when called.
Note: If you call a function with parameters but do not pass a value to it, the function will still run. Or if you call a function without parameters and pass a value to it, the function will still run.
To put it simply: as long as you write the function name followed by a pair of parentheses, the function will run. What about the parameters passed?
In fact, there is a parameter array object (arguments) in the function, which encapsulates the passed parameters in an array.

Example:

function demo(){<span style="font-family: 宋体;">//定义函数。</span>
	alert(arguments.length);
}
demo(“hello”,123,true);//调用函数。

Copy after login

The result of the pop-up dialog box is 3. If you want to get all parameter values, you can traverse the array through a for loop.

for(var x=0; x<arguments.length; x++){
	alert(arguments[x]);
}

Copy after login

In order to enhance readability, it is best to pass the actual parameters according to the defined formal parameters according to the specifications.

Other ways to write the function when calling:

var show = demo();//show变量接收demo函数的返回值。
var show = demo;//这种写法是可以的，意为show和demo代表同一个函数。
		//那么该函数也可以通过show()的方式运行。

Copy after login

<script type="text/javascript">
  	function getValue(){
  	<span style="white-space:pre">	</span>alert("aa");
  		return 100;
<span style="white-space:pre">	</span>}
//var v = getValue();
//alert("v="+v);
  	var v2=getValue; //相当于getValue把引用值传给v2，因此v2也是一个“function对象”----getValue和v2都是引用变量
  	//alert("v2="+v2 );//其实是输出v2对象的toString()
  	//alert("v2="+v2() ); //调用v2这个函数对象---调用函数
</script>

Copy after login

Although the function is declared as two parameters when it is defined, any number of

<span style="font-weight: normal;"><span style="font-size:12px;">function show(x,y){
  	alert(x+","+y);
}
//show(23,22);//23,22
//show(23); //23,undefined
//show(); //undefined,undefined
//show(23,22,11);//23,22 后面的一个参数函数接收了但没有用</span></span>

Copy after login

can be passed into each function when it is called. , there is a default array arguments, which stores all the actual parameters passed in during this call

//函数的参数全部是js内部用一个arguments数组来接收与存放的---该对象是js内部隐含帮我们做的，我们可以访问到这个数组对象
function show2(x,y){
  	arguments[0]=1000;//可以把形参x的值改掉
  	document.write(x+","+y+"<br/>");
  	for(var i=0;i<arguments.length;i++){
  	<span style="white-space:pre">	</span>document.write(arguments[i]+",");
  <span style="white-space:pre">	</span>}
}
show2(11,22,33,44);
  	   
//※综上，函数的技术细节：
//1, js中的函数是没有重载，只以函数名来识别的---其实函数名就是一个function对象的引用的名字
//2, js函数中有一个内部维护的arguments数组来接收与保存形参

Copy after login

Technical details:

1. There is no overloading of functions in js, and they are only identified by function names. The function name is the reference name of the function object

2. The parameters of the function are all received and stored internally by js using an array of arguments ------ This object is implicitly created for us by js internally. , and we can access and change the value

2. Dynamic function
is implemented through the built-in object Function of Js.

Example:

<script type="text/javascript">
//把函数的形参用第1个参数传入，函数体中的代码用第2个参数传入----可以通过调用者动态传入函数体，因此非常灵活，该思想类似Java当中的类反射。
<span style="white-space:pre">	</span>var add = new Function("a,b","var s = a+b; return s; ");
//alert( add(12,11));
</script>

Copy after login

Same as:

function demo(x,y){
	alert(x+y);
}
demo(4,6);

Copy after login

The difference is that for dynamic functions, parameters and function bodies can be passed through parameters and can be specified dynamically.

3. Anonymous function

Format: function(){...}

Example:

var demo = function(){...}
demo();

Copy after login

Usually used when defining the behavior of event attributes Commonly used.

Example:

function test()
{
	alert(“load ok”);
}
window.onload = test;

Copy after login

can be written in the form of an anonymous function:

window.onload = function()
{
	alert(“load ok”);
}

Copy after login

Anonymous function is an abbreviation format.

Examples of function definition and calling:

<html>
  <head>
    <title>javascript数组与函数练习</title>
  </head>
  
  <body>
  <script type="text/javascript">
    //写一个获取数组中元素最大值的函数
    function getMax(arr){
    	var max=0;//最大值的下标
    	for(var x=1;x<arr.length;x++){
    		if(arr[x]>arr[max]){
    			max = x;
    		}
    	}
    	return arr[max];
    }
    //调用
    var arr=[23,-3,45,0,-100,47,22];
    var v = getMax(arr);
    //alert("v="+v);
    
    //数组排序
    function sortArray(arr){
    	for(var x=0;x<arr.length-1;x++){
    		for( var y=x+1;y<arr.length;y++){
    			if(arr[x]>arr[y]){
    				swap(arr,x,y);
    			}
    		}
    	}
    }
    function swap(arr,x,y){
    	var temp = arr[x];
    	arr[x] = arr[y];
    	arr[y] = temp;
    }
    
    //alert(arr);
    //document.write(arr+"<br/>");
   // sortArray(arr);
    //alert(arr);
    //document.write(arr+"<br/>");
    
    //我们的输出函数---把内容输出到页面且换行
    function println(str){
    	 document.write(str+"<br/>");
    }
    println(arr);
    sortArray(arr);
    println(arr);
    
    //到数组当中查找元素
    function searchElement(arr,key){
    	for(var x=0;x<arr.length;x++){
    		if(arr[x]==key){
    			return x;
    		}
    	}
    	return -1;
    }
    println( searchElement(arr,0) );
    println( searchElement(arr,123) );
    
  </script>
  
  <script type="text/javascript">
    //二分查找
    function binarySearch(arr,key){
    	var max,min,mid;
    	min=0;
    	max=arr.length-1;
    	while(min<=max){
    		mid = (max+min)>>1;
    		if(key>arr[mid]){//落在右边
    			min = mid+1;    			
    		}else if(key<arr[mid]){//落在左边
    			max = mid-1;
    		}else{
    			return mid;
    		}
    	}
    	return -1;
    }
    println( binarySearch(arr,0) );
    println( binarySearch(arr,123) );
    
    //数组反转
    function reverseArray(arr){
    	for(var start=0,end=arr.length-1; start<end; start++,end--){
    		swap(arr,start,end);
    	}
    }
    reverseArray(arr);
    println("反转之后:"+arr);
  </script>

  </body>
</html>

Copy after login

The above is the content of JavaScript web programming------functions (general functions, dynamic functions, anonymous functions). For more related information, please Follow the PHP Chinese website (m.sbmmt.com)!