js中如何优雅修改一个多层嵌套list对象的值

如何优雅更改一个N层嵌套对象属性的值

看下边的代码，要加工一个嵌套list的属性值，然后再赋值回去，大概只能这样写：

dp.data.treelist = dp.data.treelist.map(...)

由于对象嵌套比较深（有可能N层），每次赋值都需要重复这个嵌套过程（dp.data.treelis）两次
而我们希望的是，调用和赋值，可以（至少看起来）一次完成
我们可以利用对象中的 this 指向（父级），减少引用对象层级，实现复用

var obj = {list:{data:[1,2,3],update:function(){//注意，this指向父级，而不是最外层对象this.data = this.data.map(function(x){return x * x;})}}
}
obj.list.update()
console.log(obj);//{ "list": { "data": [ 1, 4, 9 ] } }

上边的方法有两个副作用
一是，在纯数据对象中，塞入了 update 这个操作方法
二是，同时，update 方法也无法在其它对象中使用
所以，我们可以把这种模式的对象抽象出来，做为一个公共的类

//假设有一个List类，接收一个list的核心属性，其它传入的属性也通过 others 自动添加
function List(list,others){this.list = list;for(key in others){this[key] = others[key];}
}
//支持简单赋值
List.prototype.setList = function(newList){this.list = newList;
}
//支持map赋值，赋值的方法可以添加很多种，最好使用参数多态，而不是合为一个方法
List.prototype.mapSetList = function(fn){this.list = this.list.map(fn);
}
//obj.data属性值就是一个 List 对象，该对象也支持继续嵌套，还是比较直观的
var obj = {data:new List([1,2,3,4,5],{count:100,code:2,user:{name:"zk"}})
}obj.data.setList([5,6,7,8,9]);
obj.data.mapSetList(x=>x*x);
console.log(obj);
//{ "data": { "list": [ 25, 36, 49, 64, 81 ], "count": 100, "code": 2, "user": { "name": "zk" } } }

如此一来，我们就拥有了一个功能丰富且可扩展的 List 对象
这使得嵌套层级较深的 list 类的属性赋值变得更加简洁明了，更符合函数式编程的习惯
而且 list 实例的方法继续自类的原型，在数据对象中不会被显式的遍历，保证了数据的纯洁性

js中如何优雅修改一个多层嵌套list对象的值相关推荐

js 中使用idx模块方便获取链条式的对象属性值
1. 背景从一个js对象的属性值中的属性再次获得值,或者从集合中获得元素再获得属性值要写很多判断是否空的表达式,才能继续读取,否则就出现异常.这在开发过程很繁琐的事情,idx 模块就是来解决这个问题 ...
JS中，如何判断一个被转换的数是否是NaN
var x="abc";//isNaN()函数判断是否是NaNif (isNaN(parseInt(x))) {alert("非数字");} else{aler ...
后处理程序文件大小的变量_【每日一题】(17题)面试官问：JS中事件流，事件处理程序，事件对象的理解？...
关注「松宝写代码」,精选好文,每日一题作者:saucxs | songEagle 2020,实「鼠」不易 2021,「牛」转乾坤风劲潮涌当扬帆,任重道远须奋蹄! 一.前言 2020.12.23 立 ...
递归实现对多层嵌套的对象数组依照某属性进行排序
<script>//开发中如果需要对多层嵌套的对象数组依照某个属性进行排序,可以使用递归的方法实现//比如需要对数组里面每一层的importSum属性值进行排序const arr = [{ ...
JS中for语句的循环的嵌套
今天说一下JS中for语句的循环嵌套. for语句是JS中十分重要的循环语法. for(表达式1;表达式2;表达式3){for(表达式4;表达式5;表达式6){执行语句块儿}} 这是嵌套写法的基本结构 ...
Java树形转扁平_多层嵌套map对象转扁平化map
将深度嵌套的map对象转换为扁平化的map对象输出. import org.apache.commons.lang3.StringUtils; import java.util.HashMap; im ...
js中如何优雅的写if判断
我们编写js代码时经常遇到复杂逻辑判断的情况,通常大家可以用if/else或者switch来实现多个条件判断,但这样会有个问题,随着逻辑复杂度的增加,代码中的if/else/switch会变得越来越臃 ...
js中如何优雅的解析数据
自从有了前后端分离,一些后端小伙伴给出的数据结构也来越混乱了.以为分离减轻了他们的负担接口的质量会非常高但是人的惰性却体现的很"完美". 由于js是若类型的语言,所以在使用数据的时 ...
在Node.js中使用express开启一个web服务器并定义简单中间件函数的使用
//1.导入express const express = require('express') //2.创建web服务器 const app = express() //利用use()函数定义全局中 ...

js中如何优雅修改一个多层嵌套list对象的值

如何优雅更改一个N层嵌套对象属性的值

js中如何优雅修改一个多层嵌套list对象的值相关推荐

最新文章

热门文章