函數(shù)_作用域

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

    <script type="text/javascript">
        // 函數(shù)聲明
        // function fn() {}
        // fn();
        //1 函數(shù)聲明必須有函數(shù)名
        //2 函數(shù)可以在任意地方調(diào)用fn();

        // 函數(shù)表達式
        // 1 前后兩個函數(shù)的名字可以相同也可以不相同
        // 2 function 后面的這個名字是可以省略的 
        // 3 函數(shù)調(diào)用只有在函數(shù)表達式聲明后調(diào)用。
        // var fn = function fn () {};
    </script>

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

變量的聲明前置： 在同一作用域下，先把所有的變量放在開頭聲明。

函數(shù)的聲明前置： 與變量聲明前置同義，只不過是在函數(shù)作用域下，在開頭先把變量聲明。

舉例

var a = 1;                  /*步驟    函數(shù)聲明前置：    1. fn：function    
function  fn(){                       變量聲明前置：    2. var a 
   var b = 2;                                          3. 賦值： a = 1
  console.log(a);                                      4. 運行fn()
}                                                      5.函數(shù)內(nèi)：  5.1   聲明變量  var  b
fn()                                                               5.2 賦值： b = 2
                                                                   5.3  運行console.log（a）

3. arguments 是什么

arguments對象是所有（非箭頭）函數(shù)中都可用的局部變量。你可以使用arguments對象在函數(shù)中引用函數(shù)的參數(shù)。

  function printPersonInfo(name, age, sex){
    console.log(name);
    console.log(age);
    console.log(sex);
    console.log(arguments);        //一次獲取全部參數(shù)
  }

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

函數(shù)的"重載"： 重載函數(shù)是函數(shù)的一種特殊情況，為方便使用，C++允許在同一范圍中聲明幾個功能類似的同名函數(shù)，但是這些同名函數(shù)的形式參數(shù)（指參數(shù)的個數(shù)、類型或者順序）必須不同，也就是說用同一個運算符完成不同的運算功能。

int sum(int num1, int num2){                 //定義整數(shù)類型
  return num1 + num2;
}

float sum(float num1, float num2){           //定義浮點類型
  return num1 + num2;
}

sum(1, 2);
sum(1.5, 2.4);

在 JavaScript中，不存在函數(shù)“重載”。 同名函數(shù)會覆蓋。 但可以在函數(shù)體針對不同的參數(shù)調(diào)用執(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');

5. 立即執(zhí)行函數(shù)表達式是什么？有什么作用

立即執(zhí)行函數(shù) 就是

  1. 聲明一個匿名函數(shù)
  2. 馬上調(diào)用這個匿名函數(shù).
(function fn(){
  var a = 1;                               經(jīng)典類型
  console.log(a);
})()

(function(){alert('我是匿名函數(shù)')} ()) // 用括號把整個表達式包起來
!function(){alert('我是匿名函數(shù)')}() // 求反，我們不在意值是多少，只想通過語法檢查。
+function(){alert('我是匿名函數(shù)')}()
-function(){alert('我是匿名函數(shù)')}()
~function(){alert('我是匿名函數(shù)')}()
void function(){alert('我是匿名函數(shù)')}()
new function(){alert('我是匿名函數(shù)')}()

作用：創(chuàng)建一個獨立的作用域。這個作用域里面的變量，外面訪問不到（即避免「變量污染」）。

注意： 此獨立作用域可以訪問外面的變量，但是外面無法訪問里面的變量。

image.png

參考資料

6. 求n!，用遞歸來實現(xiàn)

遞歸

  1. 自己調(diào)用自己
  2. 設定終止條件
  3. 優(yōu)點: 算法簡單
  4. 缺點: 效率低

demo

function fn(n){
    if (n=1) {
        return 1
    }
    return n * fn(n-1)
}

fn(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('YQY', 2, '女'); 
/*
name：YQY；
age：2；
sex：女；
["YQY", 2, "女", callee: ?, Symbol(Symbol.iterator): ?];
name：valley;
*/

getInfo('小谷', 3);
/*
name：小谷；
age：3；
sex: undefined;
["小谷", 3, callee: ?, Symbol(Symbol.iterator): ?]
name：valley ;
*/   


getInfo('女');
/*
name：女；
age：undefined；
sex：undefined；
["女", callee: ?, Symbol(Symbol.iterator): ?];
name：valley ;
*/

8. 寫一個函數(shù)，返回參數(shù)的平方和？

function sumOfSquares(n){
    var sum= 0;
    var sq;
    for (var i = 0; i < arguments.length; i++ ){
        sq = arguments[i] * arguments[i]
        sum += sq;
    }
    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);
/*
undefined
Uncaught ReferenceError: b is not defined

先變量前置聲明，聲明 var a 但卻先不賦值；所以console.log(a) 調(diào)試結(jié)果為undefined
然后把 1 賦值  給a；
由于b沒有定義，故console.log(b) 調(diào)試結(jié)果為 b is not defined
*/

10. 如下代碼的輸出？為什么

sayName('world');
sayAge(10);
function sayName(name){
    console.log('hello ', name);
}
var sayAge = function(age){
    console.log(age);
};
/*
hello world
test.html:7 Uncaught TypeError: sayAge is not a function

步驟：1、 聲明函數(shù)sayName  ；sayAge為函數(shù)表達式，所以不會聲明前置；
2、運行函數(shù)sayName（“world”） ，調(diào)試結(jié)果為 “hello” 連接  “world”
3、運行sayAge（10），由于sayAge函數(shù)沒有被聲明前置，故此時函數(shù)沒有被定義。故出錯。
*/

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

var x = 10
bar() 
function foo() {
  console.log(x)
}
function bar(){
  var x = 30
  foo()
}
/*     輸出：10
1.
globalContext = {
    AO:{
    x:10;
    foo:function;
    bar:function;
    }
    Scope:null
}

foo.[[scope]] = globalContext.AO
bar.[[scope]] = globalContext.AO

2.
barContext = {
    AO:{
    x:30
    }
    bar.[[scope]] = globalContext.AO
}

3.
fooContex={
    AO:{

    }
    foo.[[scope]] = globalContext.AO
}
*/

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

var x = 10;
bar() 
function bar(){
  var x = 30;
  function foo(){
    console.log(x) 
  }
  foo();
}   

/*
輸出：30
1.
globalContext = {
    AO:{
    x:10;
    bar:function;
    }
    Scope:null
}

bar.[[scope]] = globalContext.AO

2.
barContext = {
    AO:{
    x:30;
    foo:function;
    }
    bar.[[scope]] = globalContext.AO
}
foo.[[scope]] = barContext.AO

3.
fooContext = {
    AO:{
    
    }
    foo.[[scope]] = barContext.AO
}
*/

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

var x = 10;
bar() 
function bar(){
  var x = 30;
  (function (){
    console.log(x)
  })()
}
/*   輸出：30
1.
globalContext = {
    AO:{
    x:10;
    bar:function;
    }
    Scope:null
}

bar.[[scope]] = globalContext.AO

2.
barContext = {
    AO:{
    x:30;
    }
    bar.[[scope]] = globalContext.AO
}

*/

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) //200

/*      undefined   5   1   6  20   200   
1.
globalContext = {
    AO:{
    a:1;
    fn:function;
    fn3:function;
    }
    Scope:null
}

fn.[[scope]] = globalContext.AO
fn3.[[scope]] = globalContext.AO

2.
fnContext = {
    AO:{
    a:5;
    fn2:function;
    }
    fn.[[scope]] = globalContext.AO
}

fn2.[[scope]] = globalContext.AO

3.
fn3Context = {
    AO:{
    a:200
    }
    fn3.[[scope]] = globalContext.AO
}

4.
fn2Context = {
    AO:{
    a:20
    }
    fn2.[[scope]] = fnContext.AO
}
*/

參考答案

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • 1. 函數(shù)聲明和函數(shù)表達式有什么區(qū)別 函數(shù)聲明：function functionName(){}函數(shù)表達式：va...
    饑人谷_流水閱讀 192評論 0贊 0
  • 前言 把《C++ Primer》[https://book.douban.com/subject/25708312...
    尤汐Yogy閱讀 9,666評論 1贊 51
  • 小溪流，斷橋頌。 詩人飲酒盡惆悵，道人飲茶滿燭香。 小溪，盡頭，離歌笑 歸吧，歸吧，望眼欲穿待郎歸，待郎歸來盡私欲...
    游吟pote閱讀 350評論 0贊 0
  • 喜歡一座城市，就像喜歡一個人一樣，不經(jīng)意的某個瞬間就淪陷了。 對成都的好感不僅僅是它盛傳已久的辣味十足的美...
    微笑的百合花閱讀 503評論 2贊 1
  • 1簡易筆筒 2.裝飾品 3.收納小盒 4.賣廢品 5.做簡易漏斗（小時候家里裝油就用） 6.做花灑 7.做水槍玩 ...
    左岸_f694閱讀 256評論 0贊 2

友情鏈接更多精彩內(nèi)容