数组的增删改

1、新增一项
可以使用concat方法,它不会对原有数组进行改动,而是创建一个新数组

let a = [0, 1, 2]
let b = a.concat([3])
console.log(a, b)

2、删除一项
对于删除某一项的操作,splice也不能满足要求,因为该方法会改变原有数组,相应地我们应该使用slice,并结合es next 新特性。

let array = [1,2,3]
const removeIndex = (array, index) => {
return [
...array.slice(0, index),
...array.slice(index + 1),
]
}
let newArray = removeIndex(array, 1);

3、更新一项

let array = [1, 2, 3];
const updateIndex = (array, index, cb) => {
return [
...array.slice(0, index),
cb && cb(array[index]),
...array.slice(index + 1),
]
}
updateIndex(array, 1, function (data) {
return data + 1;
});

4、新增也可以使用这种思路,比concat要灵活

let array = [1, 2, 4];
const insertIndex = (array, index, value) => {
return [
...array.slice(0, index),
value,
...array.slice(array.length - 1),
]
}
insertIndex(array, 2, 3);

对象的增删改

1、更新一项

使用ES next新特性的 Object.assign 方法。

第一个参数必须是空对象,因为第一个参数会被改变(接受合并所有参数的值)
我们要更新的值必须放在最后面,因为参数越往后,权限越高。才能覆盖前者重复的内容

let sourceItem = {
id: 0,
book: 'Learn Redux',
avaliable: false
}
Object.assign({}, sourceItem, {
avaliable: true
})

2、对象操作:新增一项

其实和上面一样,写入新的键值对就算新增嘛

let sourceItem = {
id: 0,
book: 'Learn Redux',
avaliable: false
} Object.assign({}, sourceItem, {
fuck: 123
})

3、对象操作:删除一项

let sourceItem = {
id: 0,
book: 'Learn Redux',
avaliable: false,
fuck: 123
}
let newItem = Object.key(sourceItem).reduce((obj, key) => {
if (key !== 'fuck') {
return { ...obj, [key], sourceItem[key] }
}
return obj
}, {})

JavaScript 如何从引用类型(Array 、 Object)创建一个新的对象的更多相关文章

  1. Java中如何创建一个新的对象的/Creating Objects/

    The Java Tutorials have been written for JDK 8. Examples and practices described in this page don't ...

  2. JS——数组中push对象,覆盖问题,每次都创建一个新的对象

    今天写运动框架时,发现将对象push进数组,后面的值会覆盖前面的值,最后输出的都是最后一次的值.其实这一切都是引用数据类型惹的祸.       如果你也有类似问题,可以继续看下去哦.       下面 ...

  3. 什么是不可变对象(immutable object)?Java 中怎么 创建一个不可变对象?

    不可变对象指对象一旦被创建,状态就不能再改变.任何修改都会创建一个新的对象,如 String.Integer 及其它包装类. 详情参见答案,一步一步指导你在 Java中创建一个不可变的类.

  4. javascript学习笔记 - 引用类型 Array

    二 Array 1.可以通过length属性删除或创建新的数组项 arr = [1,2,3]; arr.length = 4;//增加 [1,2,3,undefined] arr.length = 2 ...

  5. 记一次oracle创建一个新数据库,并导入正式环境数据库备份的dmp包过程

    背景:正式环境oracle数据库定时用exp备份一个dmp包,现在打算在一台机器上创建一个新数据库,并导入这个dmp包. 1.创建数据库 开始 -> 所有程序 -> Oracle -> ...

  6. filter() 方法创建一个新数组

    filter快速过滤创建一个新数组 var new_array = arr.filter(callback(element[, index[, array]])[, thisArg]) 参数节 cal ...

  7. jquery创建一个新的节点对象(自定义结构/内容)的好方法

    jq创建一个新的节点对象,这对一些自定义功能很有帮助,而且可以随意控制对象的结构与内容,何乐而不为呢,看到这里,相信有些朋友已经按耐不住了,好记下来为大家介绍实现方法,感兴趣的朋友可以了解下哦 < ...

  8. linux内核分析作业6:分析Linux内核创建一个新进程的过程

    task_struct结构: struct task_struct {   volatile long state;进程状态  void *stack; 堆栈  pid_t pid; 进程标识符  u ...

  9. Step by Step 创建一个新的Dynamics CRM Organization

    原创地址:http://www.cnblogs.com/jfzhu/p/4012833.html 转载请注明出处 前面演示过如何安装Dynamics CRM 2013,参见<Step by st ...

随机推荐

  1. WCF服务引用之后自动生成的泛型代理类名称太长的解决方案

    问题:WCF服务引用之后会将原来的泛型类自动生成一个代理类,但是有时候名称太长怎么办? 解决方案: 1.方案一: 调用客户端同样也引用这个泛型类的类库. 2.方案二: 找到这个泛型类,然后在上面的[D ...

  2. 转:初探nginx架构(一)

    来源:http://tengine.taobao.org/book/chapter_02.html 众所周知,nginx性能高,而nginx的高性能与其架构是分不开的.那么nginx究竟是怎么样的呢? ...

  3. hibernate 02之helloworld

    1.安装插件 安装方法说明(hibernatetools-.Final): Help --> Install New Software... Click Add... In dialog Add ...

  4. sql assist字符匹配智能提示

  5. hadoop lzo应用

    几种压缩方式对比: LZO example: https://github.com/twitter/hadoop-lzo/blob/master/src/test/java/com/hadoop/ma ...

  6. Domino中使用JAVA代理

    Domino中使用JAVA代理一定要小心,特别是R5的版本. 1.及时地对所用到Notes Object(session,agentContext,db,view,document. 等等)进行Rec ...

  7. mybatis 于 hibernate区别

    两者区别是还是非常大的,结合至今为止的经验,总结出以下几点: 1. hibernate是全自动,而mybatis是半自动. hibernate完全可以通过对象关系模型实现对数据库的操作,拥有完整的Ja ...

  8. 解决FatalThrowableError in EloquentUserProvider.php line 126: Class '\App\User'问题

    解决方法:http://stackoverflow.com/questions/28516454/laravel-5-user-model-not-found 总结:是因为我把app下的User移动到 ...

  9. Windows下node.js安装及环境配置

    1. 安装 官网下载node.js的安装版,一路next,中间可以自定义安装路径 完成后安装目录内容如下 cmd下检查是否安装成功 新版Node.js已自带npm,所以安装Node.js时会一起安装, ...

  10. linux运维常见英文报错中文翻译(菜鸟必知)

    linux常见英文报错中文翻译(菜鸟必知) 1.command not found  命令没有找到 2.No such file or directory  没有这个文件或目录 3.Permissio ...