Javascript學習筆記
- 一、函式
- 二、函式使用
- 1、宣告函式
- 2、呼叫函式
- 三、函式的封裝
- 四、使用例子
- 1、函式可以重復相同的代碼
- 2、利用函式的引數實作重復不同的代碼
- 3、函式形參實參個數匹配
- 4、小結
- 五、函式與return
- 六、小練習
- 七、arguments的使用
- 八、函式的案例
一、函式
<script>
//1.求1~100的累加和
var sum = 0;
for (var i = 0; i <= 100; i++) {
sum += i;
}
console.log(sum);
//2.求10~50的累加和
var sum = 0;
for (var i = 10; i <= 50; i++) {
sum += i;
}
console.log(sum);
//3.函式就是封裝了一段可以背重復執行呼叫的代碼塊 目的:讓大量代碼重復使用
function getSum(num1, num2) {
var sum = 0;
for (var i = num1; i <= num2; i++) {
sum += i;
}
console.log(sum);
}
getSum(1, 100);
getSum(10, 50);
</script>
二、函式使用
1、宣告函式
2、呼叫函式
<script>
//函式使用分為兩步: 宣告函式 和 呼叫函式
//1.宣告函式
// function 函式名() {
// //函式體
// }
function sayHi() {
console.log('hi~~');
}
//(1) function宣告函式的關鍵字 全部小寫
//(2) 函式是做某件事情,函式名一般是動詞 sayHi
//(3) 函式不呼叫自己不執行
//2.呼叫函式
//函式名();
sayHi();
//呼叫函式的時候不要忘記加小括號;
</script>
三、函式的封裝
●函式的封裝是把一個或者多個功能通過函式的方式封裝起來,對外只提供一個簡單的函式介面
●封裝類似于將電腦配件組裝到機箱中(類似快遞打包)
四、使用例子
<script>
//利用函式計算1-100之間的累加和
//1.宣告函式
function getSum() {
var sum = 0;
for (var i = 0; i <= 100; i++) {
sum += i;
}
console.log(sum);
}
//2.呼叫函式
getSum();
getSum();
//1.利用函式求任意兩個數的和
function getSum(num1, num2) {
console.log(num1 + num2);
}
getSum(1, 3);
getSum(3, 8);
//2.利用函式求任意兩個數之間的和
function getSums(start, end) {
var sum = 0;
for (var i = start; i <= end; i++) {
sum += i;
}
console.log(sum);
}
getSums(1, 100);
getSums(1, 10);
//3.注意點
//(1)多個引數之間用逗號隔開
//(2)形參可以看做是不用宣告的變數
</script>
1、函式可以重復相同的代碼
<script>
//1.函式可以重復相同的代碼
function cook() {
console.log('酸辣土豆絲');
}
cook();
cook();
</script>
2、利用函式的引數實作重復不同的代碼
<script>
//2.利用函式的引數實作函式重復不同的代碼
// function 函式名(形參1,形參2...) { //在宣告函式中的小括號里面是形參 (形式上的引數)
// }
//函式名(實參1,實參2...); //在函式呼叫的小括號里面是實參(實際的引數)
//3.形參和實參的執行程序
function cook(aru) { //形參是接受實參的 aru='酸辣土豆絲' 形參類似于一個變數
console.log(aru);
}
cook('酸辣土豆絲'); //傳遞給aru
cook('大肘子');
//函式的引數可以有,也可以沒有個數限制
</script>
3、函式形參實參個數匹配
<script>
//函式形參實參個數匹配
function getSum(num1, num2) {
console.log(num1 + num2);
}
//1.如果實參的個數和形參的個數一致 則正常輸出結果
getSum(1, 2);
//2.如果實參的個數多余形參的個數 會取到形參的個數
getSum(1, 2, 3);
//3.如果實參的個數小于形參的個數 多于的形參定義為undefined 最終結果就是NaN
//形參可以看做是不用宣告的變數 num2 是一個變數但是沒有接受值 結果就是undefined
getSum(1); //NaN
//盡量讓實參的個數和形參相匹配
</script>
4、小結
● 函式可以帶引數也可以不帶引數
● 宣告函式的時候,函式名括號里面的是形參,形參的默認值為undefined
● 呼叫函式的時候,函式名括號里面的是實參
● 多個引數中間用逗號分隔
● 形參的個數可以和實參個數不匹配,結果不可估計,盡量要匹配
五、函式與return
<script>
//1.函式是做某件事或者實作某種功能
function cook(aru) {
console.log(aru);
}
cook('大肘子');
//2.函式的回傳值格式
// function 函式名() {
// return 需要回傳的結果;
// }
//函式名();
//(1)函式只是實作某種功能,最終的結果需要回傳給函式的呼叫者函式名() 通過return實作
//(2)只要函式遇到return 就把后面的結果 回傳給函式的呼叫者 函式名() = return后面的結果
</script>
<script>
function getResult() {
return 666;
}
getResult(); //getResult() = 666
console.log(getResult());
// 求任意兩個數的和
function getSum(num1, num2) {
return num1 + num2;
}
console.log(getSum(1, 2));
//利用函式 求兩個數的最大值
function getMax(num1, num2) {
// if (num1 > num2) {
// return num1;
// } else {
// return num2;
// }
return num1 > num2 ? num1 : num2;
}
console.log(getMax(1, 3));
console.log(getMax(11, 3));
</script>
<script>
//利用函式 求 陣列[5,2,99,101,67,77] 中的最大數值
function getArrMax(arr) { //arr接收一個陣列
var max = arr[0];
for (var i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
}
}
return max;
}
//getArrMax([5,2,99,101,67,77]); //實參是一個陣列送過去
//實際開發中,經常用一個變數來接受函式的回傳結果,使用更簡單
var re = getArrMax([5, 2, 99, 101, 67, 77]);
console.log(re);
</script>
<script>
//函式回傳值注意事項
//1.return 終止函式
function getSum(num1, num2) {
return num1 + num2; //return后面的代碼不會被執行
alert('我是不會被執行的哦！');
}
console.log(getSum(1, 2));
//2.return只能回傳一個值
function fn(num1, num2) {
return num1, num2; //回傳的結果是最后一個值
}
console.log(fn(1, 2));
//3.求任意兩個數的加減乘除結果
function getResult(num1, num2) {
return [num1 + num2, num1 - num2, num1 * num2, num1 / num2];
}
var re = getResult(1, 2); //回傳的是一個陣列
console.log(re);
</script>
<script>
//函式如果有return 則回傳的是return后面的值,如果函式沒有return 則回傳undefined
function fun1() {
return 666;
}
console.log(fun1()); //回傳666
function fun2() {
}
console.log(fun2()); //函式回傳的結果是undefined
</script>
六、小練習
<script>
var num1 = prompt("請輸入第一個數字：");
var symbol = prompt("請輸入加減乘除任意一個運算子號：");
var num2 = prompt("請輸入第二個數字：");
function get(num1, symbol, num2) {
switch (symbol) {
case "-":
return num1 - num2;
break;
case "+":
return parseFloat(num1) + parseFloat(num2);
break;
case "/":
return num1 / num2;
break;
case "*":
return num1 * num2;
break;
};
};
var re = get(num1, symbol, num2);
alert("您的結果是：" + re);
</script>
<script>
var num1 = parseFloat(prompt("請輸入第一個數字："));
var num2 = parseFloat(prompt("請輸入第二個數字："));
function getMax(num1, num2) {
return num1 > num2 ? num1 : num2;
}
re = getMax(num1, num2)
alert('最大值為:' + re);
</script>
<script>
//法一
var num1 = parseInt(prompt('輸入第一個數字')); //parseInt（）強制轉換字串型別
var num2 = parseInt(prompt('輸入第二個數字'));
var num3 = parseInt(prompt('輸入第三個數字'));
var max = 0;
var str = [num1, num2, num3];
function getmax(num1, num2, num3) {
for (var i = 0; i < str.length; i++) {
if (max < str[i]) {
max = str[i];
}
}
return (max);
}
var re = getmax(num1, num2, num3);
alert('最大值為:'+ re);
</script>
//法二：
<script>
var num1 = parseInt(prompt('輸入第一個數字')); //parseInt（）強制轉換字串型別
var num2 = parseInt(prompt('輸入第二個數字'));
var num3 = parseInt(prompt('輸入第三個數字'));
var str = [num1, num2, num3];
var max = str[0];
function getmax(num1, num2, num3) {
for (var i = 1; i < str.length; i++) {
if (max > str[i]) {
max = str[0];
} else if (max < str[i]) {
if (str[i] > str[i + 1]) {
max = str[i];
} else {
max = str[i + 1];
}
}
}
return (max);
}
var str2 = getmax(num1, num2, num3);
alert('最大值為:' + str2);
</script>
<script>
//質數：只能被1和其本身整除的數，從2開始
//方法：用這個數字和其前面的所有數整除一次（不包括1和其本身）
var num = prompt("請輸入你想要的判斷的數字：");
console.log(num);
function isPrimeNumber(num) {
for (var i = 2; i < num; i++) {
if (num % i == 0) {
return false;
}
}
return true;
}
alert(isPrimeNumber(num) ? "該數為質數" : "該數非質數");
</script>
七、arguments的使用
當我們不確定有多少個引數傳遞的時候,可以用arguments來獲取，arguments是當前函式的一個內置物件，所有函式都內置了一個arguments物件,存盤了傳遞的所有實參，
<script>
//arguments的使用 只有函式才有arguments物件 而且是每個函式都內置好了這個arguments
function fn() {
// console.log(arguments); //里面存盤了所有傳遞過來的實參 arguments = [1,2,3]
// console.log(arguments.length);
// console.log(arguments[2]);
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
fn(1, 2, 3);
fn(1, 2, 3, 4, 5);
//偽陣列 并不是真正意義上的陣列
//1.具有陣列的length屬性
//2.按照索引的方式進行存盤的
//3.它沒有真正陣列的一些方法 pop() push()等等
</script>
八、函式的案例
<script>
//利用函式求任意個數的最大值
function getMax() { //arguments = [1,2,3]
var max = arguments[0];
for (var i = 1; i < arguments.length; i++) {
if (arguments[i] > max) {
max = arguments[i];
}
}
return max;
}
console.log(getMax(1, 2, 3));
console.log(getMax(1, 2, 3, 4, 5));
console.log(getMax(11, 2, 34, 444, 5, 100));
</script>
<script>
//利用函式翻轉任意陣列 reverse 翻轉
function reverse(arr) {
var newArr = [];
for (var i = arr.length - 1; i >= 0; i--) {
newArr[newArr.length] = arr[i];
}
return newArr;
}
var arr1 = reverse([1, 3, 4, 6, 9]);
console.log(arr1);
var arr2 = reverse(['red', 'pink', 'blue']);
console.log(arr2);
</script>
<script>
//利用函式冒泡排序 sort排序
function sort(arr) {
for (var i = 0; i < arr.length - 1; i++) {
for (var j = 0; j < arr.length - i - 1; j++) {
if (arr[j] > arr[j + 1]) {
var temp = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = temp;
}
}
}
return arr;
}
var arr1 = sort([1, 4, 2, 9]);
console.log(arr1);
var arr2 = sort([11, 7, 22, 999]);
console.log(arr2);
</script>
<script>
// 利用函式判斷閏年
function isRunYear(year) {
//如果是閏年回傳true 否則回傳false
var flag = false;
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
flag = true;
}
return flag;
}
console.log(isRunYear(2000));
console.log(isRunYear(1999));
</script>
●函式可以呼叫另外一個函式
<script>
// 函式是可以相互呼叫的
function fn1() {
console.log(11);
fn2(); //在fn1函式里面呼叫了fn2函式
}
fn1();
function fn2() {
console.log(22);
}
</script>
<script>
function fn1() {
console.log(111);
fn2();
console.log('fn1');
}
function fn2() {
console.log(222);
console.log('fn2');
}
fn1();
</script>
<script>
//用戶輸入年份,輸出當前年份2月份的天數
function backDay() {
var year = prompt('請您輸入年份:');
if (isRunYear(year)) { //呼叫函式需要加小括號
alert('當前年份是閏年2月份有29天')
} else {
alert('當前年份是平年2月份有28天')
}
}
backDay();
//判斷是否為如年的函式
function isRunYear(year) {
//如果是閏年我們回傳true 否則回傳false
var flag = false;
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
flag = true;
}
return flag;
}
</script>
<script>
//函式的2種宣告方式
//1.利用函式關鍵字自定義函式(命名函式)
function fn() {
}
fn();
//2.函式運算式(匿名函式)
//var 變數名 = function() {};
var fun = function(aru) {
console.log('我是函式運算式');
console.log(aru);
};
fun('阿遠');
//(1)fun 是變數名 不是函式名
//(2)函式運算式宣告方式跟宣告變數差不多,只不過變數里面存的是值 而函式運算式里面存的是函式
//(3) 函式運算式也可以進行傳遞引數
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/289306.html
標籤：其他
上一篇：超好的資料結構演算法可視化網站
下一篇：Javascript函式學習