[置顶] React update插件中 splice指令的理解

标签: reactupdatesplicenpm
144人阅读 评论(0) 收藏 举报
分类:

在看《React开发实战》一书中,其提到了React的update的指令,其可以对一个对象进行深度复制和修改,那为什么要update指令,因为我们知道,在javascript的世界中,对象是传的引用而不是值,当一个复杂的对象里面又嵌套了子对象的时候,如果把当前的对象做一个深度的复制,其实还是蛮复杂的,所以React中,其提供了一个帮助类库:update
其可以通过下面的方法进行安装:

 npm install --save react-addons-update

其提供了下面的命令,具体可参看 这篇文章

  • $push: array
  • $unshift: array
  • $splice: array
  • $set: any
  • $merge: object
  • $apply: function

对其他的都很好理解,但是对splice命令,当时没有太理解。
比如,

let initialArray=[1,2,'a'];
let newArray=update(initialArray,{$splice:[[2,1,3,4]});

输出结果为: [1,2,3,4] ,那为什么是这个结果呢?
那么我来看看splice命令的格式,

Use .splice to remove item from array. Using delete, indexes of the array will not be altered but the value of specific index will be undefined,The splice() method changes the content of an array by removing existing elements and/or adding new elements.

Syntax: array.splice(start, deleteCount[, item1[, item2[, ...]]])

let newArray=update(initialArray,{$splice:[[2,1,3,4]});

可以解释为,从第2个下标开始,删除一个元素,‘a’,然后把后面的3,4加入到后面。这样就成了 [1,2,3,4] 。

在看一个栗子,

let people = ["Bob", "Sally", "Jack"]
let toRemove = 'Bob';
let index = people.indexOf(toRemove);
people.splice(index, 1);
console.log(people);
1
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:385906次
    • 积分:6347
    • 等级:
    • 排名:第4081名
    • 原创:228篇
    • 转载:0篇
    • 译文:5篇
    • 评论:157条
    博客专栏