广州-快看漫画前端笔试题

第二家面试的公司，面试难度不低，面试官更考察我的基础能力，框架的原理什么的很少问。面试官更喜欢抓着你的回答延伸问题，考察你是否真的理解了，好吧我又挂了= =哎，很想去这家公司来的，毕竟宅男，还是很喜欢漫画元素的

上题上题

1、下面代码的执行结果

var a = new Object();
a.value = 1;
b = a;
b.value = 2;
console.log(a.value);

var x = 1;
(function() {
    console.log(x);
    var x = 2;
})()

var User = {
    count: 1,
    getCount: function() {
        return this.count;
    }
}
console.log(User.getCount())
var func = User.getCount;
console.log(func())

答案

1. 输出2

我的回答：

var a = new Object();
a.value = 1;
b = a; // 这里把a赋值给b是引用赋值，b的指针指向了a的指针指向
b.value = 2; // 修改b的同时就是在修改a
console.log(a.value); // 打印 2 

知识点：

• js对象的引用和赋值
  
• 关于基本类型和引用类型在堆栈中的储存方式
  

延伸问答：

• 我想改变b.value的值，但是a.value的值不改变该怎么做？
• 建议了解下堆栈的区别，理解js运行的时候函数调用压栈的工作原理？
• 为什么基本数据类型被分配到栈内存，而引用类型要分配到堆内存?

从堆栈区别来理解，基本类型是能确定大小的，因此放在大小确定的堆中（由系统分配、回收），而引用类型无法确定大小，因此放在栈中。

另一篇堆栈区别

2. 输出undefined

我的回答：

var x = 1;
(function() {
    console.log(x); // var和let区别之一，var定义的变量会提升，但不会初始化，var x;因此会打印undefined
    var x = 2;
})()

知识点：

• JavaScript中词法作用域，变量提升的理解
• 立即执行函数IIFE
• 函数声明的两种方式和如何判断

延伸问答：

var x = 1;
(function() {
    console.log(x);
    let x = 2; // 会不会报错，为什么
})()

var x = 1;
(function() {
    console.log(x); // 输出结果是？为什么？
})()

3. 输出1 undefined

我的回答：

var User = {
    count: 1,
    getCount: function() {
        return this.count;
    }
}
console.log(User.getCount()) // 使用User去调用getCount函数，此时上下文环境是User，因此打印1
var func = User.getCount;
console.log(func()) // 在全局环境下调用func函数，如果是非严格模式，this会指向window全局对象，找不到count这个变量，会打印undefined

知识点：

• this的指向问题

延伸问答：

• 我现在想让func()打印出User的count1怎么办？

var func = User.getCount.bind(User)

• bind和call、apply的区别是？
• 用apply实现bind

2、用js实现以下需求

1. 一个动物类Animal，拥有wow方法：console.log(this.name + ":wow")）
2. 小狗Dog继承Animal，并且拥有run方法：console.log(this.name + ":run")

// es6的实现
class Animal {
  constructor(name) {
    this.name = name
  }
  wow() {
    console.log(this.name + ":wow")
  }
}


class Dog extends Animal {
  constructor(name) {
    super(name)
  }
  run() {
    console.log(this.name + ":run")
  }
}


// es5实现 -- 组合继承

function Animal(name) {
  this.name = name
}

Animal.prototype.wow = function () {
  console.log(this.name + 'wow');
}


function Dog(name) {
  Animal.call(this, name)
}

Dog.prototype = new Animal()

Dog.prototype.run = function(name) {
  console.log(this.name + 'run');
}

let d = new Dog('d')
d.run()

let a = new Animal('a')
a.wow()

3、实现一个闭包的用例？

当时我的回答

const func = function() {
  var a = 1;
  return function() {
    console.log(a);
  }
}()//函数表达式后面加括号，当javascript引擎解析到此处时能立即调用函数
func()

面试官针对我的回答提问

• 你了解闭包会造成内存泄漏的问题么？从内存角度讲一下你对内存泄漏的影响？如何自动（注意不是手动，func = null属于手动）让变量回收？