使用JavaScript克隆任何内容

    技术2022-07-11  133

    One topic or concept that causes confusion when developers start with JavaScript is the idea of passing objects by reference;  for example, setting two variables equal to the same object actually creates a reference to that same object.  Sending an object to a function and modify that argument within the function actually modifies the original object.  Sometimes we'd prefer to send around a clone of something, a date, array, or maybe an object literal.  The Dojo Toolkit provides an excellent method for cloning just about anything.  Even better is that the functionality is easy to pull out of Dojo for your own toolkit.

    当开发人员开始使用JavaScript时,引起混乱的一个主题或概念是通过引用传递对象的想法。 例如,设置两个等于相同对象的变量实际上会创建对该相同对象的引用。 将对象发送到函数并在函数中修改该参数实际上会修改原始对象。 有时我们希望发送一些东西的副本,例如日期,数组或对象常量。 Dojo Toolkit提供了一种极好的克隆几乎所有东西的方法。 更好的是,该功能很容易从您自己的工具箱中退出Dojo。

    JavaScript (The JavaScript)

    The clone method will deep clone nodes, object literals, arrays, dates, regular expressions, and generic objects:

    clone方法将深度克隆节点,对象文字,数组,日期,正则表达式和通用对象:

    function clone(src) { function mixin(dest, source, copyFunc) { var name, s, i, empty = {}; for(name in source){ // the (!(name in empty) || empty[name] !== s) condition avoids copying properties in "source" // inherited from Object.prototype. For example, if dest has a custom toString() method, // don't overwrite it with the toString() method that source inherited from Object.prototype s = source[name]; if(!(name in dest) || (dest[name] !== s && (!(name in empty) || empty[name] !== s))){ dest[name] = copyFunc ? copyFunc(s) : s; } } return dest; } if(!src || typeof src != "object" || Object.prototype.toString.call(src) === "[object Function]"){ // null, undefined, any non-object, or function return src; // anything } if(src.nodeType && "cloneNode" in src){ // DOM Node return src.cloneNode(true); // Node } if(src instanceof Date){ // Date return new Date(src.getTime()); // Date } if(src instanceof RegExp){ // RegExp return new RegExp(src); // RegExp } var r, i, l; if(src instanceof Array){ // array r = []; for(i = 0, l = src.length; i < l; ++i){ if(i in src){ r.push(clone(src[i])); } } // we don't clone functions for performance reasons // }else if(d.isFunction(src)){ // // function // r = function(){ return src.apply(this, arguments); }; }else{ // generic objects r = src.constructor ? new src.constructor() : {}; } return mixin(r, src, clone); }

    The code provided by Dojo also has the ability to clone functions, but that ability is disabled for performance reasons.  I've placed the mixin function within clone itself, but that can also be defined at the same level and you can use mixin as a general function for merging objects.  This method, of course, is just one of a thousand helpful snippets you can find within the Dojo Toolkit!

    Dojo提供的代码也具有克隆功能的能力,但是由于性能原因,该功能被禁用。 我已经将mixin函数放置在克隆本身中,但是也可以在同一级别定义它,并且可以将mixin用作合并对象的常规函数​​。 当然,这种方法只是您在Dojo Toolkit中可以找到的数千个有用的片段之一!

    翻译自: https://davidwalsh.name/javascript-clone

    Processed: 0.012, SQL: 9