delete 语法的本质深入解析

 更新时间:2023年03月02日 09:15:08   作者:云牧  
这篇文章主要为大家介绍了delete 语法的本质深入解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

delete 的返回值

delete 语法是用于 JS 删除对象属性和数组元素

返回 boolean 类型

true 代表删除没有发生异常,但不一定是删除成功

false 一定是删除失败

var obj = {
  a: 1,
  b: 2
};
// 删除对象属性
console.log(delete obj.a); // true
// 删除对象不存在的属性
console.log(delete obj.name); // true
// 删除全局对象 obj ,因为 var 声明默认会挂载到全局 window 对象上
console.log(delete obj); // false
console.log(obj); // { b: 2 }

delete 不能删除哪些属性

  • 任何用 var 声明的属性,不能从全局或函数作用域删除
  • 任何用 let 或者 const 声明的属性 ,不能从它声明的作用域删除
  • 不可配置(configurable: false)的属性不能删除
// var
function testVar() {
  var a = 1;
  console.log(delete a); // false
  console.log(a); // 1
}
testVar();
// let const
function testLet() {
  let a = 2;
  console.log(delete a); // false
  console.log(a); // 2
}
testLet();
// configurable
const obj = {};
Object.defineProperty(obj, "name", { configurable: false });
console.log(delete obj.name); // false
console.log("delete undefined", delete undefined);
console.log(Object.getOwnPropertyDescriptor(global, "undefined"));
console.log("delete Infinity", delete Infinity);
console.log("delete NaN", delete NaN);

delete 删除原型上的属性

  • 不会遍历原型链删除
function User() {
  this.name = "云牧";
}
User.prototype.name = "黛玉";
const p = new User();
// 删除的是 p 对象的自身属性
console.log(delete p.name); // true
// p.name 依然可用,因为原型链可以查找到 name
console.log(p.name); // 黛玉
// 删除原型上的属性
console.log(delete User.prototype.name); // true
// 实例和原型上都没有 name
console.log(p.name); // undefined

delete 删除的到底是什么

  • 删除的是操作表达式结果
  • 对于值,字面量或不可达的引用,不操作,直接返回 true
  • 引用类型,删除引用
var nameVar = "nameVar";
nameNotVar = "nameNotVar";
// var 声明的不可以删除
console.log(Object.getOwnPropertyDescriptor(window, "nameVar")); // configurable: false
// 非 var 声明的可以删除
console.log(Object.getOwnPropertyDescriptor(window, "nameNotVar")); // configurable: true

严格模式删除报错

  • 对于 变量,函数名,函数参数SyntaxError
  • 对于 configurable: falseTypeError
  • 典型的 delete super.property :ReferenceError

下面是错误的例子:

"use strict";
// 变量
var name = "name";
delete name;
// 函数和函数参数
function fn() {}
delete fn;
function fn(name) {
  delete name;
}
fm();
// configurableTypeError
const person = {
  name: "帅哥"
};
Object.defineProperty(person, "name", {
  configurable: false
});
delete person.name;
// 严格 refer
class Parent {
  constructor(name) {
    this.name = name;
  }
  getName() {}
}
class Child extends Parent {
  constructor(name, age) {
    super(name);
    this.age = age;
  }
  deleteAny() {
    delete super.getName;
  }
}
var child = new Child("child", 18);
child.deleteAny();

以上就是delete 语法的本质深入解析的详细内容,更多关于delete 语法解析的资料请关注脚本之家其它相关文章!

相关文章

  • Skypack布局前端基建实现过程详解

    Skypack布局前端基建实现过程详解

    这篇文章主要为大家介绍了Skypack布局前端基建过程详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • 浅谈js中的宏任务和微任务

    浅谈js中的宏任务和微任务

    这篇文章我们主要谈一谈js中的宏任务和微任务,JavaScript是一门单线程语言,即一次只能完成一个任务,若有多个任务要执行,则必须排队按照队列来执行,下面我们就来简单谈谈JavaScript吧,需要的朋友可以参考下面文章内容的具体内容
    2021-09-09
  • rollup打包引发对JS模块循环引用思考

    rollup打包引发对JS模块循环引用思考

    这篇文章主要为大家介绍了rollup打包引发的对JS模块循环引用的思考,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • JavaScript中MutationObServer监听DOM元素详情

    JavaScript中MutationObServer监听DOM元素详情

    这篇文章主要给大家分享的是 JavaScript中MutationObServer监听DOM元素详情,DOM的MutationObServer接口,可以在DOM被修改时异步执行回调函数,我的理解就是可以监听DOM修改。下面来看看文章的详细内容,需要的朋友可以参考一下
    2021-11-11
  • JavaScript原型Prototype详情

    JavaScript原型Prototype详情

    这篇文章主要介绍了JavaScript原型Prototype,在JavaScript中,函数是一个包含属性和方法的Function类型的对象。而原型(Prototype )就是Function类型对象的一个属性。具体内容需要的朋友可以参考下面文章的介绍
    2021-12-12
  • 微信小程序 弹幕功能简单实例

    微信小程序 弹幕功能简单实例

    这篇文章主要介绍了微信小程序 弹幕功能简单实例的相关资料,需要的朋友可以参考下
    2017-02-02
  • 微信小程序 用户数据解密详细介绍

    微信小程序 用户数据解密详细介绍

    这篇文章主要介绍了微信小程序 用户数据解密详细介绍的相关资料,需要的朋友可以参考下
    2017-01-01
  • Hardhat进行合约测试环境准备及方法详解

    Hardhat进行合约测试环境准备及方法详解

    这篇文章主要为大家介绍了Hardhat进行合约测试环境准备及方法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • 微信小程序 (三)tabBar底部导航详细介绍

    微信小程序 (三)tabBar底部导航详细介绍

    这篇文章主要介绍了微信小程序 (三)tabBar底部导航详细介绍的相关资料,需要的朋友可以参考下
    2016-09-09
  • quickjs 封装 JavaScript 沙箱详情

    quickjs 封装 JavaScript 沙箱详情

    这篇文章主要介绍了 quickjs 封装 JavaScript 沙箱,在前文 JavaScript 沙箱探索 中声明了沙箱的接口,并且给出了一些简单的执行任意第三方 js 脚本的代码,但并未实现完整的 IJavaScriptShadowbox,下面便讲一下如何基于 quickjs 实现,需要的朋友可以参考一下
    2021-10-10

最新评论