前端 JS 经典:如何实现私有字段

前言:方法有很多,但是我们需要择优选择。

1. 命名规范

我们可以通过命名规范实现私有字段,如:下划线

缺点:没有强约束力,我们用了也就用了

class A {_key = 1;
}const a = new A();
a._key; // 1

2. Symbol

使用 Symbol,类里用动态属性来设置。

缺点:没有强约束力,也能直接访问到。

const key = Symbol("key");
class A {[key] = 1;m() {return this[key];}
}const a = new A();
a[key]; // 1

3. TS 的 private

使用 TS 的 private。当我们访问属性时,会报一个编译错误。

缺点:这种检查只在编译时态,在运行时态是没错的。可以通过动态属性,绕过编译时态,一样可以拿到 key。

class A {private key = 1;
}const a = new A();
a.key; // error

4. ES 的新特性

使用 ES 新特性 #,再去访问#key 就会报错了,无论是编译时,还是运行时。但是因为是新出来的,有兼容性问题。

class A {#key = 1;m() {return this.#key;}
}

5. WeakMap

将一个类的私有属性都放在 map 里边。为什么要用 WeakMap ? 避免影响垃圾回收。然后将整个类放到一个模块里,只导出类,那么在外部,就只能通过方法 m() 拿到私有属性了。

const privateFields = new WeakMap();export class A {constructor() {privateFields.set(this, { key: 1 });}m() {return privateFields.get(this).key;}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/23125.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

深入探讨5种单例模式

文章目录 一、对比总览详细解释 二、代码1. 饿汉式2. 饱汉式3. 饱汉式-双检锁4. 静态内部类5. 枚举单例 三、性能对比 一、对比总览 以下是不同单例模式实现方式的特性对比表格。表格从线程安全性、延迟加载、实现复杂度、反序列化安全性、防反射攻击性等多个方面进行考量。 …

必应bing国内广告怎样开户投放呢?

企业都在寻找高效、精准的营销渠道以扩大品牌影响力,提升市场占有率,作为全球第二大搜索引擎,微软旗下的必应Bing凭借其卓越的搜索技术和庞大的用户基础,成为了众多企业拓展市场的首选广告平台。在中国,必应Bing广告以…

Day33

Day33 SQL-续 数据类型 tinyint、int、unsigned、float、double、decimal、char、varchar、BLOB、LONGBLOB、TEXT、LONGTEXT、date、time、datetime、timestamp、year # 数据类型# 整数类型 ------------------------------------------------------------- # tinyint - 1字节…

vuInhub靶场实战系列-DC-6实战

免责声明 本文档仅供学习和研究使用,请勿使用文中的技术源码用于非法用途,任何人造成的任何负面影响,与本人无关。 目录 免责声明前言一、环境配置二、信息收集2.1 主机发现2.1.1 nmap扫描存活主机2.1.2 arp-scan扫描存活主机 2.2 端口扫描2.3 指纹识别2.3.1 尝试指纹识别2.3.…

【LC刷题】DAY01:704. 二分查找、27. 移除元素

【LC刷题】DAY01:704. 二分查找、27. 移除元素 文章目录 【LC刷题】DAY01:704. 二分查找、27. 移除元素704. 二分查找 [link](https://leetcode.cn/problems/binary-search/description/)第一思路:优化思路 27. 移除元素 [link](https://leet…

解决Mac无法上网/网络异常的方法,重置网络

解放方法 1、前往文件夹:/Library/Preferences/SystemConfiguration 2 、在弹窗中输入上边的地址 3 、把文件夹中除了下图未选中的文件全部删掉,删除时需要输入密码 4 、重启mac 电脑就搞定了。

python的一种集成开发工具:PyCharm开发工具

一. 简介 本文简单了解两种 python语言所使用的 集成开发环境: PyCharm、vscode。 python语言学习中,可以任意选中这两个集成开发环境的一种就可以。本文先来简单学习 PyCharm开发工具安装与使用。 二. python的一种集成开发工具:PyChar…

【LeetCode】40. 组合总和 II

组合总和 II 题目描述: 给定一个候选人编号的集合 candidates 和一个目标数 target ,找出 candidates 中所有可以使数字和为 target 的组合。 candidates 中的每个数字在每个组合中只能使用 一次 。 注意:解集不能包含重复的组合。 示例…

数据更新后Ant Design Table组件界面未刷新怎么解决?

在使用Ant Design的Table组件时,我们时常需要动态更新表格数据以满足应用需求。然而,有时即使数据已经更新,界面却没有进行相应的刷新。这种情况可能由多种因素导致,其中之一就是关于key属性的使用问题。本文将重点讨论key属性在解…

Nginx的https功能

一.HTTPS功能简介 Web网站的登录页面都是使用https加密传输的,加密数据以保障数据的安全,HTTPS能够加密信息,以免敏感信息被第三方获取,所以很多银行网站或电子邮箱等等安全级别较高的服务都会采用HTTPS协议,HTTPS其实…

Springboot框架开发与实用篇之热部署 2024详解

开发与实用 手动启动热部署 热部署(Hot Deployment)指的是在应用程序正在运行的情况下,对其进行更新或修改并将这些变更应用到正在运行的应用程序中的过程。通常情况下,传统的部署方式需要停止应用程序、部署更新,然…

基于51单片机的智能晾衣架设计资料

第三章:硬件单元电路 经过上述分析明确了本次设计的主要目标,为了实现晾衣自身能够完成对外界数据的采集与分析,集成控制环节我们采用了ATMEL公司生产的AT89C52单片机,与市面上的其他嵌入式控制单元相比较在体积与功耗方面都相当出色。此次设计主要突破在于设计合理的控制电…

最短路问题

最短路问题是图论里非常经典的一个考点 接下来着重讲述五种求最短路的算法:朴素版dijkstra算法、堆优化版的dijkstra算法、bellman-ford算法、spfa算法、floyd算法 总体思维导图: 总体思路: 最短路分为两大类 { 在以下给出的时间复杂度中n…

学习笔记——路由网络基础——静态路由(static)

三、静态路由(static) 1、静态路由 (1)定义 静态路由(Static):由管理员手动配置和维护的路由。静态路由配置简单,被广泛应用于网络中。此外还可以实现负载均衡和路由备份。 静态路由默认优先级为60,如果想在多条静态路由中让某条路由优选…

网络运维:现代IT架构的守护者

网络运维:现代IT架构的守护者 在数字化浪潮席卷全球的今天,网络运维已不再是简单的技术术语,而是每一个追求高效、稳定运营的企业和组织必须重视的关键环节。本文将探讨网络运维的重要性,以及它在现代IT架构中所扮演的不可或缺的…

YOLOX源码之 Label Assignment

网络结构没什么好讲的,backbone、neck、head组成,backbone采用的cspdarknet,neck采用的pafpn,head是decoupled head结构。这里主要讲一下label assignment的具体实现,yolox中采用了simota,是ota的简化版本。…

uniapp小程序开发 | 从零实现一款影视类app (后台接口实现,go-zero微服务的使用)

uniapp小程序开发实战系列,完整介绍从零实现一款影视类小程序。包含小程序前端和后台接口的全部完整实现。系列连载中,喜欢的可以点击收藏。 该篇着重介绍获取轮播图后台接口和获取正在热映电影的两个后台接口的实现。 后台服务使用golang,…

MySQL—多表查询—自连接

一、引言 自连接,顾名思义就是自己连接自己。 自连接的语法结构: 表 A 别名 A join 表 A 别名 B ON 条件 ...; 注意: 1、这种语法有一个关键字:join 2、自连接查询可以是内连接的语法,可以是外连接的语法&#xff08…

【游戏】Goc赚钱模拟器1.0版

Hello!大家好,我是学霸小羊,今天分享一个Goc游戏。 //注:以下代码为Goc原创代码。 大家可以在下面网址写入代码www.51goc.com慧通教育http://www.51goc.com注:Goc编辑器路径: www.51goc.com ➡ 登录 ➡ 游客登陆 ➡…

Three.js加入到可视化大屏,看看能否惊艳到你?

three.js 在可视化大屏上可以实现各种三维场景和动画效果,可以根据具体需求进行定制化开发,并结合其他技术,如数据可视化、交互设计等,实现更加丰富的可视化效果。 three.js 是一个基于 WebGL 的 JavaScript 3D 库,可…