摘要：阿里前端筆試題，題目不多，難度也不大，我只記錄了兩道稍微有點(diǎn)難度的編程題。題目如下的功能是，將一個(gè)字面量對(duì)象轉(zhuǎn)化為一個(gè)格式的字符串。

阿里前端筆試題，題目不多，難度也不大，我只記錄了兩道稍微有點(diǎn)難度的編程題。題目如下：
1.JSON.stringify 的功能是，將一個(gè) JavaScript 字面量對(duì)象轉(zhuǎn)化為一個(gè) JSON 格式的字符串。例如:

const obj = {a:1, b:2}
JSON.stringify(obj) // => "{"a":1,"b":2}"

當(dāng)要轉(zhuǎn)化的對(duì)象有“環(huán)”存在時(shí)（子節(jié)點(diǎn)屬性賦值了父節(jié)點(diǎn)的引用），為了避免死循環(huán)，JSON.stringify 會(huì)拋出異常，例如：

const obj = {
  foo: {
    name: "foo",
    bar: {
      name: "bar"
      baz: {
        name: "baz",
        aChild: null // 待會(huì)將指向obj.bar
      }
    }
  }
}
obj.foo.bar.baz.aChild = obj.foo // foo->bar->baz->aChild->foo形成環(huán)
JSON.stringify(obj) // => TypeError: Converting circular personucture to JSON

請(qǐng)完善以下“環(huán)”檢查器函數(shù) cycleDetector，當(dāng)入?yún)?duì)象中有環(huán)時(shí)返回 true，否則返回 false。

function cycleDetector(obj) {   
  // 請(qǐng)?zhí)砑哟a
}

解題思路：首先很容易想到要遍歷這個(gè)對(duì)象，然后判斷屬性值是否為一個(gè)對(duì)象，如果是，則遞歸遍歷這個(gè)屬性值，但難點(diǎn)是該如何判斷這個(gè)屬性值是否為某個(gè)父節(jié)點(diǎn)的引用，要怎樣拿到父節(jié)點(diǎn)的引用呢？？？
其實(shí)我們可以先用一個(gè)數(shù)組cache用來保存對(duì)象類型的屬性值，再用一個(gè)標(biāo)記變量來標(biāo)記是否有環(huán)，然后遍歷時(shí)判斷這個(gè)屬性值類型是否為一個(gè)對(duì)象，如果是，則判斷這個(gè)屬性值是否在那個(gè)cache數(shù)組里，如果在，則表明有環(huán)，如果不在，則把這個(gè)屬性值添加到數(shù)組里，再遞歸遍歷這個(gè)屬性值即可。

具體代碼如下：

function cycleDetector(obj) {
    let hasCircle = false, //用一個(gè)變量去標(biāo)記是否有環(huán)
        cache = []; //保存值為對(duì)象的屬性值
    (function(obj) {
        Object.keys(obj).forEach(key => {
            const value = obj[key]
            if (typeof value == "object" && value !== null) {
                const index = cache.indexOf(value)
                if (index !== -1) { //如果cache中存在這個(gè)value，則表示有環(huán)
                    hasCircle = true
                    return
                } else {
                    cache.push(value)
                    arguments.callee(value)
                }
            }
        })
    })(obj)
    return hasCircle
}

2.實(shí)現(xiàn)一個(gè)EventEmitter類，這個(gè)類包含以下方法：
on（監(jiān)聽事件，該事件可以被觸發(fā)多次）
once（也是監(jiān)聽事件，但只能被觸發(fā)一次）
fire（觸發(fā)指定的事件）
off（移除指定事件的某個(gè)回調(diào)方法或者所有回調(diào)方法）

class EventEmitter {
  /**請(qǐng)補(bǔ)充你的代碼***/
}
const event = new EventEmitter()
const drank = (person) => {
  console.log(person + "喝水")
}
event.on("drank", drank)
event.on("eat", (person) => {
  console.log(person + "吃東西")
})
event.once("buy", (person) => {
  console.log(person + "買東西")
})
event.fire("drank", "我")   // 我喝水  
event.fire("drank", "我")   // 我喝水  
event.fire("eat", "其它人")   // 其它人吃東西
event.fire("eat", "其它人")   // 其它人吃東西
event.fire("buy", "其它人")  //其它人買東西
event.fire("buy", "其它人")  //這里不會(huì)再次觸發(fā)buy事件，因?yàn)閛nce只能觸發(fā)一次
event.off("eat")  //移除eat事件
event.fire("eat", "其它人")  //這里不會(huì)觸發(fā)eat事件，因?yàn)橐呀?jīng)移除了

解題思路：這題其實(shí)就是實(shí)現(xiàn)發(fā)布-訂閱模式了，難點(diǎn)在于怎樣實(shí)現(xiàn)once事件，即只觸發(fā)一次。其實(shí)也就是要實(shí)現(xiàn)兩種類型的事件，我們可以用不同的對(duì)象去保存這兩種類型的事件，然后在fire的時(shí)候，這兩種事件都要被處理即可。
具體代碼如下：

class EventEmitter {
    constructor() {
        this.queue = {} //可觸發(fā)多次的事件
        this.onceQueue = {} //只能觸發(fā)一次的事件
    }
    on(event, fn) {  //監(jiān)聽事件，可以觸發(fā)多次
        if (!this.queue[event]) this.queue[event] = []
        this.queue[event].push(fn)
    }
    once(event, fn) {   //監(jiān)聽事件，只能觸發(fā)一次
        if (!this.onceQueue[event]) {
            this.onceQueue[event] = {
                fns: [],
                hasFired: false
            }
        }
        this.onceQueue[event].fns.push(fn)
    }
    fire() {  //觸發(fā)指定的事件
        const event = [].shift.call(arguments), //取得事件名稱
            fns = this.queue[event],  //取得該事件里所有的回調(diào)函數(shù)（可以觸發(fā)多次的事件）
            onceFns = this.onceQueue[event]  //取得該事件里所有的回調(diào)函數(shù)（只能觸發(fā)一次的事件）
        if (fns && fns.length != 0) {
            let i = 0,fn
            while (fn = fns[i++]) {
                fn.apply(this, arguments)
            }
        }
        if (onceFns && !onceFns.hasFired) {
            let i = 0,fn
            while (fn = onceFns.fns[i++]) {
                fn.apply(this, arguments)
            }
            this.onceQueue[event].hasFired = true
        }
    }
    off(event, fn = null) { //可移除特定事件里的某個(gè)回調(diào)函數(shù)或者所有回調(diào)函數(shù)
        const fns = this.queue[event]
        if (!fns || fns.length == 0) return
        if (fn) { //移除該事件特定的回調(diào)
            this.queue[event] = fns.filter(item => {
                return item !== fn
            })
        } else { //移除該事件所有的回調(diào)
            this.queue[event] = []
        }
    }
}

原文地址：https://lenshen.com/2017/08/2...
最后，我的github:https://github.com/lensh