NPM 是前端开发中非常常用的包管理工具,而 set-or-get
是一个简单实用的 NPM 包,用于获取或设置对象的默认值。
安装 set-or-get
在使用 set-or-get 之前需要先安装它,简单地在终端中输入以下命令:
npm install --save set-or-get
使用 set-or-get
使用 setOrGet
方法可以用于获取对象属性的值,若该属性不存在,则会返回一个默认值。同时,若对象没有该属性,则会设置该属性并返回 defaultValue。
-- -------------------- ---- ------- ----- -------- - ---------------------- ----- --- - --- ------------- ------ ----------- --------------------- -- ------- ------------- ------ --------------- --------------------- -- ------- ------------- ------ --------------- --------------------- -- -----------
在上述示例中,首先会创建一个空对象 obj
,然后使用 setOrGet
方法获取对象属性 foo
的值。由于该属性不存在,因此会返回默认值 default
,并将该值设置为 obj.foo
。接下来再使用 setOrGet
获取 foo
属性的值,但这次使用的是另一个默认值 new-default
,由于该属性已经存在,因此返回值为 default
。最后使用 setOrGet
设置 bar
属性的值,并获取该属性的值,会返回设置的默认值 new-default
。
深入理解
当一个 JavaScript 对象中有很多嵌套的属性时,使用 setOrGet
方法可以大大减少代码量。同时,setOrGet
方法能够防止你因为没有设置或取得一个对象属性而产生一些意想不到的错误。接下来,我们来举个例子。
假设我们有一个存储一些用户信息的对象,其中包含了用户姓名、年龄、电话等各种信息。我们知道,JavaScript 中使用 .
运算符可以获取对象中属性的值。
const user = { name: 'John Doe', age: 25, phone: '122-333-4444', }; console.log(user.name); // John Doe
但是,如果我们需要获取嵌套在一个对象里的属性的值,就需要使用多个点运算符,比如 user.address.street
。当对象中的某个属性不存在时,我们需要将其替换为默认值。
console.log(user.address ? user.address.street : 'Unknown'); // Unknown
这里,我们使用了一个三目运算符,检查了对象中是否存在 address
属性。若存在,则返回其 street
属性;否则返回 'Unknown'。当然,在 JavaScript 中有很多种方法去优化这段代码,但是 setOrGet
方法可以为你解决这个让人头痛的问题。
const setOrGet = require('set-or-get'); console.log(setOrGet(user, 'address.street', 'Unknown'));
在这个示例中,我们使用 setOrGet
方法获取 user.address.street
属性的值,若该属性不存在,则返回 'Unknown'。当试图在不存在 address
属性的对象上访问 street
属性时,setOrGet
方法会自动为我们设置 address
属性并返回默认值 'Unknown'。
指导意义
在使用 set-or-get 包之前,你需要了解 JavaScript 中对象如何工作,以及如何从中查询值。
使用 setOrGet
方法可以减少代码量,同时避免了因为忘了写代码而引起的异常错误。在项目开发过程中,这些可能是很令人头痛的问题。了解如何使用 setOrGet
方法可以使你的项目开发变得更加高效且易于理解。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/73997