es6 symbol 用于去除魔术字符串

最新推荐文章于 2023-05-09 11:37:45 发布
最新推荐文章于 2023-05-09 11:37:45 发布
阅读量199 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44917015/article/details/114443284
版权 
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            float: left;
            border: 1px solid;
            width: 100px;
            height: 100px;
            background-color: rgba(155, 212, 123, .5);
        }
    </style>
</head>

<body>
    <div>run</div>
    <div>walk</div>
    <div>play</div>
    <script>
        // 第七种类型 symbol类型 唯一类型
        // let a = Symbol();
        // let b = Symbol();
        //用于定义比对 

        //例子
        // const RUN = 'run';
        const RUN = Symbol();
        const WALK = Symbol();
        const PLAY = Symbol();
        // 具有唯一性
        
        // 去除魔术字符串 唯一性
        let state = '';
        var divs = Array.from(document.querySelectorAll('div'))
        // console.log(divs)
        divs.forEach(item => {
            item.addEventListener('click', clickHandler)
        })
        function clickHandler(e) {
            var index = divs.indexOf(this)
            state = index === 0 ? RUN : (index == 1 ? WALK : PLAY)
        }
        function animation() {
            switch (state) {
                case RUN:
                    console.log("run132132");
                    break;
                case WALK:
                    console.log("walk123123");
                    break;
                case PLAY:
                    console.log("play123132");
                    break;
            }
        }
        // 你会发现常量中RUN WALK PLAY 中定义的内容不重要 只要唯一 用于辨识就好了 这个时候 使用symbol就非常合适了
        setInterval(animation, 1000);
    </script>
</body>

</html>
SpringYoungYu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ES6 Symbol函数,消除魔术字符串, Symbol.for和Symbol.keyFor
yangyang_A的博客
05-14 870
文章目录Symbol函数1.0 概述2.0 Symbol.prototype.description3.0 作为对象的属性名的 Symbol4.0 Symbol 实现消除魔术字符串5.0 属性名的遍历6.0 Symbol.for(), Symbol.keyFor()总结 Symbol函数 1.0 概述 ES5的对象属性名都是字符串, 这容易造成属性名冲突. 比如你使用了别人提供的对象, 但又想为这个对象添加新的方法.(minxin)模式, 新方法的名字就有可能与现有方法产生冲突. 如果有一种机制, 保证每
ES6学习笔记——Symbol（）
hsy_hhh的博客
08-17 540
Symbol创建的是一个独一无二的值，没有具体的表现形式，但是通过typeof看到他的数据类型为symbol。 Symbol函数可以接受参数，表示对于这个唯一值的描述。 每一个 Symbol 值都是不相等的，这意味着 Symbol 值可以作为标识符，用于对象的属性名，就能保证不会出现同名的属性。这对于一个对象由多个模块构成的情况非常有用，能防止某一个键被不小心改写或覆盖。 let sy1 = Symbol('sy1'); let sy2 = Symbol('sy2'); console.log(
ES6 入门教程 13 Symbol 13.4 实例：消除魔术字符串 & 13.5 属性名的遍历
谢谢你们的关注
11-19 245
ES6 入门教程 13 Symbol 13.4 实例：消除魔术字符串 & 13.5 属性名的遍历
es6 实例：消除魔术字符串
歪脖先生的博客
01-25 3179
实例：消除魔术字符串 魔术字符串指的是，在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码，应该尽量消除魔术字符串，改由含义清晰的变量代替。 function getArea(shape, options) { let area = 0; switch (shape) { case 'Triangle': // 魔术字符串 area = .
消除魔法字符串
qq_42651173的博客
06-09 278
魔法字符串：指的是，在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或数值。风格良好的代码，应该尽量消除魔法字符串，而由含义清晰的变量代替。
ES6学习03-- Symbol数据类型及其应用
weixin_53027472的博客
09-15 258
ES6 Symbol类型值使用和应用
ES6之Symbol
weixin_42934446的博客
03-25 278
1.概述 数据类型，表示独一无二的值，返回Symbol类型值； Symbol可转为字符串，转为布尔值、不能转为数值。 let sym = Symbol('My sym'); console.log(String(sym)); //Symbol(My sym) console.log(sym.toString()); //Symbol(My sym) console.log(Boolean(sym)); //true 2.Symbol.proto
ES6学习笔记11--Symbol数据类型
zcy8023u的博客
01-14 219
概述： Symbol 数据类型是一种类似于字符串的数据类型,用来表示独一无二的值。 凡是属性名属于Symbol 类型,可以保证不会与其他属性名产生冲突。 Symbol 函数不能使用 new 命令，且可以接受一个字符串作为参数，表示对 Symbol 实例的描述。 相同参数的Symbol 函数的返回值是不相等的。且Symbol 值不能与其他类型的值进行运算。 Symbol 值也可以转为布尔值，但是不能转为数值。 let s = Symbol(); let s1 = Symbol('s1'..
代码重构-消除魔术字符串
baidu_30907803的博客
06-28 238
魔术字符串是指：在代码指中多次出现，与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码，应该尽量消除魔术字符串，改成含义清晰的变量代替。 function getArea(shape, options) { ... switch (shape){ case 'Triangle': { // 魔术字符串，出现一次 ..... break; }， .... } } getArea('Tri
Symbol实例消除魔术字符串
GXing007的博客
03-15 1134
魔术字符串是指：在代码中多次出现，与代码形成强耦合的某一具体字符串或者数值。风格良好的代码应该尽量消除魔术字符串，改由含义清晰的变量代替。function getArea(shape, options) { let area = 0; switch (shape) { case 'Triangle': // 魔术字符串 area = .5 * options.widt...
自学-ES6篇-Symbol
故事的小洋葱
10-08 554
1、概述 ES5的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是ES6引入Symbol的原因。 ES6引入了一种新的原始数据类型Symbol，表示独一无二的值。它是JavaSc
Symbol
xiu362726602的博客
11-21 148
Symbol, Symbol.for, Symbol.keyFor()
ES6--Symbol--魔术字符串学习
cmy741741的博客
11-16 980
一、Symbol介绍 ES6 引入的一种新的原始数据类型Symbol，表示独一无二的值。Symbol函数可以接受参数，表示对于这个唯一值的描述。 let s = Symbol() typeof s ; //’symbol’ 变量s表示独一无二的值； 实例： let sy1 = Symbol('sy1'); let sy2 = Symbol('sy2'); console.log(sy1, sy2); console.log(sy1 == sy2); 结果： 二、方法 1.Symbol...
关于ES6中的Symbol
最新发布
weixin_45153463的博客
05-09 119
1 ） Symbol作为书姓名，该属性不会出现在for...in...、for...of...循环中，也不会被。Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()返回。Symbol...for...会先检查给定的key是否已经存在（之前被用Symbol...for...定义过），若不存在，会创建一个新的全局的值，若存在，则返回已存在的值（不会产生一个新的）Symbol函数可以接收一个字符串作为参数，表示对Symbol的描述。
js中的魔术字符串
qq_36002582的博客
04-18 3518
魔术字符串指的是，在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码，应该尽量消除魔术字符串，改由含义清晰的变量代替。 function getMonth(month){ if(month == "May"){ return true }else{ return false } } getMonth("M...
Symbol数据类型
cool的博客
03-31 2328
概述 Symbol是一种新的原始数据类型，由Symbol函数生成，表示独一无二的值，typeof运算符结果表明是symbol类型。注意symbol函数不能使用new命令，否则会报错，因为生成的是原始类型值，不是对象。symbol接受一个字符串作为参数，利于区分不同的symbol值，如果参数是对象，自动调用对象的toString方法转为字符串在生成Symbol值，因此可以在对象中重写tiStrin...
【js】消除魔法字符串
坚强的泡沫的博客
11-17 390
【js】消除魔法字符串
实例：消除魔术字符串
qq_24917475的博客
06-30 429
魔术字符串指的是，在代码之中多次出现、与代码形成强耦合的某一种具体的字符串或数值。风格良好的代码，应该尽量消除魔术字符串，而由含义清晰的变量代替。 function getArea(shape, options) { var area = 0; switch (shape) { case 'Triangle': // 魔术字符串 area = .5 * options.width...
ES6中的字符串与正则表达式新特性解析
ES6还引入了一些新的字符串方法，如`padStart()`和`padEnd()`，它们用于在字符串的开始或结束填充特定的字符，以确保字符串达到指定的总长度。例如： ```javascript let str = 'Hello'; console.log(str.padStart...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值