函数与作用域

函数声明和函数表达式有什么区别?

ECMAScript规定了三种声明函数的方式(构造函数、函数声明、函数表达式)

  • 构造函数(使用new来创建一个函数对象)
var hope = new Function("console.log('hello world');");
  • 函数声明(使用function声明一个函数,声明的位置不影响调用的位置)
//函数声明
function oneStep () {
    console.log("hello world")
} 
//函数调用
oneStep()
  • 函数表达式(声明必须放在调用之前)
var oneStep = function () {
    console.log("hello world")
}
oneStep()

函数声明与函数表达式之间的区别就是函数表达式必须将声明放在调用之前,而函数声明则不用去顾忌这一点

变量的声明前置?函数的声明前置?

变量的声明前置

conslole.log(a);
var a=3;
//实际上会是这样
var a;
console.log(a);//undefined
a=1;
*/

函数的声明前置

sayHello("My lord");
founction sayHello(name) {
     console.log(name);
}
//实际上会这样
founction sayHello(name) {
     console.log(name);
}
sayHello("My lord");

arguments

ECMAScript中的参数在内部是用一个数组表示的,augument对象与数组类似,可以使用方括号访问它的每一个元素。而且关于argument,它的值永远与对应命名参数的值保持同步

js中函数的“重载”

ECMAScript函数不能像传统意义一样实现重载,因为它没有签名,其参数是由包含零或多个值得数组来表示的,没有签名真正的重载是不可能实现的。当定义了两个同名的函数,该名字属于后定义的函数,通过检查传入函数的参数类型和数量实现不同反应,可以模仿重载。

立即执行函数表达式是什么及其作用

用括号包含住函数体,或者包含在数组初始化器内,也可以用逗号也可以实现隔离作用域。

(function() {
    var a = 1;
}) ()
console.log(a); //undefined

求n!,用递归来实现

function  factor(n){
    if(n<0){
       console.log("请输入一个自然数");
    } else if(n==0 || n==1){
          return 1;
      } else {
            return n*factor(n-1)
        }
}

以下代码输出什么

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:男
  0:"valley"
  1:2
  2:"男"
  name valley */
getInfo('小谷', 3);
/*name:小谷
  age:3
  sex:undefined
   0:"valley"
  1:3
  name valley*/
getInfo('男');
/*name:男
  age:undefined
  sex:undefined
  0:valley
  name valley
*/

写一个函数,返回参数的平方和

   function sumOfSquares(){
         for( i=0 i<=arguments.length i++) {
             sum+=Math.pow(arguments[i],2);
         }
         return sum;
   }
   var result = sumOfSquares(2,3,4)
   var result2 = sumOfSquares(1,3)
   console.log(result)  //29
   console.log(result2)  //10

如下代码的输出?为什么

    console.log(a);
    var a = 1;
    console.log(b);
/*undefined, b is not defined
由于变量的声明前置,函数的声明前置,导致a声明了但未来得及赋值*/

如下代码的输出?为什么

sayName('world');
    sayAge(10);
    function sayName(name){
        console.log('hello ', name);
    }
    var sayAge = function(age){
        console.log(age);
    };
/*hello world, sayAge is not function,因为该函数是以函数表达式的形式存在的,声明应该在调用之前*/

如下代码输出什么? 写出作用域链查找过程伪代码

var x = 10
bar() 
function foo() {
  console.log(x)
}
function bar(){
  var x = 30
  foo()
}
/*输出结果为:30,
1. globalContext = {
    AO: {
      x: 10
      foo: function
      bar: function  
    },
    Scope: null
}
foo.[[scope]] = globalContext.AO
bar.[[scope]] = globalContext.AO

2. barContext = {
    AO:  {
       x:30 
   }
}
//当调用foo()时,先从bar执行行下文的AO中找,找不到后再从bar的[[scope]]中找,找到后调用
3. fooContext = {
    AO: {
        x: 10
   },
   Scope: foo.[[scope]]
}
//调用foo()时,进入foo的执行上下文,所以console.log(x)是10

*/

如下代码输出什么? 写出作用域链查找过程伪代码

var x = 10;
bar() 
function bar(){
  var x = 30;
  function foo(){
    console.log(x) 
  }
  foo();
}   
/*输出结果为:30
1. golbalContext= {
    AO:{
           x: 10
           bar: function
    },
    scope: null
}
bar[[scope]] = globalContext.AO

2. barContext={
    AO:{
          x: 10
          foo: function
    },
    scope: bar.[[scope]] //globalContext.AO
}
foo[[scope]] = barContext.AO

3.fooContext={
    AO:{},
    Scope: foo.[[scope]] //barContext.AO
}
//所以console.log(x)是30
*/

以下代码输出什么? 写出作用域链的查找过程伪代码

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]] = golbalContext.AO

2. barContext={
        AO:{
            x:30
           匿名函数:function
        }
        Scope:bar.[[scope]] //barContext.AO
}
匿名函数.[[scope]] = barContext;

3. 匿名函数= {
      AO: {}
      Scope: 匿名函数[[scope]] //barContext.AO
}
所以console.log(x)为30
*/

以下代码输出什么? 写出作用域链查找过程伪代码

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. golbalContext ={
    AO:{
        X:1
        fn:function
        fn3:function
     },
     Scope:null
}
fn[[scope]] = globalContext.AO
fn3[[scope]] = globalContext.AO

2.fnContext ={
    AO:{
       a:undefined
       fn2: function
   }
   Scope:fnConrtext[[scope]]
}
fn2[[scope]] = fnContext.AO

3.fnContext ={
    AO:{
       a:5
       fn2: function
   }
   Scope:fnConrtext[[scope]]
}
fn2[[scope]] = fnContext.AO

4. fnContext ={
    AO:{
       a: 6
       fn2: function
   }
   Scope:fnConrtext[[scope]]
}
fn2[[scope]] = fnContext.AO

5.  fn3Context ={
    AO:{}
   Scope:globalConrtext[[scope]]
}
fn3[[scope]] = globalContext.AO

6. fn2Context= {
      AO: {}
      Scope: fn3Context.AO
}
fn2[[scope]] = fnContent.AO

7.  fnContext ={
    AO:{
       a: 20
       fn2: function
   }
   Scope:fnConrtext[[scope]]
}
fn2[[scope]] = fnContext.AO

8.  fnContext ={
    AO:{
       a: 200
       fn2: function
   }
   Scope:fnConrtext[[scope]]
}
fn2[[scope]] = fnContext.AO
 
*/
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,921评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,635评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,393评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,836评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,833评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,685评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,043评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,694评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,671评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,670评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,779评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,424评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,027评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,984评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,214评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,108评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,517评论 2 343

推荐阅读更多精彩内容

  • 1.函数声明和函数表达式有什么区别 函数就是一段可以反复调用的代码块。函数还能接受输入的参数,不同的参数会返回不同...
    徐国军_plus阅读 472评论 0 0
  • 1、 函数声明和函数表达式有什么区别 ECMAScript规定了三种声明函数方式:构造函数、函数声明、和函数表达式...
    HE_Zoro阅读 200评论 0 0
  • 函数声明和函数表达式有什么区别 函数声明语法:function functionName(arg0,arg1,ar...
    _Dot912阅读 566评论 0 3
  • 函数声明和函数表达式有什么区别? 函数声明和函数表达式是EMACScript规定的两种不同的声明函数的方法。1.函...
    LeeoZz阅读 341评论 0 1
  • 函数声明和函数表达式有什么区别 函数声明:function fn(){}; 函数表达式: var fn = fun...
    cross_王阅读 255评论 0 0