javascript 克隆javascript事件对象

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12593035/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 16:36:35  来源:igfitidea点击:

cloning javascript event object

javascriptdomdom-events

提问by paul smith

Anybody know how to do a deep copy/cloning of a native javascript event object? I know I can create a new event object and set the appropriate properties manually to match the original event, but it'd be much easier if there's a way to just clone.

有人知道如何对原生 javascript 事件对象进行深度复制/克隆吗?我知道我可以创建一个新的事件对象并手动设置适当的属性以匹配原始事件,但如果有一种方法可以克隆它会容易得多。

采纳答案by Erik Reppen

For your purposes I'd just make it a prototype of a new object constructor and override the ones you want changed. Cloning in JS gets messy due to the circular reference issue so it may not be the quick and dirty solution you were hoping for.

为了您的目的,我只是将其作为新对象构造函数的原型并覆盖您想要更改的那些。由于循环引用问题,JS 中的克隆变得混乱,因此它可能不是您希望的快速而肮脏的解决方案。

function cloneEventObj(eventObj, overrideObj){

   if(!overrideObj){ overrideObj = {}; }

   function EventCloneFactory(overProps){
       for(var x in overProps){
           this[x] = overProps[x];
       }
    }

    EventCloneFactory.prototype = eventObj;

    return new EventCloneFactory(overrideObj);

}

//So add your override properties via an object
$el.click(function(e){
    var newEventObj = cloneEventObj(
        e,
        { target:document.body }
    );
    doSomething(newEventObj);
});

//or just stick 'em on manually after spitting the object out
/*...
var newEventObj = cloneEventObj(e);
newEventObj.target = document.body
...*/

In this case the 'cloned' object is the prototype object of the new object. 'this.' properties are checked for before the prototype object so these will override. Or you could just attach properties after the object is built.

在这种情况下,“克隆”对象是新对象的原型对象。'这。' 在原型对象之前检查属性,因此这些属性将被覆盖。或者您可以在构建对象后附加属性。

回答by kofifus

Above code will not copy any getters/setters properly. Try:

上面的代码不会正确复制任何 getter/setter。尝试:

function cloneEvent(e) {
    if (e===undefined || e===null) return undefined;
    function ClonedEvent() {};  
    let clone=new ClonedEvent();
    for (let p in e) {
        let d=Object.getOwnPropertyDescriptor(e, p);
        if (d && (d.get || d.set)) Object.defineProperty(clone, p, d); else clone[p] = e[p];
    }
    Object.setPrototypeOf(clone, e);
    return clone;
}

回答by pery mimon

Inspired by Kofifus answer I just do that

受 Kofifus 回答的启发,我就是这样做的

function cloneEvent(type, event) {
    var evt = new Event(type);
    return Object.setPrototypeOf(evt,event);
}

or just

要不就

function cloneEvent(event){
  return Object.create(event)
} 

it returns a new object that protects you from edit the original object. but let you read and edit the property. thanks to js prototype chain

它返回一个新对象,保护您免于编辑原始对象。但让您阅读和编辑属性。谢谢js prototype chain