函數聲明和函數表達式有什么區別
- 函數聲明: 函數聲明通過關鍵字function來聲明, 關鍵詞后面是函數名, 名稱后面有個小括號, 括號里面放的是函數的參數, 最后是一對花括號,包括函數的代碼塊
- 函數表達式
- 區別:
- 函數聲明是以function關鍵詞開始, 如果不是,那么就是函數表達式
- 函數聲明最后一般不寫分號, 而函數表達式有分號
- 函數聲明和變量聲明都有聲明提前的特點, 函數聲明是函數名稱和函數體均提前聲明了, 可以在聲明之前調用它;
- 函數表達式的規則與變量聲明提前一樣,只是函數聲明變量提前了, 但是它的賦值仍在原來的位置, 不能在函數表達式之前調用
什么是變量的聲明前置？什么是函數的聲明前置
- 變量聲明前置是指把變量的聲明提前到當前作用域的最前面, 但變量的賦值仍然按照原來的順序執行, 如果變量聲明但未被賦值, 變量自動賦值為undefined
- 函數的聲明前置有兩種情況, 一個是使用函數聲明, 則整個聲明都前置, 而且會被前置到變量聲明的后面; 另一個是使用函數表達式, 那么規則和變量的聲明前置一樣
var a = 1;
function main() {
console.log(a);
var a = 2;
}
main()//輸出undefined
解析如下：
var a = 1;
function main() {
var a; //這時的a是undefined
console.log(a);
a = 2;
}
arguments 是什么
- arguments是一個類數組對象, 代表傳給一個function的參數列表, 只在函數內部起作用; arguments的值與函數傳入參數有關, 與定義參數無關
- 在函數內部可以使用arguments對象獲取到該函數的所有傳入參數, 這個對象為傳遞給函數的每個參數建立一個條目, 條目的索引號 從0 開始
- 使用arguments能夠給實參重新復制
- 可以用arguments能夠檢測函數的參數個數 arguments.length
- 類似數組但不是數組的對象, 其具備數組相同的訪問性質及方式, 能夠由arguments[n]來訪問對應參數的值
函數的"重載"怎樣實現
- 重載是很多面向對象語言實現多態的手段之一, 相同名字的函數參數個數不同, 或者順序不同, 都被認為是不同的函數
- 在JavaScript中沒有函數重載的概念, 函數通過名字確定唯一性, 參數不同也被認為是相同的函數, 后面的覆蓋前面的
- JavaScript可以通過自身屬性模擬函數重載, 可以用arguments來實現函數的重載
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');
立即執行函數表達式是什么？有什么作用
- 在JavaScript中, 一對圓括號()是一種運算符, 跟在函數明后, 表示調用該函數; 有時我們希望在定義函數之后, 立即調用該函數; 這時, 不能再函數的定義之后加圓括號, 會產生語法錯誤; 因為function這個關鍵字既可以當做語句, 也可當做表達式; 為了避免解析上的歧義, JavaScript引擎看到行首是function關鍵字之后, 認為這一段都是函數的定義 , 不應該以圓括號結尾, 所以報錯;
- 解決方法就是不要讓function出現在行首, 讓引擎將其理解外一個表達式, 最簡單的方式, 是將其放在圓括號內
//正確的寫法：
( function(){ /* code */ }() );
// 或者
( function(){ /* code */ } )();
- 上述寫法都是以圓括號開頭, 引擎就會認為后面跟的是表達式, 而不是函數定義語句, 避免了錯誤; 這就是 立即執行函數表達式
- 上面寫法最后的分號都是必須的; 如果省略分號, 遇到連續的兩個立即執行表達式, 可能會報錯
- 立即執行函數表達式一般不需要給函數命名, 如果要命名, 一般是用于遞歸函數
- 中括號, 逗號, 取反運算符也能達到類似效果
[function fn(){var a=3}]()
,function fn(){var a=3}()
!function fn(){var a=3}()
- 作用: 將全局變量與局部變量分隔開, 保證全局變量不受污染
求n!，用遞歸來實現
function recursion(n) {
if (n === 1 || n === 0) {
return 1;
}
else if (n<0) {
return console.log("minus has no recursion");
}
return n*recursion(n-1);
}
console.log(recursion(8));
以下代碼輸出什么？
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, '男');
/*name: "饑人谷"
age: 2
sex: "男"
Arguments["饑人谷", 2, "男"]
name: ”valley“
*/
getInfo('小谷', 3);
/*name: "小谷"
age: 3
sex: undefined
Arguments["小骨", 3]
name: ”valley“
*/
getInfo('男');
/*name: "男"
age: undefined
sex: undefined
Arguments["男"]
name: ”valley“
*/
寫一個函數，返回參數的平方和？
function sumOfSquares(){
var result= 0;
for (var i=0; i<arguments.length; i++) {
result+= arguments[i]* arguments[i];
}
return result;
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result2) //10
如下代碼的輸出？為什么
console.log(a); //undefined, 變量聲明會前置，并賦值undefined
var a = 1;
console.log(b); //報錯, b未聲明
如下代碼的輸出？為什么
sayName('world');
sayAge(10);
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
}; //輸出hello world，同時報錯sayAge is not a function。因為這是一個函數表達式，聲明必須放到調用的前面，而這里聲明放在了后面。
如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10
bar()
function foo() {
console.log(x)
}
function bar(){
var x = 30
foo()
} //輸出 10
/*
globalContent= {
A0 {
x: 10
foo: function
bar: function
}
scope: null
}
foo[[scope]] = globalContent.A0
bar[[scope]] = globalContent.A0
barContent= {
A0 {
x: 30
}
scope: globalContent.A0
}
fooContent= {
A0 {}
scope: globalContent.A0
}
*/
如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x)
}
foo();
} // 輸出30
/*
globalContent= {
A0 {
x: 10
}
scope: null
}
bar[[scope]] = globalContent.A0
barContent= {
A0 {
x: 30
foo: function
}
scope: globalContent.A0
}
fooContent[[scope]] = barContent.A0
fooContent = {
A0 {}
scope :barContent.A0
}
*/
以下代碼輸出什么? 寫出作用域鏈的查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x)
})()
} //輸出30
/*
globalContent = {
A0 {
x: 10
bar: function
}
scope: null
}
bar[[scope]] = globalContent.A0
barContent = {
A0 {
x: 30
function()
}
scope: globalContent.A0
}
function()[[scope]] = barContext.AO
functionContent = {
A0 {}
scope: barContext.AO
}
*/
以下代碼輸出什么？ 寫出作用域鏈查找過程偽代碼
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) // 輸出: undefined 5 1 6 20 200
/*
1. globalContext = {
A0 {
a: 1
fn: function
fn3: function
}
scope: null
}
fn[[scope]] = globalContext.A0
fn3[[scope]] = globalContext.A0
2. fnContent = {
A0 {
a: undefined, 5, 6
fn2: function
}
scope: globalContext.A0
}
fn2[[scope]] = fnContext.A0
3. fn2Content = {
A0 {}
scope: fnContext.A0
}
4. fn3Content = {
A0 {}
scope: globalContext.A0
}
*/
