首页 > 其他分享 >少见但非常好用的js写法技巧。

少见但非常好用的js写法技巧。

时间:2024-01-11 15:11:25浏览次数:27  
标签:flatMap const name structuredClone js clonedObj obj 写法 好用

1. 使用 flatMap

数组方法 flatMap() 本质上是 map()和 flat() 的组合,区别在于 flatMap 只能扁平1级,flat 可以指定需要扁平的级数,flatmap 比分别调用这两个方法稍微高效一些。

const arr = [1, 2, [4, 5], 6, 7, [8]] ;

console.log(arr.flatMap((element) => element)); 
// output :[1, 2, 4, 5, 6, 7, 8]

2. 深拷贝 structuredClone()

经常需要依赖第三方库来实现或者手动实现一个神拷贝,或者采取 const cloneObj = JSON.parse(JSON.stringify(obj)); 的 hack, 但其在处理包含循环引用不符合 JSON 的数据类型(如 Map 和 Set,Blob 等 ) 的更复杂对象时,是有很多不足之处的 而现在,JavaScript 内置了一个 structuredClone() 的方法, 此方法提供了一种简单有效的方法来深度克隆对象, 且适用于大多数现代浏览器和 Node.js v17 以上
// 将原始对象传递给该函数, 它将返回一个具有不同引用和对象属性引用的深层副本

const obj = { name: 'Mike', friends: [{ name: 'Sam' }] };
const clonedObj = structuredClone(obj);

console.log(obj.name === clonedObj); // false
console.log(obj.friends === clonedObj.friends); // false

 

标签:flatMap,const,name,structuredClone,js,clonedObj,obj,写法,好用
From: https://www.cnblogs.com/L-hailong/p/17958622

相关文章

  • 未经授权访问 .js
    流程顺序:后台管理登陆地址→后台主页地址→fuzz测试出用户管理列表接口→直接调接口。。全程黑盒。那么接下来我逆着来推理下逻辑:首先是拿到某后台管理登录的网址 接着查看html源码,发现首页地址,http://xxx/index直接访问,访问302,然后大哥来......
  • 设备制造行业中,CRM系统有哪些功能比较好用?
    近些年,制造业和别的行业一样,经历过翻天覆地的转型。从以分销为基础到客户至上,所有行业都在确定商业模式的全局性变化。在这样的环境下,不管什么规模的设备制造企业都意识到将创新与技术融进业务流程的必要性。CRM管理系统是促进这一转型的核心技术之一,并在其中彰显了主导地位。让......
  • 如何构建一个 NodeJS 影院微服务并使用 Docker 部署
    如何构建一个NodeJS影院微服务并使用Docker部署前言如何构建一个NodeJS影院微服务并使用Docker部署。在这个系列中,将构建一个NodeJS微服务,并使用DockerSwarm集群进行部署。以下是将要使用的工具:NodeJS版本7.2.0MongoDB3.4.1DockerforMac1.12.6在尝试......
  • js 垃圾回收机制
    一、概述垃圾回收机制是为了防止内存的泄漏(已经不需要的某一块内存还一直存在着),垃圾回收机制就是不停歇的寻找这些不再使用的变量,并且释放掉他所指向的内存。2、变量的生命周期变量被声明、赋值(修改)、读取、不需要时释放,是变量的生命周期。js中的变量分为局部变量和全局变量。......
  • nextjs14连接MySQL
     第一步npminstallmysql2第二步新建一个db.js db.jsimportmysqlfrom"mysql2/promise";exportasyncfunctionquery({query,values=[]}){constdbconnection=awaitmysql.createPool({host:process.env.MYSQL_HOST,post:process.env.MY......
  • js Number类型
    Number是对应数值的引用类型。要创建一个Number对象,就使用Number构造函数并传入一个数值,如下例所示:letnumberObject=newNumber(10);与Boolean类型一样,Number类型重写了valueOf()、toLocaleString()和toString()方法。valueOf()方法返回Number对象表示的原始数值......
  • js Number类型
    与Boolean对象类似,Number对象也为数值提供了重要能力。但是,考虑到两者存在同样的潜在问题,因此并不建议直接实例化Number对象。在处理原始数值和引用数值时,typeof和instacnceof操作符会返回不同的结果,如下所示:letnumberObject=newNumber(10);letnumberValue=1......
  • js String类型
    String是对应字符串的引用类型。要创建一个String对象,使用String构造函数并传入一个数值,如下例所示:letstringObject=newString("helloworld");String对象的方法可以在所有字符串原始值上调用。3个继承的方法valueOf()、toLocaleString()和toString()都返回对象的......
  • js 字符串处理函数
    length、charAt()、charCodeAt()和fromCharCode()返回的结果都跟预期是一样的。这是因为在这个范围内,每个字符都是用16位表示的,而这几个方法也都基于16位码元完成操作。只要字符编码大小与码元大小一一对应,这些方法就能如期工作。这个对应关系在扩展到Unicode增补字符平面......
  • ImageClipboard js粘贴剪切板图片,已测试,可用,可获得base64
    ImageClipboardjs粘贴剪切板图片,已测试,可用,可获得base64具体用到自己项目的时候,拿源码改成自己的库,从写一遍3个小问题onpaste执行了两遍,一次是图片加载完成,一次是加载图片之前。按说应该搞两个事件来分别调用pasteCatcher应该是作为一个保底实现,我也没看明白是怎么获取剪......