ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript Web プログラミング-----関数 (一般関数、動的関数、匿名関数)

JavaScript Web プログラミング-----関数 (一般関数、動的関数、匿名関数)

黄舟
リリース: 2016-12-30 16:45:14
オリジナル
1694 人が閲覧しました

関数
1. 一般関数
形式:
関数関数名(仮パラメータ...)
{
実行ステートメント;
}
関数は、次の場合にのみ実行されます。呼び出されて実行されます。
注: パラメーターを指定して関数を呼び出しても、値を渡さなかった場合でも、関数は実行されます。また、パラメーターなしで関数を呼び出して値を渡しても、関数は実行されます。
簡単に言うと、関数名に続けて一対のかっこを記述する限り、関数は実行されます。渡されたパラメータはどうなるのでしょうか?
実際、関数にはパラメータ配列オブジェクト (引数) があり、渡されたパラメータを配列にカプセル化します。

例:

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

ポップアップ ダイアログ ボックスの結果は 3 です。すべてのパラメーター値を取得したい場合は、for ループを通じて配列を走査できます。

for(var x=0; x<arguments.length; x++){
	alert(arguments[x]);
}
ログイン後にコピー

可読性を高めるためには、仕様に従って定義された仮パラメータに従って実パラメータを渡すのが最善です。

呼び出し時に関数を記述するその他の方法:

var show = demo();//show变量接收demo函数的返回值。
var show = demo;//这种写法是可以的,意为show和demo代表同一个函数。
		//那么该函数也可以通过show()的方式运行。
ログイン後にコピー
<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>
ログイン後にコピー

関数は定義時に 2 つのパラメーターとして宣言されますが、呼び出し時に任意の数の

<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>
ログイン後にコピー

を渡すことができ、各関数にはデフォルトの配列があります。この呼び出し中に渡されるすべての実際のパラメータを格納する引数

//函数的参数全部是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数组来接收与保存形参
ログイン後にコピー

技術的な詳細:

1. js には関数のオーバーロードはありません。関数名は関数の参照名によってのみ識別されます。関数オブジェクト


2. 関数のすべてのパラメータ js の引数の配列によって内部的に受け取られ、保存されます-----このオブジェクトは js の内部で暗黙的に作成され、値にアクセスして変更できます

2. Js による動的関数
組み込みオブジェクト関数の実装。

例:

<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>
ログイン後にコピー

は次と同じです:

function demo(x,y){
	alert(x+y);
}
demo(4,6);
ログイン後にコピー

違いは、動的関数、パラメーター、および関数本体がパラメーターを介して渡され、動的に指定できることです。

3. 匿名関数

形式: function(){...}

例:

var demo = function(){...}
demo();
ログイン後にコピー

通常、イベント属性の動作を定義するときに使用されます。

例:

function test()
{
	alert(“load ok”);
}
window.onload = test;
ログイン後にコピー

は匿名関数の形式で記述できます:

window.onload = function()
{
	alert(“load ok”);
}
ログイン後にコピー

匿名関数は省略形式です。

関数の定義と呼び出し例:

<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>
ログイン後にコピー

上記は JavaScript Web プログラミングの内容です -- 関数 (一般関数、動的関数、無名関数) の詳細については、PHP 中国語を参照してください。ウェブサイト (www.php .cn)!



関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート