JS教程之如何在 JavaScript 中添加、更新和删除 JSON 数组 - CRUD
2023-09-11 14:18:47 时间
这是使用数组中每个对象的唯一标识符在 Javascript 中对 JSON 对象数组执行 CRUD 操作的快速参考。
我们将使用以下 JSON 数组。
let jsonArr = [
{
"id": 1,
"name": "Zahid",
"county": "pakistan"
},
{
"id": 2,
"name": "John",
"country": "USA"
},
{
"id": 3,
"name": "Parkash",
"country": "india"
}
]
创建 - 添加到 JSON 数组
这很简单
jsonArr.push({id: 4, name: 'Charith', country: 'sri lanka'})
Read - 通过 Id 获取项目
jsonArr.find(i => i.id === 4)
Update - 按 Id 更新项目
jsonArr.find(i=>i.id===2).country='UK'
Delete - 按 Id 删除项目
要删除上述 JSON 数组的特定项目(在我们的例子中,通过 id),这里是代码
jsonArr.splice(jsonArr.findIndex(i => i.id === 3), 1)
您也可以使用过滤器
jsonArr = jsonArr.filter(i => i.id !== 3)
相关文章
- 教程 | face-api.js:在浏览器中进行人脸识别的JavaScript接口
- Html Table用JS导出excel格式问题 导出EXCEL后单元格里的000412341234会变成412341234 7-14 会变成 2018-7-14(7月14) 自定义格式 web利用table表格生成excel格式问题 js导出excel增加表头、mso-number-format定义数据格式 数字输出格式转换 mso-number-format:"@"
- 第七节:语法总结(1)(自动属性、out参数、对象初始化器、var和dynamic等) 图片放大镜 JavaScript-基础 用javascript写原生ajax(笔记) 初遇 Asp.net MVC 数据库依赖缓存那些事儿 前端JS 与 后台C# 之间JSON序列化与反序列化(笔记)
- Javascript将字符串日期格式化为yyyy-mm-dd的方法 js number 类型 没有length 属性 string类型才有
- js_JavaScript中有六种值为“假”
- 通过jS(javascript)获取到WEB地址传参!
- JavaScript - 判断当前时间是否在指定区间内,例如:9:00~12:00(检查当前时间是否处于规定的两个时间段范围内),适用于 vue.js / uniapp / 微信小程序等前端项目
- JavaScript正则表达式大全
- JS访问数据库[非Node.js]
- 【JavaScript】HTML5存储方案
- JavaScript学习之路-为什么要学习JavaScript语法
- Javascript Design Patterns - Js Class
- Idea的js文件报错:Import declarations are not supported by current JavaScript version
- 《WebGL入门指南》——第2章,第2.1节Three.js——一个JavaScript 3D引擎
- JS教程之Electron.js设计强大的多平台桌面应用程序的好工具
- JS教程之如何从 JavaScript 日期中添加或删除日期
- JS教程之什么是 JavaScript 闭包?
- 前后端加密解密 【JS加密模块(md5 、 crypto 、 crypto-js、jsencrypt) python RSA加密解密(pycryptodome )模块安装与使用】
- 推荐4款高星星JS库:canvas库-Fabric.js、JavaScript客户端文件上传库-FilePond、客户端保存文件解决方案-FileSaver、JavaScript在线解压 ZIP 文件-JSZip
- 【Laya + TS + JS】SheetJS(js-xlsx)前端生成Excel表格
- 华为OD机试 -满足规则的数组组合(JavaScript) | 机试题+算法思路+考点+代码解析 【2023】
- 【web前端(三十二)】javascript_外部js脚本文件
- 下载 ArcGIS Javascript 引用的字体 pbf 文件,并离线部署
- javascript 的继承
- 基于JavaScript的幸运大转盘
- JavaScript经典实例之分页(简单易用)原生js封装分页(一次性数据)
- 深入理解JavaScript系列(50):Function模式(下篇)