首页 > 解决方案 > 错误:对象不支持属性或方法“包含”IE 代码

问题描述

尝试更改为 IndexOf 但这仍然无法按我的预期工作。我已将我的代码从 ES6 转换为 ES5,但它没有出现,因为它应该将 chrome 输出与 IE 进行比较。我还缺少什么?添加了一个包含 javascript 代码的片段,以向您展示我正在尝试做的事情。以下无法在 IE 上运行,但适用于 chrome 和 firefox。我正在尝试以二进制形式打印出 chrome 和 IE 中的 RT。这一切都是通过javascript完成的。请参阅下图以识别问题。看起来它在 ES6 --> ES5 之间的转换过程中丢失了一些东西,但在 chrome 上仍然可以正常工作。

const mapping = {
    R: '1111111111111111111111000000111100000011110000001111111111101111111000110000110011000001101100000011',
    T: '1111111111111111111100001100000000110000000011000000001100000000110000000011000000001100000000110000'

};


// Grab the binary mapping of the letter and
// return some HTML
function binaryise(letter) {
    var arr = mapping[letter].split('');
    return arr.map(function (char) {
        return '<div class="' + (char === '0' ? 'zero' : 'one') + '">' + char + '</div>';
    }).join('');
}

// For each letter in the word create a 
// binary version and return it in a list-item container
function processWord(arr) {
    var items = arr.map(function (letter, i) {
        var binaryised = binaryise(letter);
        return '\n      <li class="binaryli" data-id=' + i + '>\n        <div class="containerbinary">' + binaryised + '</div>\n      </li>\n    ';
    }).join('');
    return '<ul class="binaryul">' + items + '</ul>';
}


// Get a random number that hasn't previously appeared

function getRandom(arr, memo) {
    const index = Math.floor(Math.random() * arr.length);
    return memo.indexOf(index) > 1 ? getRandom(arr, memo) : index;
}

// Once the html has been added to the page
// (all set with opacity to 0)
// iterate over the letters turning the
// opacity of each to 1
function showLetters(arr, memo) {
    memo = memo || [];
    if (memo.length !== arr.length) {
        var index = getRandom(arr, memo);
        var letter = arr[index];
        var el = document.querySelector('[data-id="' + index + '"]');
        setTimeout(function () {
            el.classList.add('show');
            memo.push(index);
            showLetters(arr, memo);
        }, 1000);
    }
}

var wordArr = 'RT'.toUpperCase().split('');

// Process all the letters of the word and add them
// to the page...
const html = processWord(wordArr);
output.insertAdjacentHTML('beforeend', html);

// ...then fade them in
showLetters(wordArr);

下面的作品不再有语法错误,但图像显示 IE 输出与 chrome 不同。CHrome 输出以二进制 1,0 正确显示“RT”。IE 输出只是按行写入,不能正确显示。IE 代码中可能缺少什么?我相信这可能是这一行的东西,但不能确定...返回 memo.indexOf(index) > 1 吗?getRandom(arr, memo) : 索引;

图片向您展示 IE 与 Chrome 中发生的情况:

IE 中发生的情况如下图所示:

如下图所示,Chrome 中会发生什么

标签: javascriptbabeljs

解决方案


IE 不支持Array.prototype.includes

以兼容 IE11 的方式编写代码:

function getRandom(arr, memo) {
    const index = Math.floor(Math.random() * arr.length);
    return memo.indexOf(index) > -1 ? getRandom(arr, memo) : index;
}

您的代码的第二个问题是逻辑。您的函数不会更改memoarr因此如果memo包含arr将导致无限递归循环。

如果您希望 Babel 为您转译您的代码,您需要使用@babel/preset-envpackage 并.babelrc在项目根目录中定义一个文件:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": "last 2 versions"
      }
    ]
  ]
}

这仍然无法修复丢失的Array.prototype.includes. 为此,以及其他缺少的原型功能,添加@babel/polyfill到您的 package.json 并将其导入到您的 Javascript 入口点的最顶部。


推荐阅读