Javascript数组研究09_Array.prototype[Symbol.unscopables]
Symbol.unscopables
是 JavaScript 中一个相对较新的符号(Symbol),用于控制对象属性在 with
语句中的可见性。它主要用于内置对象,如 Array.prototype
,以防止某些方法被引入到 with
语句的作用域中,避免潜在的命名冲突和意外覆盖。
Symbol.unscopables 简介
-
符号(Symbol):
- 在 ECMAScript 6 中引入,符号是一种新的基本数据类型,用于创建独一无二的标识符。
-
Symbol.unscopables
:- 是一个内置符号,用于定义哪些属性在使用
with
语句时 不会 被引入到作用域中。 - 它的值通常是一个对象,属性名对应要排除的属性,属性值为
true
表示该属性在with
语句中不可见。
-Array.prototype[Symbol.unscopables]
的属性特性
- 是一个内置符号,用于定义哪些属性在使用
属性特性 | 是/否 |
---|---|
可写 | 否 |
可枚举 | 否 |
可配置 | 是 |
- 原型是
null
:- 因此不会意外地使
Object.prototype
属性(比如toString
)变为非作用域属性,而令在with
语句中调用数组的toString()
方法仍然有效。
- 因此不会意外地使
为什么需要 Symbol.unscopables
-
with
语句的作用:with
语句用于将一个对象的属性作为当前作用域的变量。这在某些情况下可以简化代码,但也可能导致命名冲突和调试困难。
const obj = { a: 1, b: 2 }; with (obj) {console.log(a); // 1console.log(b); // 2 }
-
潜在问题:
- 当对象拥有与当前作用域中已有变量相同名称的属性时,会导致意外覆盖。
- 为了解决这个问题,JavaScript 提供了
Symbol.unscopables
,允许对象指定哪些属性在with
语句中不可见。
Array.prototype[Symbol.unscopables] 的工作原理
-
内置排除:
- 为了防止数组方法(如
keys
,values
,entries
等)在with
语句中引起冲突,Array.prototype
定义了Symbol.unscopables
属性。
- 为了防止数组方法(如
-
示例:
console.log(Array.prototype[Symbol.unscopables]); // 输出: // { // copyWithin: true, // entries: true, // fill: true, // find: true, // findIndex: true, // includes: true, // keys: true, // values: true // }
- 这意味着在
with (array)
语句中,这些方法不会被自动引入到作用域中。
- 这意味着在
-
目的:
- 确保在使用
with
语句时,数组的方法不会覆盖作用域中已有的变量或函数,避免命名冲突。
- 确保在使用
使用 Symbol.unscopables 的示例
示例 1:默认行为
const array = [1, 2, 3];with (array) {console.log(length); // 3console.log(keys); // ReferenceError: keys is not defined
}
- 解释:
length
是数组的一个属性,没有被排除,因此可以在with
语句中直接访问。keys
是数组的方法,并被Symbol.unscopables
排除,因此在with
语句中不可见,导致ReferenceError
。
示例 2:自定义对象使用 Symbol.unscopables
假设您有一个自定义对象,并希望在 with
语句中排除某些属性:
const myObject = {a: 10,b: 20,c: 30,[Symbol.unscopables]: {b: true}
};with (myObject) {console.log(a); // 10console.log(b); // ReferenceError: b is not definedconsole.log(c); // 30
}
- 解释:
- 属性
b
被Symbol.unscopables
排除,因此在with
语句中无法访问,导致ReferenceError
。 - 属性
a
和c
没有被排除,可以正常访问。
- 属性
示例 3:实现自定义 unscopables
const myArray = [1, 2, 3];// 自定义方法
myArray.customMethod = function() {return 'custom';
};// 定义 unscopables
myArray[Symbol.unscopables] = {customMethod: true
};with (myArray) {console.log(customMethod); // ReferenceError: customMethod is not defined
}
- 解释:
- 尽管
myArray
拥有customMethod
,但通过Symbol.unscopables
排除了该方法在with
语句中的可见性。
- 尽管
注意事项
-
with
语句的局限性:with
语句在严格模式下是禁止的,因为它会导致作用域链的不明确和潜在的性能问题。
'use strict'; const obj = { a: 1 }; with (obj) { // SyntaxError: Strict mode code may not include a with statementconsole.log(a); }
-
类数组对象的 unscopables:
- 像
Array.prototype
这样的内置对象通常会定义Symbol.unscopables
,确保其方法不会在with
语句中意外引入,从而保持代码的健壮性。
- 像
总结
Symbol.unscopables
是一个用于控制对象属性在 with
语句中可见性的符号属性。它允许对象明确指定哪些属性在使用 with
语句时应被排除,防止命名冲突和意外覆盖。尽管 with
语句在现代 JavaScript 开发中不推荐使用,理解 Symbol.unscopables
有助于深入了解 JavaScript 语言的设计和内置对象的行为。
如果您正在开发需要处理作用域链或动态属性访问的高级功能,了解并合理使用 Symbol.unscopables
将是有益的。然而,对于大多数日常开发任务,遵循明确的作用域管理和避免使用 with
语句是更好的选择。
相关文章:
Javascript数组研究09_Array.prototype[Symbol.unscopables]
Symbol.unscopables 是 JavaScript 中一个相对较新的符号(Symbol),用于控制对象属性在 with 语句中的可见性。它主要用于内置对象,如 Array.prototype,以防止某些方法被引入到 with 语句的作用域中,避免潜在…...

SkyWalking 自定义链路追踪
对项目中的业务方法,实现链路追踪,方便我们排查问题 引入依赖 <!‐‐ SkyWalking 工具类 ‐‐> <dependency> <groupId>org.apache.skywalking</groupId> <artifactId>apm‐toolkit‐trace</artifactId> <vers…...

Linux驱动开发(速记版)--设备模型
第八十章 设备模型基本框架-kobject 和 kset 80.1 什么是设备模型 设备模型使Linux内核处理复杂设备更高效。 字符设备驱动适用于简单设备,但对于电源管理和热插拔,不够灵活。 设备模型允许开发人员以高级方式描述硬件及关系,提供API处理设备…...

动手学深度学习(李沐)PyTorch 第 6 章 卷积神经网络
李宏毅-卷积神经网络CNN 如果使用全连接层:第一层的weight就有3*10^7个 观察 1:检测模式不需要整张图像 很多重要的pattern只要看小范围即可 简化1:感受野 根据观察1 可以做第1个简化,卷积神经网络会设定一个区域,…...

新编英语语法教程
新编英语语法教程 1. 新编英语语法教程 (第 6 版) 学生用书1.1. 目录1.2. 电子课件 References A New English Grammar Coursebook 新编英语语法教程 (第 6 版) 学生用书新编英语语法教程 (第 6 版) 教师用书 1. 新编英语语法教程 (第 6 版) 学生用书 https://erp.sflep.cn/…...
Golang 服务器虚拟化应用案例
推荐学习文档 golang应用级os框架,欢迎stargolang应用级os框架使用案例,欢迎star案例:基于golang开发的一款超有个性的旅游计划app经历golang实战大纲golang优秀开发常用开源库汇总想学习更多golang知识,这里有免费的golang学习笔…...
Elasticsearch基础_4.ES搜索功能
文章目录 一、搜索辅助功能1.1、指定返回的字段1.2、结果计数1.3、结果分页 二、搜索匹配功能2.1、查询所有文档2.2、term级别查询2.2.1、term查询2.2.2、terms查询2.2.3、range查询2.2.4、exists查询 2.3、布尔查询2.3.1、must,should,must_not2.3.2、f…...

Elasticsearch要点简记
Elasticsearch要点简记 1、ES概述2、基础概念(1)索引、文档、字段(2)映射(3)DSL 3、架构原理4、索引字段的数据类型5、ES的三种分页方式(1)深度分页(fromsize)…...
【通信协议】IIC通信协议详解
IIC(Inter-Integrated Circuit)通信协议,又称为I2C(Inter-Integrated Circuit 2)协议,是一种广泛使用的串行通信协议。它由Philips Semiconductor(现NXP Semiconductors)开发&#x…...
2024年中国科技核心期刊目录(社会科学卷)
2024年中国科技核心期刊目录 (社会科学卷) 序号 期刊代码 期刊名称 1 SC02 JOURNAL OF S…...
用Python集成免费IP归属地查询API
IP查询的优势是什么? IP查询是一种强大的工具,能够快速提供关于IP地址的信息,如地理位置、互联网服务提供商(ISP)、连接类型等。这些数据在多种场景下都非常有用,帮助用户理解网络环境和用户行为。 首先&…...
C 数组
C 数组 数组是C语言中的一种基本数据结构,用于存储一系列相同类型的数据。它是连续的内存分配,允许通过索引快速访问元素。本文将详细介绍C数组的概念、使用方法、以及注意事项。 1. 数组的概念 数组是一个集合,可以存储一定数量的元素。在…...

【Unity】unity安卓打包参数(个人复习向/有不足之处欢迎指出/侵删)
1.Texture Compression 纹理压缩 设置发布后的纹理压缩格式 Use Player Settings:使用在播放器设置中设置的纹理压缩格式 ETC:使用ETC格式(兼容) ETC2:使用ETC2格式(很多设备不支持) ASTC:使用…...

C0016.Clion中qDebug()打印输出中文时,都是问号??????的解决办法
问题描述 在clion中使用qDebug打印输出中文内容时,都是?????如下图: 注意:修改该文件的编码格式就行,该文件名为apr.cpp; 解决办法...
C++ priority_queue 优先队列构造大根堆和小根堆
priority_queue的三个参数 template <class T, class Container std::vector<T>, class Compare std::less<typename Container::value_type>> class priority_queue;1、元素类型 2、底层容器类型,默认vector 3、比较函数(传入的是…...

音视频入门基础:FLV专题(9)——Script Tag简介
一、SCRIPTDATA 根据《video_file_format_spec_v10_1.pdf》第75页到76页,如果某个Tag的Tag header中的TagType值为18,表示该Tag为Script Tag(脚本Tag,又称Data Tag、SCRIPTDATA tag)。这时如果Filter的值不为1表示未加…...
Vue页面,基础配置
最简单页面 日期范围及字符搜索,监听器处理日期范围搜索控件清空重置问题导出、导出文件文件名称带日期时间表格日期指定格式显示。。。 <template><div class"app-container"><el-form :model"queryParams" ref"queryForm…...

(杨辉三角) 攻防世界--->notsequence
学习笔记。(不想看可以直接跳正文。) 前言:仿佛又回到高中 - - 只不过,是以另一种形式再次出现。 学习思维为主,做题位次。(后面再补。) 前置知识: 什么是杨辉三角: 杨辉三角_百度百科 (bai…...

【CTF Web】Pikachu CSRF(get) Writeup(CSRF+GET请求+社会工程学)
CSRF(跨站请求伪造)概述 Cross-site request forgery 简称为“CSRF”,在CSRF的攻击场景中攻击者会伪造一个请求(这个请求一般是一个链接),然后欺骗目标用户进行点击,用户一旦点击了这个请求,整个攻击就完成…...
智能工厂的软件设计 作为“程序Program”的中台 之2
Q11、现在,我们再重新理解一下前面所说:三种中台(数据中台、技术中台和业务中台)作为这个整体的三个整子Holon,合起来是一个 融合了三分法( 三分部 的三个中台构成三段式 程序框架,分别用 <h…...

微信小程序之bind和catch
这两个呢,都是绑定事件用的,具体使用有些小区别。 官方文档: 事件冒泡处理不同 bind:绑定的事件会向上冒泡,即触发当前组件的事件后,还会继续触发父组件的相同事件。例如,有一个子视图绑定了b…...
ssc377d修改flash分区大小
1、flash的分区默认分配16M、 / # df -h Filesystem Size Used Available Use% Mounted on /dev/root 1.9M 1.9M 0 100% / /dev/mtdblock4 3.0M...
React Native在HarmonyOS 5.0阅读类应用开发中的实践
一、技术选型背景 随着HarmonyOS 5.0对Web兼容层的增强,React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 二、核心实现方案 1. 环境配置 (1)使用React Native…...
多模态商品数据接口:融合图像、语音与文字的下一代商品详情体验
一、多模态商品数据接口的技术架构 (一)多模态数据融合引擎 跨模态语义对齐 通过Transformer架构实现图像、语音、文字的语义关联。例如,当用户上传一张“蓝色连衣裙”的图片时,接口可自动提取图像中的颜色(RGB值&…...

如何将联系人从 iPhone 转移到 Android
从 iPhone 换到 Android 手机时,你可能需要保留重要的数据,例如通讯录。好在,将通讯录从 iPhone 转移到 Android 手机非常简单,你可以从本文中学习 6 种可靠的方法,确保随时保持连接,不错过任何信息。 第 1…...

新能源汽车智慧充电桩管理方案:新能源充电桩散热问题及消防安全监管方案
随着新能源汽车的快速普及,充电桩作为核心配套设施,其安全性与可靠性备受关注。然而,在高温、高负荷运行环境下,充电桩的散热问题与消防安全隐患日益凸显,成为制约行业发展的关键瓶颈。 如何通过智慧化管理手段优化散…...
【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张(Windows/Linux)
要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况,可以通过以下几种方式模拟或触发: 1. 增加CPU负载 运行大量计算密集型任务,例如: 使用多线程循环执行复杂计算(如数学运算、加密解密等)。运行图…...
IP如何挑?2025年海外专线IP如何购买?
你花了时间和预算买了IP,结果IP质量不佳,项目效率低下不说,还可能带来莫名的网络问题,是不是太闹心了?尤其是在面对海外专线IP时,到底怎么才能买到适合自己的呢?所以,挑IP绝对是个技…...

Linux 内存管理实战精讲:核心原理与面试常考点全解析
Linux 内存管理实战精讲:核心原理与面试常考点全解析 Linux 内核内存管理是系统设计中最复杂但也最核心的模块之一。它不仅支撑着虚拟内存机制、物理内存分配、进程隔离与资源复用,还直接决定系统运行的性能与稳定性。无论你是嵌入式开发者、内核调试工…...

处理vxe-table 表尾数据是单独一个接口,表格tableData数据更新后,需要点击两下,表尾才是正确的
修改bug思路: 分别把 tabledata 和 表尾相关数据 console.log() 发现 更新数据先后顺序不对 settimeout延迟查询表格接口 ——测试可行 升级↑:async await 等接口返回后再开始下一个接口查询 ________________________________________________________…...