Dlaczego ta funkcja strzałki nie działa w IE 11?

84

Poniższy fragment kodu nie działa w IE 11, generuje błąd składni w konsoli

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"));

Korzystanie z d3.jswykresu dwudzielnego do wizualizacji

Ten kod powoduje problem w powyższym oświadczeniu d=>(d.part=="primary"? -40: 40)

javascript internet-explorer

— prakashkadakol
źródło

20

IE11 nie obsługuje notacji strzałek dla funkcji anonimowych. Przepisz to jako function (d) { return d.part == "primary" ? -40 : 40; }.

— Filogeneza

1

@Phylogenesis: Nie wszystkie funkcje strzałek są anonimowe. To nie jest na przykład:var f = () => "foo";

— TJ Crowder

2

Zobacz tutaj, które przeglądarki obsługują tę składnię

— Liam

1

^^ ... lub dokumenty .

— Teemu

2

@David Balažic Twój kod jest nieprawidłowy. if (a=>0)jest zawsze prawdą. Dzieje się tak, ponieważ stworzyłeś funkcję, a nie porównanie, a funkcje są prawdziwe. if (a<=0)byłby właściwy sposób, aby to napisać.

— user3654410

118

Używasz funkcji strzałkowych. IE11 ich nie obsługuje. functionZamiast tego użyj funkcji.

Oto tłumaczenie Babel tego na 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";
});

— TJ Crowder
źródło

3

nie zapomnij o this: var f = (a) => {a.some1(); this.some2();};tovar f = function(a) {a.some1(); this.some2();}.bind(this);

— user1742529

21

Unikaj używania funkcji strzałek, jeśli potrzebujesz obsługi przeglądarki IE 11, ponieważ nie jest ona obsługiwana

Zmień je na zwykłe funkcje, a kod powinien działać zgodnie z oczekiwaniami

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";
});

— Felipe Sabino
źródło

17

Ogólnie rzecz biorąc, zanim funkcje strzałkowe były funkcjami strzałkowymi, były zwykłymi JS function. W przypadku IE11 musimy po prostu cofnąć się w czasie

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);

— Szél Lajos
źródło

1

Ten kod w ogóle nie przypomina kodu w pytaniu (a „nie używaj funkcji strzałkowych” nie mówi nic, czego nie podała żadna inna odpowiedź)

— Quentin

10

To prawda, jednak to pytanie jest pierwszym wynikiem wyszukiwania hasła „funkcja strzałki nie działa w IE” i podałem proste i mniej szczegółowe (bardziej ogólne) wyjaśnienie. Ale rozumiem, że to niezgodne z zasadami, przepraszam.

— Szél Lajos

1

IE nie obsługuje obecnie notacji strzałek, ale istnieje wygodny i szybki sposób na transpilację plików ES6 kody ES5.1do pracy w IE. odwiedź witrynę internetową Babel, a następnie wklej swoje kody w lewym polu i skopiuj kod prawego pola, który został przeniesiony do wcześniejszej wersji programu JavaScript.

Na przykład twój kod jest transponowany do:

"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";
});

— AmerllicA
źródło