浅拷贝2(JSON.parse(JSON.stringify()))

最新推荐文章于 2024-08-14 11:36:11 发布

木森林哥哥

最新推荐文章于 2024-08-14 11:36:11 发布

阅读量371

点赞数

分类专栏：代码文章标签： json javascript 前端 ecmascript

本文链接：https://blog.csdn.net/weixin_47021982/article/details/126798371

版权

深拷贝 JSON.parse JSON.stringify 函数复制递归

关键词由CSDN通过智能技术生成

代码专栏收录该内容

32 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <!-- 博客地址：https://zhuanlan.zhihu.com/p/344258167 -->
    <script>
      var obj1 = {
        name: 'laowang',
        age: 18,
        hobby: ['唱', '跳', 'rap'],
        // 一般来说，JOSN.parse(JSON.stringify(obj1))只能对基本数据类型+obj+array进行深拷贝。
        // 不能对函数进行深拷贝，因为会忽略函数的拷贝。解决办法是进行递归操作。
        do: function () {
          console.log('我能做饭，也能吃饭')
        },
      }

      // JSON对象转JSON字符串(函数不能被转换)
      var obj1Str = JSON.stringify(obj1)
      console.log(obj1Str) // '{"name":"laowang","age":18,"hobby":["唱","跳","rap"]}'

      // JSON字符串转JSON对象
      var obj2 = JSON.parse(obj1Str)
      console.log(obj2) // {name: 'laowang', age: 18, hobby: Array(3)}

      // obj2中没有函数的拷贝(也就是说，obj2中是没有do方法的)
      console.log(obj1, obj2) // {name: 'laowang', age: 18, hobby: Array(3), do: ƒ} {name: 'laowang', age: 18, hobby: Array(3)}

      console.log(obj1 === obj2) // false
      console.log(obj1.hobby === obj2.hobby) // false
    </script>
  </body>
</html>