前端面试题之JavaScript（三）

---

1.立即执行函数表达式是什么？有什么作用

var a=2;
(function foo(){
    var a=3;
    console.log(a); //3
})();
console.log(a); //2

由于函数被包含在一对（）括号内部，因此成为了一个表达式，通过在末尾加上另外一个（）可以立即执行这个函数，比如(function foo(){..})()。第一个（）将函数变成表达式，第二个（）执行了这个函数。
作用：

• 将函数里的变量和外部变量隔离开
• 防止函数名污染所在作用域。

---

2. 求n!，用递归来实现

function factorial(n){
  if(n==1){
  return 1;
}
  return n*factorial(n-1);
}
factorial(5);

---

3.以下代码输出什么？

image.png

---

4.写一个函数，返回参数的平方和？

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

---

5.如下代码的输出？为什么

• var a声明提前
  等价于

var a;
console.log(a);
 a= 1;
console.log(b);

• console.log(a)中的a声明未赋值，所以返回undefined
  console,log(b)中的b在全局作用域中遍寻不到所需变量，所以抛出异常 ReferenceError

---

6. 如下代码的输出？为什么

• 函数声明提前,函数表达式无法声明提前，var sayAge
  等价于

    function sayName(name){
        console.log('hello ', name);
    }
    var sayAge;
    sayName('world');
    sayAge(10);
        sayAge= function(age){
        console.log(age);
    };

• sayName('world')查看sayName前面有函数声明，所以为hello world
• sayAge(10)查看sayName前面有var sayAge声明,说明sayAge()被分配给所在作用域，因此sayAge()不会返回ReferenceError。但是sayAge此时没有赋值，sayAge()由于对undefined值进行函数调用而导致非法操作，因此抛出异常TypeError

---

7.如下代码输出什么? 为什么

• 函数声明提前
  等价于

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

• bar()在该作用域找bar声明,找到了，进去，
• 进入到bar作用域里，foo()在该作用域找不到函数声明，于是往上一层找，找到了，在foo()作用域中，console.log(x)的x在foo()下的作用域里找不到变量x,于是继续往上一层作用域找，找到了，所以x的值等于10，console.log(x)本身值等于undefined

8.如下代码输出什么? 为什么

image.png

等价于

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

---

9.如下代码输出什么? 为什么

• fn()在该作用域找函数声明，没有，找函数表达式，找到被赋值fn1(),fn1()在该作用域找函数声明，找到，在fn1()作用域下，return fn3,
  在fn1()函数作用域找fn3函数声明，找到，在fn3()作用域下，遇到fn2()，在该作用域找fn2()，没找到，从上一级找，找到，在fn2()作用域下，遇到console.log(a),a在该作用域找不到变量声明，往上一级找，找到，var a=2 ,所以最后结果为2

---

10.如下代码输出什么? 为什么

image.png

• 1
  原理如上

---

11.如下代码输出什么? 为什么

• 注意 var a=4 变量声明提前 var a 提前 在fn2()前面，所以为undefined

var a = 1
function fn1(){

  function fn3(){
    function fn2(){
      console.log(a)
    }
     var a = 4
    fn2()
   
  }
  var a = 2
  return fn3
}
var fn = fn1()
fn() //输出多少

---

12.如下代码输出什么? 为什么

---

13.如下代码输出什么? 为什么

image.png

• 源代码相当于下列代码

var a = 1
var c = { name: 'jirengu', age: 2 }

function f1(n){
 // n=a
 //n=c.age 
  ++n
}
function f2(obj){
  ++obj.age
}

f1(a) 
f2(c) 
f1(c.age) 
console.log(a) 
console.log(c) 

基本类型引用类型传参都是值传递，相当于赋值，前者和后者没有任何关系，但是引用类型赋值赋的是引用即内存地址，所以还是会访问同一对象，所以当引用改变属性的时候，会相应改变。如果函数当中给对象重新赋值，那内作用域的对象和外作用域对象就毫无关系了。
参考：http://www.jianshu.com/p/0b9216bd05a7 基本类型传参，引用类型传参。

---

14.对象浅拷贝函数

  <script>
    function shallowCopy(obj) {
      var newObj = {};
      for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
          newObj[i] = obj[i];
        }

      }

      return newObj;
    }
    // var obj = {
    //   name: "zhx", age: "17", arr: [1, 3, 5, 6, 7]
    // };
    var obj={
      name:'zhx',
      age:'19',
      infomation:{
        height:'100',
        weight:'40'
      }
    }

    var obj1=shallowCopy(obj);
    obj.infomation.height=40;
    console.log(obj);
    console.log(obj1);
  </script>

---

15. 对象深拷贝函数

  <script>
    function deepCopy(obj){
      var newObj={};
      for(var key in obj){
        if(typeof oldObj[key] === 'object') {
                newObj[key] = deepCopy(oldObj[key]);
            }else{
                newObj[key] = oldObj[key];
            }
      }
      return newObj;
    }
    var obj={
      name:'zhx',
      age:'19',
      infomation:{
        height:'100',
        weight:'40'
      }
    }

    var obj1=shallowCopy(obj);
    obj.infomation.height=40;
    console.log(obj);
    console.log(obj1);
  </script>