面试题：JavaScript中如何解决自定义符号在不同环境下的兼容性

Question

假设你在JavaScript代码中自定义了一个符号（Symbol）用于对象属性的唯一标识，在不同的JavaScript运行环境（如Node.js和浏览器环境）以及不同版本的JavaScript引擎下，可能会存在兼容性问题。请阐述你会采取哪些策略来确保这个自定义符号在各种环境下都能正常使用，并举例说明如何通过Polyfill等技术手段解决兼容性问题。

Answer 1

确保自定义符号在各种环境下正常使用的策略

1. 特性检测：在使用自定义符号前，先检测当前环境是否支持Symbol。如果支持，则正常使用；若不支持，采取相应的替代方案。
2. 使用Polyfill：对于不支持Symbol的环境，引入Symbol的Polyfill，模拟Symbol的功能。
3. 兼容性代码编写：在代码中编写逻辑，根据不同环境和引擎版本，采用不同的实现方式，确保功能一致性。

通过Polyfill解决兼容性问题的示例

1. 引入Polyfill库：在不支持Symbol的环境中，可以引入第三方的Polyfill库，如core-js。在项目中安装core-js：

npm install core-js

在代码中引入：

import 'core-js/features/symbol';

2. 手动实现Polyfill：如果不想引入外部库，也可以手动实现一个简单的Symbol Polyfill：

if (typeof Symbol === 'undefined') {
    (function () {
        const globalSymbolRegistry = {};
        let symbolCounter = 0;
        function SymbolPolyfill(description) {
            const key = `__symbol__${symbolCounter++}_${description}`;
            Object.defineProperty(this, 'description', {
                value: description,
                enumerable: false,
                configurable: true
            });
            Object.defineProperty(this, 'toString', {
                value: function () {
                    return `Symbol(${description})`;
                },
                enumerable: false,
                configurable: true
            });
            globalSymbolRegistry[key] = this;
            return this;
        }
        SymbolPolyfill.for = function (key) {
            for (const symKey in globalSymbolRegistry) {
                if (globalSymbolRegistry.hasOwnProperty(symKey) && globalSymbolRegistry[symKey].description === key) {
                    return globalSymbolRegistry[symKey];
                }
            }
            const newSym = new SymbolPolyfill(key);
            globalSymbolRegistry[`__symbol__${symbolCounter++}_${key}`] = newSym;
            return newSym;
        };
        SymbolPolyfill.prototype[SymbolPolyfill.toStringTag] = 'Symbol';
        global.Symbol = SymbolPolyfill;
    })();
}

// 使用示例
const mySymbol = Symbol('unique');
const obj = {};
obj[mySymbol] = 'value';
console.log(obj[mySymbol]); 

这样，无论是在支持Symbol的环境，还是不支持的环境，都能通过相应机制确保自定义符号正常使用。