JavaScript Deep Copy разработана начинающими и даже опытными, и они часто сталкиваются с проблемами и не могут очень хорошо понять глубокую копию JavaScript.
DeepClone?
Противоположностью глубокой копии является мелкая копия. Многие новички смущены, когда они вступают в контакт с этим чувством.
Зачем использовать глубокую копию?
Во многих случаях нам нужно присвоить значения переменным и присвоить значение адресу памяти. Однако при назначении типа эталонного значения мы разделяем только область памяти, которая приводит к поддержанию согласованности с предыдущим значением при назначении.
См. Конкретный пример
// назначить объект для тестирования test test = {a: 'a', b: 'b'}; // назначить тест на тест2 // В настоящее время тест и тест 2 Совместный объект памяти, который является мелкой копией var test2 = test; test2Иллюстрация:
Это хорошая идея, чтобы понять, почему данные о ссылках данных влияют друг на друга.
выполнить
Чтобы реализовать функцию глубокой копии, мы должны поговорить о численном типе JavaScript.
Определите тип JavaScript
В JavaScript есть следующие основные типы
Тип описания
Неопределенное тип имеет только одно значение неопределенным, что является значением, когда переменная не назначена.
Тип Nullnull также имеет только одно значение NULL, это пустая ссылка на объект
Booleanboolean имеет два значения: true и false
Строка представляет текстовую информацию
Номер представляет собой цифровую информацию
Объект Это неупорядоченная коллекция серии свойств, включая функцию функции и массив массива
Невозможно судить о функции и массиве с помощью TypeOF. Здесь мы используем метод object.prototype.tostring.
[По умолчанию каждый объект будет наследовать от объекта в метод ToString (). Если этот метод не перезаписан (заблокирован) с помощью того же метода имени на самом объекте или более ближайшего верхнего прототипа, будет вызван метод ToString () объекта, а тип строки здесь представляет тип объекта] [1]
Тип функции (obj) {var toString = object.prototype.toString; var map = {'[object boolean]': 'boolean', '[object number]': 'number', '[объект строки]': 'string', '[object function]': 'function', 'array array]': 'array', '[объект date]': 'date', '[объект regexp]': 'regexp,', oversed] 'null', '[Object Object]': 'Object'}; вернуть карту [toString.call (obj)];}Реализовать DeepClone
Для числовых значений типов значений, не связанных с применением, значение присваивается напрямую, а для ссылочных типов значений (объект) вам необходимо снова пройти проезд и назначать рекурсивно.
function deepClone (data) {var t = type (data), o, i, ni; if (t === 'array') {o = []; } else if (t === 'Object') {o = {}; } else {return data; } if (t === 'array') {for (i = 0, ni = data.length; i <ni; i ++) {o.push (deabclone (data [i])); } return o; } else if (t === 'Object') {for (i in data) {o [i] = deepClone (data [i]); } return o; }}Здесь есть момент, на который каждый должен обратить внимание. Для типов функций блоггер напрямую назначает значения или делится значением памяти. Это связано с тем, что функции больше связаны с выполнением определенных функций, с входным значением и возвратом значения, а для сервисов высшего уровня они больше связаны с выполнением бизнес-функций, и нет необходимости действительно копировать функцию глубоко.
Но как скопировать тип функции?
На самом деле, блогер только думал об использовании нового для его управления, но функция будет выполнена один раз, и я не осмелюсь представить, каким будет результат выполнения! o (□) o! У меня еще нет хороших идей, пожалуйста, дайте мне руководство!
На этом этапе глубокая копия была почти завершена, но некоторые люди думают, что почему неглубокая копия не была реализована?
Мелкая копия?
Для мелких копий это можно понимать как эксплуатация только одной общей области памяти! Здесь будет опасность! (..*)
Если вы используете эти общие данные напрямую, не контролируя их, часто возникают исключения данных и изменяются другими частями. Следовательно, вы не должны напрямую эксплуатировать источник данных, инкапсулировать некоторые методы для выполнения операций с творчеством на данных.
Вероятно, здесь почти то же самое, но в качестве фронта, он рассматривает не только сам javaScript, но и DOM, браузер и т. Д.
Тип элемента
Давайте посмотрим на следующий код, что будет возвращено в результате?
Object.prototype.toString.call(document.getElementsByTagName('div')[0])
Ответ [объект htmldellement]
Иногда, когда элемент DOM сохраняется и если вы случайно копируете его глубоко, вышеупомянутой функции копирования не хватает суждения о элементе. Чтобы судить элемент элемента, используйте экземпляр для суждения. Поскольку для разных тегов ToString вернет конструктор, соответствующий различным тегам.
Тип функции (obj) {var toString = object.prototype.toString; var map = {'[object boolean]': 'boolean', '[object number]': 'number', '[объект строки]': 'string', '[object function]': 'function', 'array array]': 'array', '[объект date]': 'date', '[объект regexp]': 'regexp,', oversed] 'null', '[Object Object]': 'Object'}; if (obj exanceof element) {return 'element'; } return map [toString.call (obj)];}Другие способы?
Реализация jQuery
Для получения подробной информации см. Https: //github.com/jquery/jqu ...
Подчеркивая реализация
Для получения подробной информации, пожалуйста, см. Https: //github.com/jashkenas/...
Реализация Lodash
Для получения подробной информации, пожалуйста, см. Https: //github.com/lodash/lod ...
Реализация JSON
Вы можете реализовать глубокую копию, сначала пройдя json.stringify, а затем json.parse. Однако тип данных поддерживает только основные числовые типы.
var obj = {a: 'a', b: function () {console.log ('b')}} // Когда json.stringify, функция будет отфильтрована. Json.stringify (obj) // "{" a ":" a "}"краткое содержание
Здесь мы примерно суммируем глубокую копию и как реализовать глубокую копию. В разных сценариях необходимо определить, необходима ли глубокая копия на основе бизнес -сценария.