溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
一、認識函數
javaScritp中的的函數
// 函數聲明語法定義
function fun1(name, age) {
console.log(name + ',' + age);
}
fun1('Amy', 18); //Amy,18
// 函數表達式定義
var fun2 = function(name, age) {
console.log(name + ',' + age);
}
fun1('Amy', 18); //Amy,18
javaScript函數帶默認參數
/* 默認參數 */
function fun1(name, age = 17) {
console.log(name + ',' + age);
}
fun1('Amy', 18); //Amy,18
fun1('Amy', ''); // Amy,
fun1('Amy'); // Amy,17
fun1("Amy", null); // Amy,null
函數參數默認值存在暫時性死區，在函數參數默認值表達式中，還未初始化賦值的參數值無法作為其他參數的默認值。
function fun2(x, y = x) {
console.log(x, y);
}
fun2(1); // 1 1
function fun3(x = y) {
console.log(x);
}
fun3(); // ReferenceError: y is not defined
javaScript函數 不定參數
// 不定參數用來表示不確定參數個數
function fun4(...values) {
console.log(values.length);
}
fun4(1, 2); //2
fun4(1, 2, 3, 4); //4
Function的構造定義
通過Function構造函數創建函數，可向構造函數中傳入任意數量的參數，但值得注意的是傳入的最后一個參數會作為函數體，而其他參數則作為參數傳入函數中。用該方法去定義函數是不推薦使用的，因為該語法會導致解析兩次代碼，第一次解析常規ECMAScript代碼，第二次解析傳入構造函數的字符串，影響性能。
var functionName = new Function("value",...,"函數體");
var f2=new Function("n1","n2","return n1+n2;");
console.log(f2(1,2)); // 3
注：函數是引入值類型，所以函數名僅僅是指向函數的指針，當使用函數名去賦值給另一個變量名時，僅僅復制的是一個指針。即在下列a設置為null時，僅將a存的指針消除而已，不會影響b調用函數。
var a = b = function(value1){
return value1;
}
a = null;
b(1);
function中的默認對象叫arguments，類似數組，但不是數組，該對象是傳遞給函數的參數。我們可以通過這個arguments知道該函數有多少個參數
function counter(){
var sum=0;
for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
}
return sum;
}
console.log(counter(199,991,1,2,3,4,5)); // 1205
console.log(counter()); // 0
注：這里的arguments是一個隱式對象，不聲明也在函數中，內部函數可以訪問外部函數的任意內容，但是不能直接訪問外部函數的arguments與this對象。
function f1() {
console.log(arguments.length);
f2=function() {
console.log(arguments.length);
}
return f2;
}
var f=f1(1,2,3); // 3
f(); // 0
function.call -調用一個對象的一個方法，以另一個對象替換當前對象
/*構造函數*/
function Student(name,age){
this.name=name;
this.age=age;
}
show=function(add){
console.log(add+"："+this.name+"，"+this.age);
}
//通過new關鍵字調用構造函數，創建一個對象tom
var rose=new Student("rose",18);
var jack=new Student("jack",20);
//調用show方法，指定上下文，指定調用對象，this指向rose，“大家好是參數”
show.call(rose,"大家好"); // 大家好：rose，18
show.call(jack,"Hello"); // Hello：jack，20
call方法中的參數都可以省去，第1個參數表示在哪個對象上調用該方法，或this指向誰，如果不指定則會指向window對象。
var name="無名"; var age=18; // 全局變量 show.call(); // undefined：無名，18
立即執行表達式函數（IIFE）
塊級作用域與函數作用域
function calc(){
for(var i=0;i<5;i++){
console.log(i); // //0,1,2,3,4
}
console.log(i); // 5
}
calc();
函數沒有塊級作用域所以后面輸出的i是5，沒有報錯
解決方法，模擬一個塊級作用域
function calc() {
//IIFE
(function() {
for(var i = 0; i < 5; i++) {
console.log(i); //0,1,2,3,4
}
})();
console.log(i); //報錯
}
calc();
函數表達式或匿名對象立即執行
//調用匿名函數
(function() {
console.log("這是一個函數表達式");
})();
//調用匿名對象
({
name: "foo",
show: function() {
console.log(this.name);
}
}).show();
console.log({a: 1}.a);
console.log({a: function() {}}.a());
多種函數立即表達式的寫法
//最常用的兩種寫法
(function(){ /* code */ }()); // 推薦寫法
(function(){ /* code */ })(); // 當然這種也可以
// 括號和JS的一些操作符（如 = && || ,等）可以在函數表達式和函數聲明上消除歧義
// 如下代碼中，解析器已經知道一個是表達式了，于是也會把另一個默認為表達式
// 但是兩者交換則會報錯
var i = function(){ return 10; }();
true && function(){ /* code */ }();
0, function(){ /* code */ }();
// 如果你不怕代碼晦澀難讀，也可以選擇一元運算符
!function(){ /* code */ }();
~function(){ /* code */ }();
-function(){ /* code */ }();
+function(){ /* code */ }();
// 你也可以這樣
new function(){ /* code */ }
new function(){ /* code */ }() // 帶參
立即表達函數帶參數
(function (n){
console.log(n); // 100
})(100);
最好在立即表達函數前面添加分號
var k=100
(function (n){
console.log(n);
})(k);
// 出錯，解釋器會認為100是函數
var k=100
;(function (n){
console.log(n);
})(k);
IIFE的形變
(function(n){
console.log(n);
//認為這里有30000代碼
}(100));
如果中間有很長的代碼，參數100只有到文檔的末尾才可以看得到，變形后的結果：
(function(exp){
exp(100);
}(function(n){
console.log(n);
//認為這里有30000代碼
}));
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
