1.下面代碼的輸出結(jié)果是什么？

window.n = 'window name'
let obj = {
    n: 'obj name',
    sayN(){
        console.log(this.n)
    }
}

let fn = obj.sayN
fn()

答案: 'window name'
原因: this指向他的直接調(diào)用者, 沒有調(diào)用者, 非嚴(yán)格模式下是指向window

2.下面代碼的輸出結(jié)果是什么？

window.n = 'window name'
let obj = {
    n: 'obj name',
    sayN: () => {
        console.log(this.n)
    }
}

obj.sayN()

答案: 'window name'
原因: es6的箭頭函數(shù)是詞法作用域, 也就是塊作用域

3.下面代碼的輸出結(jié)果是什么？

class A{
    constructor(){
        this.name = 'A'
    }
    sayName(){
        console.log(this.name)
    }
}
class B extends A{
    constructor(){
        super()
        this.name = 'B'
    }
}

let obj = new B()
console.log(obj.sayName)

答案: 'B'
原因: B繼承了A的原型擁有了sayName()方法, 并且this指向B

4.下面代碼的輸出結(jié)果是什么？

Promise.reject('error')
    .then( ()=>{console.log('success1')}, ()=>{console.log('error1')} )
    .then( ()=>{console.log('success2')}, ()=>{console.log('error2')} )

答案: 先輸出error1再輸出: success2
原因: reject()之后的then()返回的是一個(gè)pending狀態(tài)的Promise

5.關(guān)于 Vue 中的 key 屬性, 正確的是

 A.當(dāng) Vue.js 用 v-for 正在更新已渲染過的元素列表時(shí)，它默認(rèn)用“就地復(fù)用”策略。如果數(shù)據(jù)項(xiàng)的順序被改變，Vue 將不會(huì)移動(dòng) DOM 元素來匹配數(shù)據(jù)項(xiàng)的順序， 而是簡單復(fù)用此處每個(gè)元素，并且確保它在特定索引下顯示已被渲染過的每個(gè)元素。
 B.為了給 Vue 一個(gè)提示，以便它能跟蹤每個(gè)節(jié)點(diǎn)的身份，從而重用和重新排序現(xiàn)有元素，你需要為每項(xiàng)提供一個(gè)唯一 key 屬性。
 C.理想的 key 值是每項(xiàng)都有的且唯一的 id。
 D.2.2.0+ 的版本里，當(dāng)在組件中使用 v-for 時(shí)，key 是必須的。

答案: 全對(duì)

6.下面代碼的輸出結(jié)果是什么？

var myMixin = {
  created: function () {
    this.hello()
  },
  methods: {
    hello: function () {
      console.log('hello from mixin!')
    }
  }
}

var Component = Vue.extend({
  mixins: [myMixin],
  methods: {
    hello(){
      console.log('hello from options')
    }
  }
})

var component = new Component()

答案: 'hello from options'
原因: 如果mixin的選項(xiàng)和組件的選項(xiàng)一樣, 組件會(huì)覆蓋mixin, 如果是對(duì)象會(huì)淺層合并; 如果是生命周期, 會(huì)先執(zhí)行mixin的

7.下面代碼的輸出結(jié)果是什么？

function getSomething(){
    setTimeout(function(){
        return 'hello'
    })
}

let something = getSomething()
console.log(something)

答案: 'undefined'
原因: 執(zhí)行console.log()的時(shí)候, 定時(shí)器里的函數(shù)還在異步隊(duì)列里

8.下面代碼的輸出結(jié)果是什么？

let _name = 'MyName'
let obj = {}
Object.defineProperty(obj, 'name', {
    get(){
        return _name
    },
    set(value){
        _name = value
    }
})

obj.name = 'NewName'
console.log(_name)

答案: 'NewName'
原因: Object.defineProperty()方法為obj添加get和set函數(shù), 在set里可以監(jiān)控到name的改變