JavaScript函式中函式被呼叫小案例
阿新 • • 發佈：2019-01-11
一.JavaScript函式
- 函式： 函式就是一種封裝，由事件驅動的或者當它被呼叫時執行的可重複使用的程式碼塊。
- 定義函式：
function 函式名(){
函式體;
} - 數不會自動執行，需要被呼叫才可以執行
函式名(); - 函式命名規則：
與變數命名規則一致
1）以字母、 、_
3）區分大小寫
4）不能使用關鍵字和保留字
駝峰命名法：若名稱由多個單片語成，則從第二個單詞開始，首字母大寫 - 區分變數名和函式名
不成文的規定：
函式名 動詞
變數名 名詞 - 函式的定義順序與呼叫順序無關
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script type="text/javascript"> 在頁面輸出5行hello world 定義函式 function printHello(){ for(var i=0;i<5;i++){ document.write('hello world<br>'); } } printHello(); 函式呼叫 </script> </body> </html>
二.函式呼叫；
- 形參:函式定義時的引數
- 實參:函式掉用時的引數
- 函式的引數理論上可以有無限多少個，多個引數之間使用逗號隔開
- 函式引數型別不限制
案例1
/列印圖形
*
***
*****
*******
*********
...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
function show(row){
for(i=1;i<=row;i++){
for(j=1;j<=2*i-1;j++){
document.write('*');
}document.write('<br>');
}
}
show(5);
</script>
</body>
</html>
案例2
計算長方形的面積
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
function calRet(w,h){
var w;
var h;
var area=w*h;
console.log(area);
}
calRet(20,10);
</script>
</body>
</html>
案例3：多個函式引數
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
function person(name,age,gender){
var man='先生';
if (!gender) {
man='女士';
}document.write('歡迎'+name+man+'到校訪問,年齡為：'+age+'<br>');
}
person('小強',60,true);
person('小強',60,false);
</script>
</body>
</html>
案例4：時間呼叫
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var o=document.getElementById('box');
function showTime(){
//獲取年，月，日
var date = new Date;
var year=date.getFullYear();
var month=date.getMonth()+1;
var day=date.getDate();
//獲取時，分，秒
var hour=date.getHours();
var minute=date.getMinutes();
var second=date.getSeconds();
hour=add(hour);
minute=add(minute);
second=add(second);
time=year+'/'+month+'/'+day+' '+hour+':'+minute+':'+second;
o.innerHTML=time;
}
function add(num){
if (num<10) {
num='0'+num;
}
return num;
}
showTime();
setInterval(showTime,1000);
</script>
</body>
</html>