【JS ES6】了解Symbol类型

news2025/1/15 20:57:33

csdn动态图标

✍️ 作者简介: 前端新手学习中。

💂 作者主页: 作者主页查看更多前端教学

🎓 专栏分享:css重难点教学   Node.js教学 从头开始学习   ajax学习

目录

  • 声明定义Symbol的几种方式
  • 使用Symbol解决字符串耦合问题
  • 扩展特性与对象属性保护

声明定义Symbol的几种方式

Symbol类型具有唯一性。


let hd = Symbol();
let edu = Symbol();
console.log(hd == edu);//false

symbol类型是不能附加属性的,跟对象不一样。

hd.name = 'xiaoxie'
console.log(hd.name);//undefined

给创建的symbol变量添加描述

//添加描述
let hd = Symbol("坚毅的小解同志");
let edu = Symbol("csdn");
//获取描述
console.log(edu.description);//csdn
//添加描述第二种方法
//重复定义相同内容,指向的是同一个地址,不会产生新的占用  引用地址
let hd = Symbol.for("xiaoxie");
let edu = Symbol.for("xiaoxie");
console.log(hd == edu);//true
//获取描述
console.log(Symbol.keyFor(hd));//xiaoxie

使用Symbol解决字符串耦合问题

重复命名 后面的会把前面的覆盖替换掉。

let grade = {
    李四: { js: 100, css: 89 },
    李四: { js: 20, css: 50 },
}
console.log(grade);//{ '李四': { js: 20, css: 50 } }
//对象使用变量需要加上【】
let user1 = '李四';
let user2 = '李四';
let grade = {
    [user1]: { js: 100, css: 89 },
    user2: { js: 20, css: 50 },
}
console.log(grade);//{ '李四': { js: 100, css: 89 }, user2: { js: 20, css: 50 } }
let user1 = {
    name: "李四",
    key: Symbol('李四')
};
let user2 = {
    name: "李四",
    key: Symbol()
};
let grade = {
    [user1.key]: { js: 100, css: 89 },
    [user2.key]: { js: 20, css: 50 },
}
console.log(grade[user1.key]);//{ js: 100, css: 89 }
console.log(grade);//{ [Symbol(李四)]: { js: 100, css: 89 }, [Symbol()]: { js: 20, css: 50 } }

扩展特性与对象属性保护

循环遍历Symbol

//forin for of 遍历不到Symbol
for (const key in hd) {
    console.log(key);//name
}
for (const iterator of Object.keys(hd)) {
    console.log(iterator);//name
}

//便利Symbol类型
for (const iterator of Object.getOwnPropertySymbols(hd)) {
    console.log(iterator);//Symbol(这是一个Symbol类型)
}
//遍历对象中的所有属性
for (const iterator of Reflect.ownKeys(hd)) {
    console.log(iterator);//name
    //Symbol(这是一个Symbol类型)
}

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

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

相关文章

Qt5.6.1移植海思Hi3521d(三)

系列文章目录 Qt5.6.1移植海思Hi3521d(一) Qt5.6.1移植海思Hi3521d(二) 前言 本章讲解如何将编译好的qt程序移植到海思Hi3521D板子上,并且能够启动qt界面,和正常显示中文 一、移植qt库 创建qt.conf&#…

不再封控,各高校要如何开展教学

疫情政策逐步放开,石家庄、福州、广西等地各高校发布寒暑假和期末课程安排。 广西科技大学要求从2022年12月13日下午起,停止所有线下课程,未完成的教学任务启动线上教学。 在疫情这三年里,线上教学已经成为学校的主要教学手段&…

Python操作Excel

文章目录xlrd模块安装xlrd库打开Excel文件读取获取指定工作表操作指定行操作指定列操作指定单元格使用示例xlrd模块 xlrd是Python处理Excel表格数据的一个模块,能够对Excel中的数据进行读取。 安装xlrd库 在命令行或终端中输入以下命令进行安装: pip…

python数据分析 之 pandas数据统计

目录 一:数据集准备 二:加载文件 三:分组操作进行统计 一:数据集准备 可以创建一个txt,并放置pycharm工程目录下 下面是博主的数据集测试,所用数据,需要的自取 1001,Chinese,1,80 1001,Chine…

富芮坤蓝牙FR801xH开发环境搭建

富芮坤蓝牙FR801xH方案开发资源包网盘下载链接:网盘 提取码:30qu 搭建过程: 安装Keil开发工具:mdk525.exe 可以从Keil官网下载:http://www.keil.com/files/eval/MDK525.EXE 也可以使用网盘tools目录里的包装包 其中需要注意选择的…

Qt扫盲-QScrollArea理论总结

这里写目录标题1. 概述2. 滚动条策略3. 子控件4. 尺寸提示1. 概述 QScrollArea 用于显示滚动区域框架内的子控件的内容。如果控件超过框架的大小,视图可以提供滚动条,以便可以查看子控件的整个区域。子控件必须使用 setWidget() 指定。但是在 QDesigner…

【车载开发系列】UDS诊断---请求下载($0x34)

【车载开发系列】UDS诊断—请求下载($0x34) UDS诊断---请求下载($0x34)【车载开发系列】UDS诊断---请求下载($0x34)一.概念定义二.产生背景三.报文格式1)请求报文2)肯定响应3&#x…

[附源码]Nodejs计算机毕业设计基于的民宿租赁系统Express(程序+LW)

该项目含有源码、文档、程序、数据库、配套开发软件、软件安装教程。欢迎交流 项目运行 环境配置: Node.js Vscode Mysql5.7 HBuilderXNavicat11VueExpress。 项目技术: Express框架 Node.js Vue 等等组成,B/S模式 Vscode管理前后端分…

MySQL处理非结构化JSON数据(附 MyBatis-Plus 集成)

概述 MySQL 自5.7起开始支持JSON格式的非结构化数据,并且在8.x版本进行性能优化 关于 JSON JSON(JavaScript Object Notation, JS对象简谱)是一种轻量级的数据交换格式。它基于 ECMAScript(European Computer Manufacturers Asso…

Spring Cloud Alibaba

Spring Cloud Alibaba第五部分 第二代 Spring Cloud 核心组件(SCA)第 1 节 Nacos 服务注册和配置中心1.1 Nacos 介绍1.2 Nacos 单例服务部署1.3 微服务注册到Nacos1.4 负载均衡1.5 Nacos 数据模型(领域模型)1.6 Nacos 配置中心1.6…

智能家居DIY创意之智能灯泡

一、什么是智能灯 传统的灯泡是通过手动打开和关闭开关来工作。有时,它们可以通过声控、触控、红外等方式进行控制,或者带有调光开关,让用户调暗或调亮灯光。 智能灯泡内置有芯片和通信模块,可与手机、家庭智能助手、或其他智能…

水下潜航器的建模与控制

(线性系统理论大作业) 题目 水下潜器模型,可能是潜艇或者鱼雷等对象。一个主推进螺旋桨,前后两对水平陀翼,后面一对垂直陀翼。   潜器前进过程中,通过调节助推进螺旋桨推力,以及三对陀翼的角度变化,对潜…

paddle_gpu安装配置

paddle_gpu安装配置1.确认安装版本2. 安装相关文件2.1 下载与安装3.cuDNN下载及安装4.创建conda虚拟环境5.参考教程1.确认安装版本 操作系统:windows安装方式:condapython版本:python3.7CUDA版本:本人电脑版本【11.6.134】,低于此版本电脑都…

傻白入门芯片设计,盘点CPU业界的顶尖人才(十四)

这篇文章主要是针对现在CPU业界的顶尖人才,体现为以下几点:提出了革命性的技术路线,做出了杰出的产品,为公司做出重要贡献。按照当前供职情况,根据国际巨头所在公司分类,我主要收集了AMD,其余几…

【DevOps实战系列】第八章:详解Jenkins集成Docker私服Nexus3

个人亲自录制全套DevOps系列实战教程 :手把手教你玩转DevOps全栈技术 Jenkins集成Docker镜像仓库 docker私服已经搭建完毕,下边我们期望jenkins做的事是: ①通过git拉取代码②通过maven构建生成jar包③构建含有jar包的镜像④推送到docker仓库…

五问补盲(三) | 补盲激光雷达,敢不敢直面新的安全威胁?

作者 | 爱LiDAR的小飞哥 编辑 | 王博在激光雷达上车的热潮中,各家都在技术参数上进行着“你死我活”的拼杀。 那么,参数代表一切吗?举个例子,测距200米的激光雷达一定比测距150米的更好吗? 可以肯定地说,非…

JVM 之 AdaptiveSizePolicy 参数

AdaptiveSizePolicy 简介 AdaptiveSizePolicy(自适应大小策略) : JDK 1.8 默认使用 UseParallelGC 垃圾回收器,该垃圾回收器默认启动了 AdaptiveSizePolicy,会根据GC的情况自动计算计算 Eden、From 和 To 区的大小。 配置: 开启…

vue生命周期

vue的生命周期就是vue实例从创建到销毁的全过程,就是从开始创建、初始化数据、编译模版、挂载Dom、更新渲染、卸载等⼀系列过程,在这个过程中存在生命周期的钩子函数,我们可以在对应阶段添加实现自己的代码。 钩子函数(共8个&…

智慧物流|Springboot+Vue+Nodejs实现智慧物流系统

作者主页:编程指南针 作者简介:Java领域优质创作者、CSDN博客专家 、掘金特邀作者、多年架构师设计经验、腾讯课堂常驻讲师 主要内容:Java项目、毕业设计、简历模板、学习资料、面试题库、技术互助 收藏点赞不迷路 关注作者有好处 文末获取源…

Java如何读取输入

文章目录0.写在前面1.介绍2.举例3.写在最后0.写在前面 Java语言可以接收从键盘的输入,一般用来在调试的时候会用到,实际开发一般不用。 所以在此记录比较简单。 1.介绍 读取流程: 1.导入需要的工具包 2.构造一个“标准输入流”System.in关…