函數(shù)與作用域

函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別

使用function關(guān)鍵字可以聲明一個(gè)函數(shù),函數(shù)聲明不必放在調(diào)用的前面
函數(shù)表達(dá)式先聲明賦值,得到這個(gè)變量,再調(diào)用,聲明必須放到調(diào)用的前面
函數(shù)表達(dá)式就是把函數(shù)這個(gè)指針賦值給這個(gè)變量,函數(shù)表達(dá)式本質(zhì)上是個(gè)表達(dá)式

//函數(shù)聲明
function SayHello() { 
   console.log(' Hello '); 
} 
//函數(shù)表達(dá)式 
var SayHello = function () { 
    console.log(' Hello '); 
 }

什么是變量的聲明前置?什么是函數(shù)的聲明前置

定義: 函數(shù)聲明和變量聲明總是被JavaScript解釋器隱式地提升(hoist)到包含他們的作用域的最頂端。

  • 變量的聲明前置
var x = 'good';
(function () {
   console.log(x);
   var x = 10; // 在這里添加一行對x的定義
})();
//輸出結(jié)果undefined

js在解析這段代碼時(shí),會對變量聲明做一個(gè)調(diào)整,變量提升的定義里說到變量的聲明會被提升到其作用域最前端。 也就是說var x = 10 被隱式的做出了調(diào)整,var x實(shí)際上被提升到了這段代碼所在作用域(也就是這個(gè)匿名函數(shù)定義的作用域)的最前面,那就相當(dāng)于這樣一段代碼

var x = 'good';
(function () {
   var x; // 變量聲明被隱式提升
   console.log(x);
   x = 10; 
})();

這就表示x 在匿名函數(shù)定義的作用域中聲明以后覆蓋了全局作用域中的 x ,而這個(gè) x 在這樣一段代碼里僅僅是聲明有這個(gè) x ,還沒賦值,就被 console.log 掉了,自然輸出結(jié)果是 undefined

  • 函數(shù)的聲明前置
func();
function func() {
    console.log('nice');
}

這段代碼中函數(shù)的調(diào)用是在函數(shù)的定義之前。如果按照javascript的規(guī)矩,其代碼是按其先后順序一行一行的執(zhí)行的話,那么在 func()做出函數(shù)調(diào)用的動作的時(shí)候,其前面是沒有任何關(guān)于func 這一函數(shù)的定義的。 這里之所以能正確調(diào)用這個(gè) func 函數(shù),也是由于在整個(gè)javascript代碼執(zhí)行前,其中的函數(shù)聲明被提升到了其作用域的最前面,這樣的話在調(diào)用func() 函數(shù)的時(shí)候自然能正確執(zhí)行而不會出錯(cuò)。

arguments 是什么

由于JavaScript允許函數(shù)有不定數(shù)目的參數(shù),所以我們需要一種機(jī)制,可以在函數(shù)體內(nèi)部讀取所有參數(shù)。這就是arguments對象的由來。
arguments對象包含了函數(shù)運(yùn)行時(shí)的所有參數(shù),arguments[0]就是第一個(gè)參數(shù),arguments[1]就是第二個(gè)參數(shù),以此類推。這個(gè)對象只有在函數(shù)體內(nèi)部,才可以使用。

var f = function(one) {
  console.log(arguments[0]);
  console.log(arguments[1]);
  console.log(arguments[2]);
}

f(1, 2, 3)
// 1
// 2
// 3

函數(shù)的"重載"怎樣實(shí)現(xiàn)

在JS中沒有重載,同名函數(shù)會被覆蓋。但可以在函數(shù)體針對不同的參數(shù)調(diào)用執(zhí)行相應(yīng)的邏輯

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');

立即執(zhí)行函數(shù)表達(dá)式是什么?有什么作用

立即執(zhí)行函數(shù)表達(dá)式
(function(){
var a = 1;
})()
console.log(a);
作用:隔離作用域

求n!,用遞歸來實(shí)現(xiàn)

function factor(n){
  if(n<0){
   return "error"
}
  else if(n === 1 || n===0) {
    return 1
  }
  return n * factor(n-1)
}
factor(n)

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, '男');
/*輸出:
name: 饑人谷
age: 2
sex: 男
(3) ["饑人谷", 2, "男", callee: function, Symbol(Symbol.iterator): function]
name valley
*/
getInfo('小谷', 3);
/*輸出:name: 小谷
 age: 3
 sex: undefined
 (2) ["小谷", 3, callee: function, Symbol(Symbol.iterator): function]
name valley
*/
getInfo('男');
/*輸出:
name: 男
age: undefined
sex: undefined
 ["男", callee: function, Symbol(Symbol.iterator): function]
name valley
*/

8.寫一個(gè)函數(shù),返回參數(shù)的平方和?

function sumOfSquares(){
var sum = 0;
    for(var i=0 ; i < arguments.length ;i++){
      sum = arguments[i]*arguments[i] + sum;
    }
    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);//輸出undefined 變量在當(dāng)前作用域下被提升了,但沒有賦值 
    var a = 1;
    console.log(b);//報(bào)錯(cuò),因?yàn)闆]有聲明變量,也沒有賦值

10.以下代碼輸出什么,為什么?

sayName('world');
    sayAge(10);
    function sayName(name){
        console.log('hello ', name);//hello  world
    }
    var sayAge = function(age){
        console.log(age);//報(bào)錯(cuò)sayAge is not a function  sayAge是函數(shù)表達(dá)式,調(diào)用在定義之前就會報(bào)錯(cuò)
    };

11. 如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼

var x = 10
bar() 
function foo() {
  console.log(x)
}
function bar(){
  var x = 30
  foo()
}//輸出 10
1.globalContext={
    AO:{
      x:10
      bar()
    },Scope:null
}
foo.[[scope]]=globalContext.AO
bar.[[scope]]=globalContext.AO
2.調(diào)用bar()進(jìn)入bar的執(zhí)行上下文
barContext={
    AO:{
         x:30
    }, Scope:bar.[[scope]]=globalcontext.AO
}
3.調(diào)用foo()
fooContext={
    AO:{}
   Scope:foo.[[scope]]=globalContext    
}

12.如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼

var x = 10;
bar() 
function bar(){
  var x = 30;
  function foo(){
    console.log(x) // 30
  }
  foo();
}   
1.globalContext={
     AO:{
        X:10
        bar:function()
    } ,Scope: null
}
bar.[[scope]]=globalContext.AO
2.調(diào)用bar()
barContext={
     AO:{
        x:30
        foo:function()
    },Scope:bar.[[scope]]=globalContext
}
foo.[[scope]]=barContext.AO
3.調(diào)用foo()
fooContext={
    AO:{}
    ,Scope:foo.[[scope]]=barContext.AO
}

13. 以下代碼輸出什么? 寫出作用域鏈的查找過程偽代碼

var x = 10;
bar() 
function bar(){
  var x = 30;
  (function (){
    console.log(x)
  })()
}
1.globalContext={
    AO:{
      x:10
      bar:function()
    },Scope:null
}
bar.[[scope]]=globalContext.AO
2.調(diào)用bar()
barContext={
    AO:{
        x:30
        function
    },Scope:bar.[[scope]]=globalContext.AO
}
function.[[scope]]=barContext.AO
3.調(diào)用立即執(zhí)行函數(shù)
functionContext={
    AO:{
    },Scope:function.[[scope]]=barContext.AO
}

14. 以下代碼輸出什么? 寫出作用域鏈查找過程偽代碼

var a = 1;

function fn(){
  console.log(a) //undefined
  var a = 5
  console.log(a)//5
  a++
  var a
  fn3()
  fn2()
  console.log(a)//20

  function fn2(){
    console.log(a)//6
    a = 20
  }
}

function fn3(){
  console.log(a)//1
  a = 200
}

fn()
console.log(a)//200
1.globalContext={
AO:{
x:1
fn:function
fn3:function
},Scope:null
}
fn.[[scope]]=globalContext.AO
fn3[[scope]]=globalContext.AO
2.調(diào)用fn()
fnContext={
AO:{
a:5
fn2:function
},Scope:fn.[[scope]]=globalContext.AO
}
fn2.[[scope]]=fnContext.AO
3.調(diào)用fn3()
fn3Context={
AO:{}
,Scope:fn3[[scope]]=globalContext.AO
}
4.調(diào)用fn2()
fn2Context={
AO:{}
,Scope:fn2.[[scope]]=fnContext.AO
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • 函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別 函數(shù)聲明語法:function functionName(arg0,arg1,ar...
    _Dot912閱讀 597評論 0 3
  • 聲明前置和作用域也是JS 部分面試常考點(diǎn) 1.函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別 函數(shù)聲明:使用function關(guān)鍵字...
    湖衣閱讀 210評論 0 0
  • 1.函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別 函數(shù)就是一段可以反復(fù)調(diào)用的代碼塊。函數(shù)還能接受輸入的參數(shù),不同的參數(shù)會返回不同...
    徐國軍_plus閱讀 498評論 0 0
  • 函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別? 函數(shù)聲明和函數(shù)表達(dá)式是EMACScript規(guī)定的兩種不同的聲明函數(shù)的方法。1.函...
    LeeoZz閱讀 354評論 0 1
  • 最近日子朋友老是問我為什么現(xiàn)在單著,為什么不找一個(gè)呢。當(dāng)時(shí)我沒有作聲,可心底卻說 可以能是沒有遇到合適的。“合適”...
    我不是菇?jīng)?/span>閱讀 244評論 0 0