js 如何删除对象里的某个属性

 更新时间:2022年09月15日 10:49:39   作者:言小溪  
这篇文章主要介绍了js 如何删除对象里的某个属性,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

如何删除对象里的某个属性

删除属性有很多方法,学到了就在这里记录一下。

有一个对象 a 。有2个属性 b=1 , c=2 删除b,保留 c

1.使用delete

let a = {b:1,c:2}
delete a.b//true
console.log(a)//{c:2}

2.使用解构

let a = {b:1,c:2}
let {b,...a} = a
console.log(a)//{c:2}

3.使用反射

let a = {b:1,c:2}
Reflect.deleteProperty(a,"b");
console.log(a)//{c:2}

添加、修改、删除对象的属性和方法

在其他语言中,对象一旦生成,就不可更改,要为一个对象添加修改成员必须要在对应的类中修改,并重新实例化,而且程序必须经过重新编译。

JavaScript 中却非如此,它提供了灵活的机制来修改对象的行为,可以动态添加、修改、删除属性和方法。

例如首先使用类Object来创建一个空对象user:

var user = new Object();

1.添加属性

这时user对象没有任何属性和方法,可以为它动态地添加属性

user.name = 'Amy';
user.age = 10;
user.address = "cn";

通过上述语句,user 对象便具有了三个属性:name、age和address, 打印输出user如下:

2.添加方法

添加方法地过程和添加属性地方法类似:

user.call = function() {
    console.log('Hello, My name is '+ this.name);
}

这就为user 对象添加了一个方法“call”,通过执行它,可以在打印台显示自己的名字介绍

console.log(user);user.call();

打印结果如下:

3.修改属性

修改一个属性的过程就是用新的属性替换旧的属性,例如:

user.name = 'Rose';
user.call = function() {
    console.log('Hello, this is '+ this.name);
}

这样就修改了user 对象name属性的值和call方法

4.删除属性

删除一个属性的过程也很简单,就是将其置为undefined :

user.name=undefined;
user.call=undefined;

这样就删除了name属性和call方法,在之后的代码中,这些属性变的不可用

注:在添加、修改或者删除属性时,和引用属性相同,也可以采用方括号([])语法: user[“name”]=”tom”;

使用这种方式还有一个额外的特点,就是可以使用非标识符字符串作为属性名称,例如:

标识符中不允许以数字开头或者出现空格,但在方括号([])语法中却可以使用: user[“my name”]=”tom”;

需要注意,在使用这种非标识符作为名称的属性时,仍然要用方括号语法来引用: alert(user[“my name”]);

而不能写为: alert(user.my name);

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 微信小程序视频弹幕位置随机

    微信小程序视频弹幕位置随机

    这篇文章主要介绍了微信小程序视频弹幕位置随机,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04
  • JavaScript实现将图片地址转成文件流并上传

    JavaScript实现将图片地址转成文件流并上传

    这篇文章主要为大家详细介绍了如何使用JavaScript实现将图片地址转成文件流并上传,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-04-04
  • Bootstrap 附加导航(Affix)插件实例详解

    Bootstrap 附加导航(Affix)插件实例详解

    附加导航(Affix)插件允许某个 <div> 固定在页面的某个位置。接下来通过本文给大家介绍Bootstrap 附加导航(Affix)插件实例详解,感兴趣的朋友一起看看吧
    2016-06-06
  • JavaScript显示表单内元素数量的方法

    JavaScript显示表单内元素数量的方法

    这篇文章主要介绍了JavaScript显示表单内元素数量的方法,涉及javascript操作表单属性的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-04-04
  • js实现盒子移动动画效果

    js实现盒子移动动画效果

    这篇文章主要为大家详细介绍了js实现盒子移动动画效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • 在Windows上安装Node.js模块的方法

    在Windows上安装Node.js模块的方法

    Node.js逐渐升温,很多朋友已经开始关注。但是在Windows平台上需要基于Cygwin安装配置环境,让很多人望而却步。
    2011-09-09
  • javascript打造跨浏览器事件处理机制[Blue-Dream出品]

    javascript打造跨浏览器事件处理机制[Blue-Dream出品]

    由于浏览器兼容的复杂性.打造一个较优的跨浏览器事件处理函数.不是件容易的事情.各大类库也都通过了种种方案去抽象一个庞大的事件机制.
    2010-07-07
  • 犀利的js 函数集合

    犀利的js 函数集合

    和同事讨论js时,我说较为理想的状态是,把js当一把好用的匕首,随手拿来,捅一刀子就走。话虽如此,但现实生活中大部分时候的情况是不理想的。
    2009-06-06
  • Webpack4+Babel7+ES6兼容IE8的实现

    Webpack4+Babel7+ES6兼容IE8的实现

    这篇文章主要介绍了Webpack4+Babel7+ES6兼容IE8的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • 微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例

    微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例

    这篇文章主要介绍了微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能,涉及微信小程序事件响应、页面元素属性动态操作实现滑动与蒙层功能相关技巧与注意事项,需要的朋友可以参考下
    2018-12-12

最新评论