Javascript 中的一些好用的方法

JavaSript中冷门但有用的方法

在JavaScript中,有一些冷门但强大且有用的数据结构用法。这些用法可能在日常开发中不太常见,但在特定情况下可以提供更优雅的解决方案。

WeakMap 和 WeakSet:

  • WeakMapWeakSet 是弱引用版本的 MapSet。它们对于存储对象引用并允许垃圾回收非常有用。在这些集合中,对象是弱引用的,这意味着如果没有其他引用,它们将被垃圾回收。
javascript 复制代码
const weakMap = new WeakMap();
const key = { id: 1 };
weakMap.set(key, 'value');

#Proxy 对象:

  • Proxy 对象允许拦截并自定义对象上的操作,包括属性查找、赋值、删除等。这使得你可以实现元编程,即编写可以操作其他代码行为的代码。
javascript 复制代码
const handler = {
  get: function(target, prop) {
    return prop in target ? target[prop] : 'Not found';
  }
};

const proxyObj = new Proxy({ name: 'John' }, handler);
console.log(proxyObj.name); // 输出: 'John'
console.log(proxyObj.age);  // 输出: 'Not found'

Symbol 和 Symbol.iterator:

  • Symbol 是一种新的基本数据类型,它创建一个独一无二的值。它与迭代器一起使用时,可以使对象可迭代。
javascript 复制代码
const mySymbol = Symbol('mySymbol');
const obj = { [mySymbol]: 'Hello' };

for (const key in obj) {
  console.log(key); // 无输出,因为 Symbol 不可枚举
}

const iterator = obj[Symbol.iterator]();
console.log(iterator.next().value); // 输出: 'Hello'

Array Buffer 和 Typed Arrays:

  • ArrayBuffer 和 Typed Arrays 允许你直接处理二进制数据,对于处理像图像、音频等复杂数据非常有用。
javascript 复制代码
const buffer = new ArrayBuffer(8);
const view = new Int32Array(buffer);
view[0] = 42;
console.log(view[0]); // 输出: 42

Promise.race() 和 Promise.allSettled():

  • Promise.race() 返回一旦任意一个 promise 解决或拒绝就立即解决或拒绝。Promise.allSettled() 在所有给定的 promise 解决或拒绝后解决,返回一个包含每个 promise 结果的数组。
javascript 复制代码
const promise1 = new Promise(resolve => setTimeout(resolve, 1000, 'One'));
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 500, 'Two'));

Promise.race([promise1, promise2])
  .then(result => console.log(result)) // 输出: 'Two'

Promise.allSettled([promise1, promise2])
  .then(results => console.log(results))
  // 输出: [{status: 'fulfilled', value: 'One'}, {status: 'rejected', reason: 'Two'}]

URLSearchParams:

  • URLSearchParams 对象用于处理 URL 查询参数。它提供了一组方法,使你能够方便地解析和构造 URL 查询参数。
javascript 复制代码
const urlParams = new URLSearchParams('key1=value1&key2=value2');
console.log(urlParams.get('key1')); // 输出: 'value1'

BigInt:

  • BigInt 是 JavaScript 中表示任意精度整数的新类型。它对处理超出 Number 类型范围的整数非常有用。
javascript 复制代码
const bigIntValue = BigInt(Number.MAX_SAFE_INTEGER) + BigInt(1);
console.log(bigIntValue.toString()); // 输出: '9007199254740992'

Intl 对象:

  • Intl 对象提供了对国际化(Internationalization)功能的支持,包括日期、时间、数字和货币的格式化。
javascript 复制代码
const number = 1234567.89;
const formattedNumber = new Intl.NumberFormat('en-US').format(number);
console.log(formattedNumber); // 输出: '1,234,567.89'

Array.flat() 和 Array.flatMap():

  • flat() 方法用于将嵌套数组展平一层,而 flatMap() 可以在映射后再展平。
javascript 复制代码
const nestedArray = [1, [2, [3, [4]]]];
const flatArray = nestedArray.flat(2);
console.log(flatArray); // 输出: [1, 2, 3, [4]]

const mappedFlatArray = nestedArray.flatMap(value => value * 2);
console.log(mappedFlatArray); // 输出: [2, 4, 6, 8]

Object.seal() 和 Object.freeze():

  • Object.seal(obj) 用于封闭一个对象,阻止添加新属性并将所有当前属性标记为不可配置。Object.freeze(obj) 则冻结一个对象,阻止添加、删除或更改对象的属性。
javascript 复制代码
const sealedObject = Object.seal({ key: 'value' });
sealedObject.newKey = 'newValue'; // 不起作用,因为对象被封闭

const frozenObject = Object.freeze({ key: 'value' });
frozenObject.newKey = 'newValue'; // 不起作用,因为对象被冻结
相关推荐
BillKu7 分钟前
el-input 中 select 方法使用报错:属性“select”在类型“HTMLElement”上不存在
前端·javascript·vue.js·elementui
涵信12 分钟前
第一节:React 基础篇-React虚拟DOM原理及Diff算法优化策略
前端·javascript·react.js
uhakadotcom16 分钟前
NVIDIA Resiliency Extension(NVRx)简介:提高AI模型训练的容错能力
算法·面试
uhakadotcom20 分钟前
了解Agent2Agent(A2A)协议:实现AI智能体间的无缝通信
后端·面试·github
DataFunTalk37 分钟前
复旦肖仰华:大模型的数据科学!
前端·后端·算法
橙序研工坊43 分钟前
JavaWeb-01-前端Web开发(HTML+CSS)
java·前端·css·html·javaweb
uhakadotcom1 小时前
在Google中高效搜索Figma和Canva资源的最佳实践
后端·面试·github
DataFunTalk1 小时前
重大突破!MCP加持下text-to-sql的关键技术进展
前端·后端
碳烤小咸鱼1 小时前
蓝桥杯 Web 方向入门指南:从基础到实战
前端·javascript·css·蓝桥杯
inksci1 小时前
低代码控件开发平台:飞帆中粘贴富文本的控件
前端·javascript·低代码