"Функция стрелки" не работает в IE, почему?

ниже фрагмент кода не работает в IE 11, он выдает синтаксическую ошибку в консоли

g.selectAll(".mainBars").append("text").attr("x",d=>(d.part=="primary"? -40: 40)).attr("y",d=>+6).text(d=>d.key).attr("text-anchor",d=>(d.part=="primary"? "end": "start"));

Использование d3.js двухсторонней диаграммы для визуализации

этот код вызывает проблему в приведенном выше выражении d=>(d.part=="primary"? -40: 40)

Ответы

Ответ 1

Вы используете функции стрелок. IE11 не поддерживает их. Вместо этого используйте function.

Здесь перевод Babel's на ES5:

g.selectAll(".mainBars").append("text").attr("x", function (d) {
  return d.part == "primary" ? -40 : 40;
}).attr("y", function (d) {
  return +6;
}).text(function (d) {
  return d.key;
}).attr("text-anchor", function (d) {
  return d.part == "primary" ? "end" : "start";
});

Ответ 2

Избегайте использования функций стрелок, если вам необходимо поддерживать IE 11, поскольку он не поддерживается

Измените их на обычные функции, и ваш код должен работать так, как вы ожидаете

g.selectAll(".mainBars").append("text").attr("x",function(d) { 
  return d.part=="primary"? -40: 40;
}).attr("y",function(d){
  return +6;
}).text(function(d) { 
  return d.key;
}).attr("text-anchor", function(d) { 
  return d.part=="primary"? "end": "start";
});

Ответ 3

В общем, до того, как функции стрелок были функциями стрелок, они были обычными function JS. Так что с IE11 мы просто должны сделать шаг назад во времени

var fruits=["apple","banana","orange"];

var modernResult=fruits.find(e => e.includes("nana"));
console.log(modernResult);

var IEresult=fruits.find(function(e){return e.includes("nana")});
console.log(IEresult);

Ответ 4

IE не поддерживает стрелку нотации как сейчас, но есть удобный и быстрый способ для transpiling ваших ES6 кодов ES5.1 для работы в IE. посетите веб-сайт Babel, затем вставьте свои коды в левое поле и скопируйте код правильного окна, который передается в более раннюю версию JavaScript.

Например, ваш код передается в:

"use strict";

g.selectAll(".mainBars").append("text").attr("x", function (d) {
   return d.part == "primary" ? -40 : 40;
}).attr("y", function (d) {
   return +6;
}).text(function (d) {
   return d.key;
}).attr("text-anchor", function (d) {
   return d.part == "primary" ? "end" : "start";
});