Web前端饥人谷技术博客

函数

2016-08-12  本文已影响37人  块垒

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

function add(num1,num2){
  var sum = 0;
  sum = num1+num2;
  return sum;
}
var add= function (num1,num2){
  var sum = 0;
  sum = num1+num2;
  return sum;
};

函数声明和函数表达式的区别:

  1. 函数声明必须给定函数名称,函数表达式则可以忽略名称;
  2. 函数声明是整体的声明提前,而函数表达式则是函数变量的声明提前;


    函数声明提前

什么是变量的声明前置?什么是函数的声明前置?

变量的声明前置就是把变量的声明提升到当前作用域的最前面

console.log(a);
var a = 1;
/*
等价于
var a;
console.log(a);
a = 1;
*/

函数声明前置就是把函数声明提升到当前作用域的前面,位于变量声明前置之后。

add(1,2);
function add(num1,num2){
  var sum = 0;
  sum = num1+num2;
  return sum;
}
var a = 1;
/*
等价于
var a;
function add(num1,num2){
  var sum = 0;
  sum = num1+num2;
  return sum;
}
add(1,2);
a = 1;
*/

这里需要注意函数声明前置和函数表达式声明前置的区别。

arguments 是什么

arguments是一个函数自带的存储参数的类数组对象。arguments的值由函数的传入参数有关,与函数定义参数无关。

函数的重载怎样实现

函数的重载:声明几个相同名称的函数,通过传入不同的形参,以达到用同一操作符进行不同运算的功能。重载函数通常用来实现功能类似而所处理的数据类型不同的问题。
而在JavaScript中定义同名的函数只会达到覆盖的效果,没法利用函数的形参不同而达到函数重载的目的,这时候可以利用arguments来达到函数重载的目的。

fouction add(){
  var sum = 0;
  for(var i = 0;i<arguments.length;i++){
    sum += arguments[i];
    console.log(sum);
  }
}

立即执行函数表达式是什么?有什么作用

(function () {  
    alert('watch out!');  
}());  

立即执行函数是为了达到立即调用函数的效果。
立即执行函数表达式的作用:

  1. 可以创建匿名函数,避免污染全局变量
  2. 形成一个单独的作用域,可以达到进行封装的效果。

什么是函数的作用域链

作用域:变量和函数的可访问范围,控制变量的可见性和声明周期。分为全局作用域和局部作用域。

作用域链:
当代码在一个环境中执行时,会创建变量对象的一个作用域链来保证对执行环境有权访问的变量和函数的有序访问。作用域第一个对象始终是当前执行代码所在环境的变量对象。

function a(x,y){
            var b=x+y;
            return b;
        }
函数初创建

而当函数执行时,那么函数对象则会创建一个活动对象作为函数作用域链的第一个对象,第二个环境是上一层的包含环境,一直到全局作用域为止。

函数执行作用域

代码

  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('hunger', 28, '男');
/*
  name:hunger 
  age:28 
  sex:男 
  ['hunger','28','男']
  name:valley
*/
    getInfo('hunger', 28);
/*
  name:hunger 
  age:28 
  sex:undefined
  ['hunger','28']
  name:valley
*/
    getInfo('男');
/*
  name:男
  age:undefined
  sex:undefined
  ['男']
  name:valley
*/
  1. 写一个函数,返回参数的平方和?
  function sumOfSquares(){
   }
   sumOfSquares(2,3,4);   // 29
   sumOfSquares(1,3);   // 10
function sumOfSquares(){
  var sum=0;
  for(var i=0;i < arguments.length;i++){
    sum += arguments[i]*arguments[i];
  }
  document.write(sum+" ");
}
sumOfSquares(2,3,4);   // 29
sumOfSquares(1,3);   // 10

JsBin

  1. 如下代码的输出?为什么
    console.log(a);  //undefined   声明提前  var a; 被提到最前面
    var a = 1;
    console.log(b); // 报错,因为变量b没有声明
  1. 如下代码的输出?为什么
   sayName('world'); //hello world;函数声明整体提前
    sayAge(10);//报错  sayAge不是函数类型;因为函数变量提前而不会整体提前
    function sayName(name){
        console.log('hello ', name);
    }
    var sayAge = function(age){
        console.log(age);
    };
  1. 如下代码的输出?为什么
   function fn(){}
    var fn = 3;
    console.log(fn); //3
/*
等价于
var fn;
function fn(){};
fn = 3;
console.log(fn);
*/
  1. 如下代码的输出?为什么
    function fn(fn2){
       console.log(fn2);
       var fn2 = 3;
       console.log(fn2);
       console.log(fn);
       function fn2(){
            console.log('fnnn2');
        }
     }
    fn(10);
//function
//3
//function
等价于
function fn(fn2){
  var fn2;  
  function fn2(){
    console.log('fnnn2');
  }
  console.log(fn2);
  fn2 = 3;
  console.long(fn2);
  console.log(fn);
}
fn(10);
  1. 如下代码的输出?为什么
   var fn = 1;
    function fn(fn){
         console.log(fn);
    }
    console.log(fn(fn));  //报错 fn现在被赋值为1   不是函数类型

等价于

var fn;
function fn(fn){
     console.log(fn);
}
fn = 1;
console.log(fn(fn)); 
  1. 如下代码的输出?为什么
/*
声明提前
var i;
var j
*/
    console.log(j);  //undefined    
    console.log(i);  //undefined
    for(var i=0; i<10; i++){
        var j = 100;
    }
    console.log(i);  //10
    console.log(j); //100
  1. 如下代码的输出?为什么
    fn();
    var i = 10;
    var fn = 20;
    console.log(i);
    function fn(){
        console.log(i);
        var i = 99;
        fn2();
        console.log(i);
        function fn2(){
            i = 100;
        }
    }
/*
输出
undefined
100
10
*/

等价于

var i;
var fn;
 function fn(){
        var i;
        function fn2(){
            i = 100;
        }
        console.log(i);
        i = 99;
        fn2();
        console.log(i);
}
fn();
i = 10;
fn = 20;
console.log(i);
  1. 如下代码的输出?为什么
    var say = 0;
    (function say(n){
        console.log(n);
        if(n<3) return;
        say(n-1);    //递归函数
    }( 10 ));//立即执行函数  执行完后销毁
    console.log(say); //say 为全局变量

输出 10 9 8 7 6 5 4 3 2 0

本文版权归本人和饥人谷所有,转载请注明来源。

上一篇 下一篇

猜你喜欢

热点阅读