1回答

双越

2019-11-12

已采纳

ES5 原型就不再单独讲了，毕竟现在已经是 class 普及了。我这里把代码单独给你提供一下吧，如下：

// 构造函数
function DomElement(selector) {
    var result = document.querySelectorAll(selector)
    var length = result.length
    var i
    for (i = 0; i < length; i++) {
        this[i] = selectorResult[i]
    }
    this.length = length
}
// 修改原型
DomElement.prototype = {
    constructor: DomElement,
    get: function (index) {
        return this[index]
    },
    forEach: function (fn) {
        var i
        for (i = 0; i < this.length; i++) {
            const elem = this[i]
            const result = fn.call(elem, elem, i)
            if (result === false) {
                break
            }
        }
        return this
    },
    on: function (type, fn) {
        return this.forEach(elem => {
            elem.addEventListener(type, fn, false)
        })
    }
}

// 使用
var $div = new DomElement('div')
$div.on('click', function() {
    console.log('click')
})

另外，还可以看看我的免费课《zepto 设计和源码分析》https://www.imooc.com/learn/745  ，也可以详细回答你的提问。

0

1

qq_小江南_04298178

谢谢老师

2019-11-14

共1条回复