ES6 Symbol创建对象属性值(调用Symbol方法汇总)

最新推荐文章于 2022-11-24 10:33:50 发布

PURSUIT_0119

最新推荐文章于 2022-11-24 10:33:50 发布

阅读量304

点赞数

分类专栏：前端学习笔记文章标签： javascript es6

本文链接：https://blog.csdn.net/qq_43544490/article/details/120485010

版权

前端学习笔记专栏收录该内容

4 篇文章 1 订阅

订阅专栏

这篇博客介绍了如何在JavaScript中利用Symbol来为对象添加独特且不可重名的属性和方法。通过示例展示了两种方法创建并调用Symbol类型的方法，强调了Symbol的独特性和在避免命名冲突中的作用。

摘要由CSDN通过智能技术生成

<!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>
</head>

<body>
    <script>

        // 对象添加Symbol添加Symbol类型的属性和方法
        //方法1
        let obj = {
            up: function () {
                console.log('我是亲生up方法');
            },
            down: function () {
                console.log('我是亲生down方法');
            }
        }
        let methods = {
            up: Symbol(),
            down: Symbol()
        };
        //新增方法
        obj[methods.up] = function () {
            console.log('我是新添加的up方法');
        }
        //Symbol方法调用
        console.log(obj);        //{up: ƒ, down: ƒ, Symbol(): ƒ}
        obj.up();                //我是亲生up方法
        console.log(obj.up);     //ƒ () { console.log('我是亲生up方法');}
        obj[methods.up]();       //我是新添加的up方法
        console.log(obj[methods.up]); //ƒ () { console.log('我是新添加的up方法');}

        //方法2
        let say = Symbol('say');
        let close = Symbol('close');

        let game = {
            name: '狼人杀',
            [say]: function () {
                console.log('发言');
            },
            close: function () {
                console.log('闭眼');
            },
            // [Symbol.('zibao')]: function () {
            //     console.log('自爆');
            // }
            [Symbol.for('zibao')]: function () {
                console.log('自爆');
            }
        }
        console.log(game); //{name: '狼人杀', close: ƒ, Symbol(say): ƒ, Symbol(zibao): ƒ}
        console.log(game.name);  //狼人杀
        console.log(game[say]); // f() { console.log('发言');}
        game.say;  //不报错，也不输出
        console.log(11);
        game.close();   // 闭眼
        console.log(game.close());   //闭眼+undefined  //无法输出 f() { console.log('闭眼');}
        game[Symbol.for('zibao')]();  //自爆
        //Symbol.for('say')产生的标识是唯一的，所以可以调用定义在youxi里面的[Symbol.for('say')]方法
        // game[Symbol('zibao')](); //报错
        //因为Symbol('say')生成的标识不是唯一的，所以定义的在game里面的[Symbol('xxx')]是无法调用的，除非把Symbol('xxx')放在外面定义，并用变量保存

    </script>

</body>

</html>