1、 函數(shù)聲明和函數(shù)表達式有什么區(qū)別
ECMAScript規(guī)定了三種聲明函數(shù)方式:構造函數(shù)肄程、函數(shù)聲明贯钩、和函數(shù)表達式。
函數(shù)聲明: 函數(shù)聲明通過關鍵字function來聲明, 關鍵詞后面是函數(shù)名, 名稱后面有個小括號, 括號里面放的是函數(shù)的參數(shù), 最后是一對花括號,包括函數(shù)的代碼塊
function sum(num1,num2) {
return num1+num2;
}
函數(shù)表達式
var sum = function(num1, num2) {
return num1+num2;
};
定義變量sum并將一個匿名函數(shù)賦值給變量霎箍,這時這個匿名函數(shù)又稱函數(shù)表達式(Function Expression)奇钞。function關鍵字后面沒有函數(shù)名。
區(qū)別:
- 函數(shù)聲明最后一般不寫分號, 而函數(shù)表達式有分號
- 函數(shù)聲明和變量聲明都有聲明提前的特點, 函數(shù)聲明是函數(shù)名稱和函數(shù)體均提前聲明了, 可以在聲明之前調用它;
- 函數(shù)表達式的規(guī)則與變量聲明提前一樣,只是函數(shù)聲明變量提前了, 但是它的賦值仍在原來的位置, 不能在函數(shù)表達式之前調用漂坏。
2. 什么是變量的聲明前置景埃?什么是函數(shù)的聲明前置
- 變量的聲明前置:
變量聲明前置是指把變量的聲明提前到當前作用域的最前面, 但變量的賦值仍然按照原來的順序執(zhí)行, 如果變量聲明但未被賦值, 變量自動賦值為undefined。 - 函數(shù)的聲明前置:
函數(shù)的聲明前置有兩種情況, 一個是使用函數(shù)聲明, 則整個聲明都前置, 另一個是使用函數(shù)表達式, 那么規(guī)則和變量的聲明前置一樣顶别。
例如:
console.log(a); //undefined
var a = 3;
console.log(a); //3
sayHello();
function sayHello(){
console.log('hello');
}
執(zhí)行的情況為:
var a; // 變量聲明前置
function sayHello() { // 函數(shù)聲明前置
console.log('hello');
}
console.log(a);
a = 3;
console.log(a);
sayHello();
3. arguments 是什么
- arguments是一個類數(shù)組對象, 代表傳給一個function的參數(shù)列表, 只在函數(shù)內部起作用; arguments的值與函數(shù)傳入參數(shù)有關, 與定義參數(shù)無關谷徙。
- 可以使用arguments對象在函數(shù)中引用函數(shù)的參數(shù)。此對象包含傳遞給函數(shù)的每個參數(shù)的條目驯绎,第一個條目的索引從0開始完慧。例如,如果一個函數(shù)傳遞了三個參數(shù)剩失,你可以以如下方式引用他們:
arguments[0]
arguments[1]
arguments[2]
參數(shù)也可以被設置:
arguments[1] = 'new value';
- arguments對象不是一個 Array 屈尼。它類似于Array册着,但除了長度之外沒有任何Array屬性
- 屬性
1.arguments.callee
指向當前執(zhí)行的函數(shù)。
2.arguments.caller
指向調用當前函數(shù)的函數(shù)脾歧。
3.arguments.length
指向傳遞給當前函數(shù)的參數(shù)數(shù)量甲捏。
4.arguments[@@iterator]
返回一個新的Array迭代器對象,該對象包含參數(shù)中每個索引的值。
4. 函數(shù)的"重載"怎樣實現(xiàn)
- 重載是很多面向對象語言實現(xiàn)多態(tài)的手段之一, 相同名字的函數(shù)參數(shù)個數(shù)不同, 或者順序不同, 都被認為是不同的函數(shù).
- 如果定義了兩個名字相同的函數(shù),則該名字屬于后定義的函數(shù)锰镀。
- ECMAscript函數(shù)不能像傳統(tǒng)意義上的那樣實現(xiàn)重載, ECMAscript函數(shù)沒有簽名大溜,其參數(shù)是由包含零個或多個值的數(shù)組來表示的。而沒有函數(shù)簽名估脆,真正的重載是不可能做到的钦奋。但可以在函數(shù)體針對不同的參數(shù)調用執(zhí)行相應的邏輯
function printPeopleInfo(name, age, sex){
if(name){
console.log(name);
}
if(age){
console.log(age);
}
if(sex){
console.log(sex);
}
}
printPeopleInfo('Byron', 26);
printPeopleInfo('Byron', 26, 'male');
也可以用arguments.length來實現(xiàn)重載。
5. 立即執(zhí)行函數(shù)表達式是什么疙赠?有什么作用
- 在JavaScript中, 一對圓括號()是一種運算符, 跟在函數(shù)明后, 表示調用該函數(shù); 有時我們希望在定義函數(shù)之后, 立即調用該函數(shù); 這時, 不能再函數(shù)的定義之后加圓括號, 會產生語法錯誤; 因為function這個關鍵字既可以當做語句, 也可當做表達式; 為了避免解析上的歧義, JavaScript引擎看到行首是function關鍵字之后, 認為這一段都是函數(shù)的定義 , 不應該以圓括號結尾, 所以報錯;
- 解決方法就是不要讓function出現(xiàn)在行首, 讓引擎將其理解外一個表達式, 最簡單的方式, 是將其放在圓括號內
(function(){
var a = 1;
})()
console.log(a); //undefined
其他寫法
// 在數(shù)組初始化器內只能是表達式
[function fn2() {}]();
// 逗號也只能操作表達式
1, function fn3() {}();
作用:將全局變量與局部變量分隔開锨苏,保證全局變量不受污染。
6. 求n!棺聊,用遞歸來實現(xiàn)
function factorial(num) {
if (num === 1 || num === 0) {
return 1;
}
else if (num < 0) {
return console.log("minus has no factorial");
}
return num*arguments.callee(num-1);
}
console.log(factorial(7));
7. 以下代碼輸出什么
function getInfo(name, age, sex){
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('饑人谷', 2, '男');
getInfo('小谷', 3);
getInfo('男');
輸出結果:
name:饑人谷
age:2
sex:男
["饑人谷", 2, "男"]
name:valley
name:小谷
age:3
sex:undefined
[“小谷”, “3”]
name:valley
name:男
age:undefined
sex:undefined
["男"]
name:valley
8.寫一個函數(shù),返回參數(shù)的平方和
function sumOfSquares(){
var sum = 0;
for(var i = 0; i < arguments.length; i++) {
sum = sum + arguments[i] * arguments[i];
}
return sum;
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result2) //10
9.如下代碼的輸出贞谓?為什么
console.log(a);
var a = 1;
console.log(b);
聲明前置實際為:
var a;
console.log(a); //undefined
a = 1;
console.log(b); //Uncaught ReferenceError: b is not defined
console.log(a); 這個時候a還沒有賦值; b變量沒有聲明和定義, 所以報錯限佩。
10.如下代碼的輸出?為什么
sayName('world');
sayAge(10);
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
};
聲明前置實際為:
function sayName(name){
console.log('hello', name);
}
var sayAge
sayName('world'); //hello world
sayAge(10); // Uncaught TypeError: sayAge is not a function
sayAge = function(age){
console.log(age)
};
函數(shù)聲明在作用域內會前置, 函數(shù)表達式不會前置裸弦,所以函數(shù)表達式需要放在調用的前面祟同,后一個函數(shù)調用的時候還未被定義,所以出現(xiàn)報錯理疙。
11. 如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10
bar()
function foo() {
console.log(x)
}
function bar(){
var x = 30
foo()
}
作用域鏈查找過程偽代碼:
globalContext= {
AO: {
x: 10
foo: funtion
bar: funtion
}晕城,
Scope: null
}
//聲明 foo 時 得到下面
foo.[[scope]] = globalContext.AO
//聲明 bar 時 得到下面
bar.[[scope]] = globalContext.AO
當調用 bar() 時, 進入 bar 的執(zhí)行上下文
barContext = {
AO: {
x: 30
},
Scope: bar.[[scope]] //globalContext.AO
}
當調用 foo() 時窖贤,先從 bar 執(zhí)行上下文中的 AO里找砖顷,找不到再從 bar 的 [[scope]]里找到后即調用
當調用 foo() 時,進入 foo 的執(zhí)行上下文
fooContext = {
AO: {},
Scope: foo.[[scope]] // globalContext.AO
}
所以 console.log(x)是 10
12.如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x)
}
foo();
}
作用域鏈查找過程偽代碼:
globalContext = {
AO: {
x: 10
bar: function
},
Scope: null
}
//聲明 bar 時 得到下面
bar.[[scope]] = globalContext.AO
當調用 bar() 時赃梧, 進入 bar 的執(zhí)行上下文
barContext = {
AO: {
x: 30,
foo: function
},
Scope: bar.[[scope]] //globalContext.AO
}
//在 bar 的執(zhí)行上下文里聲明 foo 時 得到下面
foo.[[scope]] = barContext.AO
當調用 foo() 時滤蝠,先從 bar 執(zhí)行上下文中的 AO里找,找到后即調用
當調用 foo() 時授嘀,進入 foo 的執(zhí)行上下文
fooContext = {
AO: {},
Scope: foo.[[scope]] // barContext.AO
}
所以 console.log(x)是 30
13.以下代碼輸出什么? 寫出作用域鏈的查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x)
})()
}
作用域鏈查找過程偽代碼:
globalContext = {
AO: {
x: 10,
bar: function
},
Scope: null
}
//聲明bar時
bar.[[scope]] = globalContext.AO
//調用bar時物咳,進入bar的執(zhí)行上下文
barContext = {
AO: {
x: 30,
function//立即執(zhí)行函數(shù)表達式
},
Scope: bar.[[scope]] // globalContext.AO
//執(zhí)行立即執(zhí)行函數(shù)
functionContext = {
AO:{ }
},
Scope: function.[[scope]] //barContext.AO
所以console.log(x)為30。
14.以下代碼輸出什么蹄皱? 寫出作用域鏈查找過程偽代碼
var a = 1;
function fn(){
console.log(a)
var a = 5
console.log(a)
a++
var a
fn3()
fn2()
console.log(a)
function fn2(){
console.log(a)
a = 20
}
}
function fn3(){
console.log(a)
a = 200
}
fn()
console.log(a)
作用域鏈查找過程偽代碼:
globalContext = {
AO: {
a: 1,
fn: function,
fn3: function
},
Scope: null
}
//聲明fn時
fn.[[scope]] = globalContext.AO
//聲明fn3時
fn3.[[scope]] = globalContext.AO
調用fn览闰,進入fn的執(zhí)行上下文
fnContext = {
AO: {
a: 5
fn2: function
},
Scope: fn.[[scope]] //globalContext.AO
}
//調用fn3芯肤,此時在fn的執(zhí)行上下文的AO中找不到fn3,于是在fn的scope里找压鉴,找到后即調用
fn3Context = {
AO: {
a: 200
},
Scope: fn3.[[scope]] //globalContext.AO
}
//調用fn2崖咨,在bar的執(zhí)行上下文AO中可以找到fn2,直接調用
fn2Context = {
AO: {
a: 20
},
Scope: fn2.[[scope]] //fnContext.AO
}
//輸出結果如下:
//調用fn
console.log(a) // a的值在fnContext.AO中晴弃,此時a變量聲明了但未定義掩幢,所以輸出undefined。
var a = 5 // a被賦值為5
console.log(a) // 輸出5
a++ // fnContext.AO中a的值變?yōu)?
//調用fn3
fn3() //此時a的值為globalContext.AO里的a上鞠,即console.log(a) 輸出1
a = 200 // globalContext.AO里的a值變?yōu)?00
//調用fn2
fn2() //此時a的值為fnContext.AO里的a际邻,即console.log(a) 輸出6
a = 20 // fnContext.AO里的a變?yōu)?0
console.log(a) //輸出20
//fn調用結束,此時 globalContext.AO里的a值為200
console.log(a) // 輸出200
// 輸出順序為:undefined, 5, 1, 6, 20, 200