JavaScript如何删除属性及其值

JavaScript如何删除属性及其值

在JavaScript中,可以使用delete操作符来删除对象的属性及其值。delete操作符会从对象中移除指定的属性,如果删除成功,返回true;如果属性不存在或无法删除,返回false

示例代码

javascript 复制代码
let obj = {
    name: "Alice",
    age: 25,
    city: "New York"
};

// 删除 'age' 属性
delete obj.age;

console.log(obj); // 输出: { name: "Alice", city: "New York" }

// 尝试删除不存在的属性
let result = delete obj.gender;
console.log(result); // 输出: true (即使属性不存在,delete 也会返回 true)

// 删除成功
result = delete obj.city;
console.log(result); // 输出: true
console.log(obj); // 输出: { name: "Alice" }

注意事项

  1. 不可配置的属性 :如果属性是不可配置的(即configurablefalse),delete操作符无法删除该属性,并且会返回false

    javascript 复制代码
    let obj = {};
    Object.defineProperty(obj, 'name', {
        value: 'Alice',
        configurable: false
    });
    
    let result = delete obj.name;
    console.log(result); // 输出: false
    console.log(obj.name); // 输出: "Alice"
  2. 全局变量和函数delete操作符不能删除使用varletconst声明的变量或函数。

    javascript 复制代码
    var x = 10;
    console.log(delete x); // 输出: false
    
    function foo() {}
    console.log(delete foo); // 输出: false
  3. 数组元素 :虽然可以使用delete删除数组元素,但这会在数组中留下一个undefined的空位,而不会改变数组的长度。

    javascript 复制代码
    let arr = [1, 2, 3];
    delete arr[1];
    console.log(arr); // 输出: [1, undefined, 3]
    console.log(arr.length); // 输出: 3

总结

  • delete操作符用于删除对象的属性。
  • 如果属性不存在或无法删除,delete会返回true
  • delete不能删除使用varletconst声明的变量或函数。
  • 删除数组元素会留下undefined的空位,不会改变数组长度。

更多vue相关插件及后台管理模板可访问vue admin reference,代码详情请访问github

相关推荐
互联网搬砖老肖7 分钟前
Web 架构之会话保持深度解析
前端·架构
m0_5139625311 分钟前
vue-ganttastic甘特图label标签横向滚动固定方法
javascript·vue.js·甘特图
菜鸟una14 分钟前
【taro3 + vue3 + webpack4】在微信小程序中的请求封装及使用
前端·vue.js·微信小程序·小程序·typescript·taro
hao_041325 分钟前
elpis-core: 基于 Koa 实现 web 服务引擎架构设计解析
前端
码农黛兮_461 小时前
HTML、CSS 和 JavaScript 基础知识点
javascript·css·html
狂野小青年1 小时前
npm 报错 gyp verb `which` failed Error: not found: python2 解决方案
前端·npm·node.js
鲁鲁5171 小时前
Windows 环境下安装 Node 和 npm
前端·npm·node.js
跑调却靠谱1 小时前
elementUI调整滚动条高度后与固定列冲突问题解决
前端·vue.js·elementui
呵呵哒( ̄▽ ̄)"2 小时前
React - 编写选择礼物组件
前端·javascript·react.js
Coding的叶子2 小时前
React Flow 简介:构建交互式流程图的最佳工具
前端·react.js·流程图·fgai·react agent