js函数篇面试题

原型链图解

1. instanceof是如何判断的?

• 表达式: A instanceof B
• 如果B函数的显式原型对象在A对象的原型链上, 返回true, 否则返回false

2. Function是通过new自己产生的实例

原型链

  console.log(Object instanceof Function)  //  true
  console.log(Object instanceof Object) // true
  console.log(Function instanceof Object) // true
  console.log(Function instanceof Function) // true
  function Foo() {}
  console.log(Object instanceof  Foo); // false
  
    /*
  测试题1
   */
  var A = function() {

  }
  console.log(A.prototype.n);
  A.prototype.n = 1
  console.log(A.prototype);

  var b = new A() // {n: 1}

  A.prototype = {
    n: 2,
    m: 3
  }

  var c = new A()
  console.log(b.n, b.m, c.n, c.m) // 1 undefined 2 3


  /*
   测试题2
   */
  var F = function(){}; // 函数对象
  Object.prototype.a = function(){
    console.log('a()')
  };
  Function.prototype.b = function(){
    console.log('b()')
  };
  var f = new F(); // 构造函数
  // f就是一个普通的实例对象
  f.a() // f的隐式原型对象 == F的显示原型对象 === {constructor}
  // f.b()
  F.a() // 函数对象, 当把函数当做对象看待的时候，这个时候其构造函数应该是Function
  F.b()

函数提升与变量提升

/*
   面试题: 输出什么?
   */
  var a = 4
  function fn () {
    console.log(a)  // undefined
    var a = 5
  }
  fn()


  /*变量提升*/
  console.log(a1) //undefined
  /*函数提升*/
  a2() //

  var a1 = 3
  function a2() {
    console.log('a2()') //a2()
  }

执行上下文

console.log('global begin: '+ i)
  var i = 1
  foo(1);
  function foo(i) {
    if (i == 4) {
      return;
    }
    console.log('foo() begin:' + i);
    foo(i + 1);
    console.log('foo() end:' + i);
  }
  console.log('global end: ' + i)    //1233211    5个执行上下文

console.log(b);
  if (!(b in window)) {
    var b = 1;
  }
  console.log(b) // undefined

var c = 1
  function c(c) {
    console.log(c) 
    var c = 3
  }
  console.log(c);
  c(2)   //c is not defined

作用域链

/*
   问题: 结果输出多少?
   */
  var x = 10;
  function fn() {
    console.log(x); //10
  }
  function show(f) {
    var x = 20;
    f();
  }
  show(fn);

console.log(fn); // undedined;
  var fn = function () { // fn = function
    console.log(fn)
  }
  fn()


  var obj = {
    fn2: function () {
      console.log(fn2) // 报错
    }
  }
  obj.fn2()

// 创建全局作用域 ---> 预解析工作 ---> 创建全局的执行上下文 ---> 执行上下文环境 ---> 全局变量对象{a: undefined, this: window， fun:function} ---> 作用域链[全局变量对象]
  var a = 123;
  var b = 'abc'
  // 先定义---> 创建局部作用域---> 函数自身有一个[[scopes]]: 上一级作用域链(global)
  function fun() {
    // 创建局部执行上下文 ---> 局部变量对象{a: undefined, fun2: function, this: window} ---> 创建作用域链[局部变量对象, Global]
    var a = 234;
    var c = 345;
    console.log(a);
    console.log(b);
    // fun2函数已经定义了 ---> 创建局部作用域(fun2)---> 函数自身有一个[[scopes]]: 上一级作用域链[fun的变量对象， Global]
    function fun2() {
      // 创建局部执行上下文 ---> 局部变量对象{this: window} ---> 创建作用域链: [fun2的局部变量对象，fun的变量对象， Global]
      console.log(c);
      console.log(d);
    }    
    fun2();
  }

  fun();

闭包：

//代码片段一
  var name = "The Window";
  var object = {
    name: "My Object",
    getNameFunc: function () {
      return function () {
        return this.name;
      };
    }
  };
    console.log(object.getNameFunc()());  //The Window


//代码片段二
  var name2 = "The Window";
  var object2 = {
    name2: "My Object",
    getNameFunc: function () {
      var that = this; // 缓存this
      return function () {
        return that.name2;
      };
    }
  };
  console.log(object2.getNameFunc()()); //My Object

/*
   说说它们的输出情况
   */

  function fun(n, o) {
    console.log(o);
    return {
      fun: function (m) {// 满足产生闭包的条件， 产生了一个闭包引用 ---> 外部函数fun的变量对象 === {n: 0, o:undefined }
        var num = 123;
        // var result = fun(m, n) = {}
        return fun(m, n);// m  = 1, n = 0
      }
    }
  }


  var b = fun(0).fun(1).fun(2).fun(3).fun(30).fun(55) //undefined,0,1,2, 3, 30

  var c = fun(0).fun(1) // {n: 1, o: 0}
  c.fun(2) // 1
  c.fun(3) //undefined,0,1,1

  var a = fun(0) // a = {fun: function(){}}
  a.fun(1) // m = 1 n = 0;
  a.fun(2)
  a.fun(3) //undefined,0 0 0

function Foo() {
    getName = function () { alert (1); };
    return this;
  }
  Foo.getName = function () { alert (2);};
  Foo.prototype.getName = function () { alert (3);};
  // getName = function(){ alert (5);}
  var getName = function () { alert (4);};
  function getName() { alert (5);}


  //请写出以下输出结果：
  Foo.getName(); // 2
  getName(); // 4
  Foo().getName(); // 1
  getName();// 1
  new Foo.getName(); // 2
  new Foo().getName(); // 3
  new new Foo().getName();// 3

对象

// 对象中所有的key都是字符串
  var a = {}
  var obj1 = {n:345345345} // toString() = '[object Object]'
  var obj2 = {hh: 4535345} // toString() = '[object Object]'
  a[obj1] = 4
  console.log(a); // {[object Object]: 4}
  a[obj2] = 5
  console.log(a[obj1]) // 输出多少?  5