Jak walczyć z mnóstwem nierozwiązanych zmiennych ostrzegawczych w Webstorm?

110

Mam funkcję, która pobiera dane z serwera:

function getData(data){
    console.log(data.someVar);
}

Webstorm mówi, że someVar- to nierozwiązana zmienna. Czego mogę się pozbyć takich ostrzeżeń?

Widzę kilka opcji:

  • Pomiń ostrzeżenia w ustawieniach IDE;
  • Dodaj plik źródłowy JSON z polami ( szczegóły );
  • Stosować tablice przypominające składni: data['some_unres_var'];

Również Webstorm oferujący mi utworzenie przestrzeni nazw dla „danych” (dodanie adnotacji typu /** @namespace data.some_unres_var*/), utworzenie takiego pola lub zmiana jego nazwy.

Siergiej Panfiłow
źródło
2
@hellboy Szybka odpowiedź: kliknij prawym przyciskiem myszy -> Użyj biblioteki Javascript -> upewnij się, że HTML jest zaznaczony. Kontynuuj, patrząc na dostępne biblioteki javascript w ustawieniach projektu, aby lepiej zrozumieć, co się dzieje.
owensmartin

Odpowiedzi:

102

Użyj JSDoc:

/**
 * @param {{some_unres_var:string}} data
 */
function getData(data){
    console.log(data.some_unres_var);
}
Andreas Berheim Brudin
źródło
8
Dla zmiennych użyj tej składni/** * @type {Object} * @property {string} sortval - value to sort by */ var a;
Ferenc Takacs
3
Jak byś to zrobił, gdy funkcja jest funkcją anonimowych? jak w ......... then (function (data) {....})
David V.
1
Czy istnieje podobna metoda definiowania zmiennych globalnych? Odwołuję się do zewnętrznej biblioteki w mojej aplikacji internetowej, muszę użyć takich rzeczy, jak MediumEditor, ale intellij daje mi niesławne ostrzeżenie o nierozwiązanej zmiennej.
borislemke
@borislemke: ta odpowiedź nie będzie działać dla zmiennych, które nie są parametrami. Ogólnym rozwiązaniem jest użycie @namespace .
Dan Dascalescu
45

JSDoc obiekt. Potem jego członkowie.

/**
 * @param data          Information about the object.
 * @param data.member   Information about the object's members.
 */
function getData(data){
    console.log(data.member);
}
  • @property dla zmiennych lokalnych (nie parametrów)
  • Przetestowano w PyCharm. @Nicholi potwierdza, że ​​działa w Webstorm.
  • W {{ member:type }}Andreas składniowe zasugerował mogą być sprzeczne z szablonów Django.
  • Dzięki Jonny Buchanana odpowiedzi powołując się na wiki @param .

Aby udokumentować tablice obiektów , użyj []nawiasów, jak sugeruje JSDoc :

/**
 * @param data
 * @param data.array_member[].foo
 */
Bob Stein
źródło
A co ze zmiennymi, które nie są parametrami? Ogólnym rozwiązaniem jest użycie @namespace .
Dan Dascalescu
1
Mogę potwierdzić, że ta notacja dla złożonych obiektów działa w WebStorm.
Nicholi,
18

Wszystkie inne odpowiedzi są niepoprawne w ogólnym przypadku. A jeśli nie otrzymasz dataparametru? Nie masz wtedy JSDoc:

function niceApiCall(parameters) {
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}

WebStorm ostrzeże, że „result.entries” jest nierozwiązaną zmienną (polem).

Ogólnym rozwiązaniem jest dodanie @namespacedeklaracji:

function niceApiCall(parameters) {
  /** @namespace result.entries **/
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}
Dan Dascalescu
źródło
2
Dzięki za to rozwiązanie. Mam wiele atrybutów zwróconych z API, więc zakładam, że używając twojej techniki, musiałbym wymienić wiele z nich, aby uniknąć błędów, które widzę w ten sposób: `` / ** @namespace req.headers.signaturecertchainurl / / @ namespace req.headers.signature / / @namespace req.headers.slots / / @namespace req.headers.nutrientslot ** / `` Czy istnieje sposób na utworzenie przestrzeni nazw wyższego poziomu (np. req.headers) i automatyczne przypisanie do niej dzieci? (przepraszam za brak formatowania w komentarzach!)
James
@James: to dobre pytanie, a ja również szukałem (bez powodzenia), aby przynajmniej podać więcej niż w polu w wierszu.
Dan Dascalescu
6

rozwiązaniem może być użycie fikcyjnego pliku js z anonimowym wyrażeniem funkcji zwracającym literał json, zgodnie z zapisem pod adresem http://devnet.jetbrains.com/message/5366907 . Mogę również zasugerować utworzenie fałszywej zmiennej, która będzie przechowywać tę wartość json, i użyć tej zmiennej jako wartości adnotacji @param, aby WebStorm wiedział, jaki jest rzeczywisty typ. Lubić:

var jsontext = {"some_unres_var":"val"};
/** @param {jsontext} data */
function getData(data){
    console.log(data.some_unres_var);
}

Zobacz także http://devnet.jetbrains.com/message/5504337#5504337

lena
źródło
1
Sugestia Eleny na forum JetBrains to dziwne rozwiązanie . Ogólnym rozwiązaniem jest użycie @namespace .
Dan Dascalescu
3

Destrukturyzujące użycie, Luke.

function getData(data){
    const {member} = data;
    console.log(member);
}
lazy.lizard
źródło
-1

Aby usunąć ostrzeżenia w The WebStorm IDE, możesz po prostu odznaczyć opcje inspekcji dla:

  • Nierozwiązana funkcja Javascript
  • Nierozpoznana zmienna JavaScript

ps . usunie to ostrzeżenia w IDE, ale nie sądzę, że jest to najlepszy pomysł, ponieważ stracimy jedno z najlepszych narzędzi w IDE, takim jak Webstorm, co może pogorszyć jakość naszego kodu.

Mimo to, jeśli chcesz śledzić w menu: Plik > Ustawienia > Edytor > Inspekcje , możemy wyłączyć ostrzeżenia Javascript

Jak na poniższym obrazku:

odznacz opcje

valdeci
źródło
To zły pomysł, ponieważ usunie wiele korzyści z używania IDE do edycji JS. Chodzi o to, że używanie notacji kropkowej JavaScript myli inspekcję, a nie to, że inspekcja powinna być wyłączona.
Will Harris,