美文网首页
React中使用Immutable

React中使用Immutable

作者: LTA | 来源:发表于2018-07-06 20:45 被阅读0次
    • 前言
      在JS中因为使用了引用复制,所以其对象是可变的(Mutable),新的对象只是简单的引用原始的对象,改变心的对象将影响到原来的对象。引用对象的优点是可以节省内存,但当应用复杂之后就会照常非常大的隐患。此时我们通常的做法是使用shallowCopy或者deepCopy来避免对象别修改,这样做造成了CPU和内存的浪费。所Immutable出现了。
    • Immutable基础知识
      Immutable的特点是,一但被创建就不能被修改。对immutable对象的修改都将返回一个新的immutable对象。三大特征: 持久化数据结构、结构共享、惰性操作
      优点:
      1、Immutable降低了Mutable带来的复杂度
       function touchAndLog(touchFn) {
          let data = { key: 'value' };
          touchFn(data);
          console.log(data.key); // 猜猜会打印什么?
       }
      
      在不查看 touchFn 的代码的情况下,因为不确定它对 data 做了什么,你是不可能知道会打印什么(这 不是废话吗)。但如果 data 是 Immutable 的呢,你可以很肯定的知道打印的是 value。
      2、节省内存
      Immutable使用的结构共享会尽可能复用内存
      let a = immutable.Map({name: 'lta', userId: '890425'})
      let b = a.set('name', 'xtt')
      a === b //false
      a.get('name') === b.get('name')  // false
      a.get('userId') === b.get('userId')  // true
      
      在上面的代码中a和b共享了没有变化的节点userId
      缺点:
      1、需要学习新的API
      2、增加了资源文件的大小
      3、容易与原生对象混淆

    相关文章

      网友评论

          本文标题:React中使用Immutable

          本文链接:https://www.haomeiwen.com/subject/bylbuftx.html