Dziękujemy za zainteresowanie konferencją Google I/O. Oglądanie treści na żądanie.

Ta strona została przetłumaczona przez Cloud Translation API.

Zmienne

Zmienne to struktura danych, która przypisuje do wartości reprezentatywną nazwę. Mogą one zawierać dane dowolnego rodzaju.

Nazwa zmiennej jest nazywana identyfikatorem. Wymagany jest prawidłowy identyfikator te reguły:

Identyfikatory mogą zawierać litery Unicode, znaki dolara ($) i podkreślenia znaków (_), cyfr (0–9), a nawet niektórych znaków Unicode.
Identyfikatory nie mogą zawierać odstępów, ponieważ parser używa spacji do dla tych elementów. Jeśli na przykład spróbujesz wywołać zmienną my Variable zamiast myVariable, parser widzi 2 identyfikatory, my i Variable oraz zwraca błąd składni („nieoczekiwany token: identyfikatora”).
Identyfikatory muszą zaczynać się od litery, podkreślenia (_) lub znaku dolara ($). Nie mogą zaczynać się od cyfr, aby uniknąć pomylenia liczb i identyfikatory:
```
let 1a = true;

> Uncaught SyntaxError: Invalid or unexpected token
```
Jeśli JavaScript zezwala na liczby na początku identyfikatora, składające się wyłącznie z cyfr, co powoduje konflikty między numerami używanymi jako Liczby i liczby używane jako identyfikatory:
```
let 10 = 20

10 + 5
> ?
```
„Zarezerwowane słowa” które mają już znaczenie składniowe, nie mogą być używane jako identyfikatory.
Identyfikatory nie mogą zawierać znaków specjalnych (! . , / \ + - * =).

Poniższe zasady nie są rygorystyczne dotyczące tworzenia identyfikatorów, ale są sprawdzone metody branżowe, które ułatwiają zarządzanie kodem. Jeśli Twój określony ma różne standardy, przestrzegaj ich, by zapewnić spójność.

Korzystając z przykładu z wbudowanymi metodami i właściwościami JavaScriptu, camelCase (także „camelCase”) to często używana konwencja składające się z wielu słów. Wielbłąda to praktyka wielkie litery na początku każdego wyrazu z wyjątkiem pierwszego w celu poprawy czytelność bez spacji.

let camelCasedIdentifier = true;

W niektórych projektach używane są inne konwencje nazewnictwa w zależności od kontekstu i charakteru. danych. Na przykład pierwsza litera class jest zwykle pisane wielką literą, dlatego w nazwach klas wielowyrazowych często używany jest wariant wielbłąda przypadek zwany potocznie „wielkim wielbłądem” lub Zgłoszenie Pascal.

class MyClass {

}

Identyfikatory powinny zwięźle określać charakter zawartych w nich danych (w przypadku np. currentMonthDays to lepsza nazwa niż theNumberOfDaysInTheCurrentMonth) i czytelne w mgnieniu oka (originalValue to lepszy wynik niż val). Identyfikatory myVariable używane w tym module działają w kontekście pojedyncze przykłady, ale byłyby bardzo nieprzydatne w kodzie produkcyjnym, nie podawać żadnych informacji o tym, jakie dane zawierają.

Identyfikatory nie powinny być zbyt szczegółowe dotyczące danych, ponieważ ich wartości mogą się zmieniać w zależności od tego, jak skrypty działają na danych decyzji, jakie podejmują przyszli opiekunowie. Na przykład zmienna pierwotnie podana w tagu identyfikator miles może zostać później zmieniony na wartość w kilometrach projektu i wymagać od opiekunów klienta zmiany wszelkich odniesień do tej zmiennej aby uniknąć nieporozumień. Aby temu zapobiec, użyj identyfikatora distance .

JavaScript nie nadaje żadnych specjalnych uprawnień ani znaczenia identyfikatorom, które zaczynają się od znaku podkreślenia (_), ale zwykle są używane do pokazywania, zmienna, metoda lub właściwość są „prywatne”, co oznacza, że jest przeznaczona wyłącznie do użytku w kontekście obiektu, który go zawiera, i nie powinien być które mogą zostać wyświetlone lub zmodyfikowane poza tym kontekstem. Ta konwencja została przeniesiona z innych języków programowania i poprzedza dodanie języka JavaScript własności prywatnej.

Deklaracja zmiennej

Istnieje kilka sposobów rozpoznania w JavaScripcie identyfikatora, o nazwie „deklarowanie”, zmienną. Zmienna jest deklarowana za pomocą metod: let, const, lub var słów kluczowych.

let myVariable;

Użyj funkcji let lub var, aby zadeklarować zmienną, którą możesz zmienić w dowolnym momencie. Te słowa kluczowe informują interpreter JavaScriptu, że ciąg znaków jest , który może zawierać wartość.

Podczas pracy w nowoczesnej bazie kodu używaj let zamiast var. var nadal działa stosowanych w nowoczesnych przeglądarkach, ale zachowuje pewne nieintuicyjne działanie, które definiuje się najwcześniejszych wersji JavaScriptu, ale później nie można było ich zmienić na aby zachować zgodność wsteczną. Aby rozwiązać problemy, dodano let w standardzie ES6. z projektem var.

Zadeklarowana zmienna jest inicjowana przez przypisanie do niej wartości. Użyj pojedynczy znak równości (=), aby przypisać wartość do zmiennej lub ją przypisać. Możesz zrobić w tym samym oświadczeniu:

let myVariable = 5;

myVariable + myVariable
> 10

Możesz też zadeklarować zmienną za pomocą funkcji let (lub var) bez jej inicjowania od razu. Jeśli to zrobisz, początkowa wartość zmiennej będzie wynosić undefined do chwili przypisuje mu wartość.

let myVariable;

myVariable;
> undefined

myVariable = 5;

myVariable + myVariable
> 10

Zmienna z wartością undefined różni się od zmiennej niezdefiniowanej , których identyfikator nie został jeszcze zadeklarowany. Odwoływanie się do zmiennej, która nie została podana powoduje błąd.

myVariable
> Uncaught ReferenceError: myVariable is not defined

let myVariable;

myVariable
> undefined

Powiązanie identyfikatora z wartością jest ogólnie nazywane „wiązaniem”. Składnia po słowach kluczowych let, var i const jest nazywana „lista powiązań”, i umożliwia dodawanie wielu deklaracji zmiennych rozdzielonych przecinkami (kończy się oczekiwanym średnikiem). Spowoduje to utworzenie poniższych fragmentów kodu funkcjonalnie identyczne:

let firstVariable,
     secondVariable,
     thirdVariable;

let firstVariable;
let secondVariable;
let thirdVariable;

Ponowne przypisanie wartości zmiennej nie używa parametru let (ani var), ponieważ JavaScript wie już, że zmienna istnieje:

let myVariable = true;

myVariable
> true

myVariable = false;

myVariable
> false

Możesz zmienić przypisanie zmiennych wartości na podstawie ich dotychczasowych wartości:

let myVariable = 10;

myVariable
> 10

myVariable = myVariable * myVariable;

myVariable
> 100

Jeśli spróbujesz ponownie zadeklarować zmienną za pomocą interfejsu let w środowisku produkcyjnym, pojawi się błąd składni:

let myVariable = true;
let myVariable = false;
> Uncaught SyntaxError: redeclaration of let myVariable

Przeglądarki narzędzia dla programistów są bardziej restrykcyjne dotyczące ponownej deklaracji let (i class), więc możesz nie zobaczysz ten sam błąd w konsoli programisty.

Aby zachować zgodność ze starszą wersją przeglądarki, var zezwala na niepotrzebną ponowną deklarację bez błędów w żadnym kontekście:

var myVariable = true;
var myVariable = false;

myVariable\
> false

`const`

Użyj słowa kluczowego const do zadeklarowania stałej. Jest to typ zmiennej jest od razu zainicjowany i nie można go zmienić. Identyfikatory stałych obowiązują te same reguły, co w zmiennych zadeklarowanych za pomocą funkcji let (i var):

const myConstant = true;

myConstant
> true

Nie można zadeklarować stałej bez natychmiastowego przypisania jej wartości, ponieważ stałych nie można ponownie przypisać po ich utworzeniu, więc wszystkie niezainicjowane stała pozostanie na zawsze undefined. Jeśli spróbujesz zadeklarować stałą bez jego zainicjowania pojawi się błąd składni:

const myConstant;
Uncaught SyntaxError: missing = in const declaration

Próbujesz zmienić wartość zmiennej zadeklarowanej za pomocą funkcji const w taki sposób, w jaki możesz zmiana wartości zmiennej deklarowanej przez polecenie let (lub var) powoduje, że typ błąd:

const myConstant = true;

myConstant = false;
> Uncaught TypeError: invalid assignment to const 'myConstant'

Jeśli jednak z obiektem jest powiązana stała, właściwości tego obiektu Obiekt można zmienić.

const constantObject = { "firstvalue" : true };

constantObject
> Object { firstvalue: true }

constantObject.secondvalue = false;

constantObject
> Object { firstvalue: true, secondvalue: false }

Stała, która zawiera obiekt, jest stała odwoływać się do zmiennej wartości danych. Chociaż stałej nie można zmienić, właściwości jej można zmienić, dodać lub usunąć:

const constantObject = { "firstvalue" : true };

constantObject = false
> Uncaught TypeError: invalid assignment to const 'constantObject'

Jeśli nie spodziewasz się, że zmienna zostanie przypisana ponownie, stałą. Korzystanie z const informuje zespół programistów lub przyszłych opiekunów aby nie zmieniać tej wartości, co pozwoli uniknąć naruszenia założeń dotyczących Twojego kodu sposób jej wykorzystania – np. że zmienna zostanie w końcu oceniane na podstawie oczekiwanego typu danych.

Zakres zmiennej

Zakres zmiennej to część skryptu, w której ta zmienna jest dostępna. Zmienna nie zostanie zdefiniowana poza zakresem zmiennej – nie jako identyfikator. zawiera wartość undefined, ale tak, jakby nie została zadeklarowana.

W zależności od słowa kluczowego użytego do zadeklarowania zmiennej oraz kontekstu, w którym możesz określić zakres zmiennych, aby blokować instrukcje (zakres blokowy), poszczególnych funkcji (zakres funkcji) lub całej aplikacji JavaScript. (zakres globalny).

Zakres bloku

Każda zmienna zadeklarowana za pomocą funkcji let lub const ma zakres ograniczony do najbliższej wartości zawierający instrukcję blokowania, co oznacza, że do zmiennej można uzyskać dostęp tylko w ramach tego bloku. Próbujemy dostępu do zmiennej o zakresie ograniczonym do bloku poza nią powoduje to samo jako próby uzyskania dostępu do zmiennej, która nie istnieje:

{
    let scopedVariable = true;
    console.log( scopedVariable );
}
> true

scopedVariable
> ReferenceError: scopedVariable is not defined

W przypadku JavaScriptu zmienna o zakresie blokowym nie istnieje poza blokiem, który go zawiera. Możesz na przykład zadeklarować stałą wewnątrz bloku, a następnie zadeklaruj inną stałą poza tym blokiem, która używa funkcji ten sam identyfikator:

{
  const myConstant = false;
}
const myConstant = true;

scopedConstant;
> true

Mimo że zadeklarowana zmienna nie może rozciągać się na blok nadrzędny, jest dostępne dla wszystkich bloków podrzędnych:

{
    let scopedVariable = true;
    {
    console.log( scopedVariable );
    }
}
> true

Wartość zadeklarowanej zmiennej można zmienić z poziomu bloku podrzędnego:

{
    let scopedVariable = false;
    {
    scopedVariable = true;
    }
    console.log( scopedVariable );
}
> true

Nową zmienną można zainicjować ciągiem let lub const w elemencie podrzędnym blok bez błędów, nawet jeśli używa tego samego identyfikatora co zmienna w Blokada rodzica:

{
    let scopedVariable = false;
    {
    let scopedVariable = true;
    }
    console.log( scopedVariable );
}
> false

Zakres funkcji

Zmienne zadeklarowane za pomocą funkcji var mają zakres ograniczony do najbliższej funkcji zawierającej (lub statyczny blok inicjowania w klasie).

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

Ten problem nadal występuje po wywołaniu funkcji. Mimo że jest inicjowana podczas wykonywania funkcji, niedostępne poza zakresem funkcji:

function myFunction() {
    var scopedVariable = true;

    return scopedVariable;
}

scopedVariable;
> ReferenceError: scopedVariable is not defined

myFunction();
> true

scopedVariable;
> ReferenceError: scopedVariable is not defined

Zakres globalny

Zmienna globalna jest dostępna w całej aplikacji JavaScript, wewnątrz wszystkich bloków i funkcji, po dowolny skrypt na stronie.

Może się to wydawać pożądaną wartością domyślną, jednak zmienne, które wchodzą w skład dowolnej części dostępu do aplikacji i ich modyfikacji, może więc zwiększyć niepotrzebny nakład pracy, kolizji ze zmiennymi w innym miejscu w aplikacji o tym samym identyfikatorze. Dotyczy to całego kodu JavaScriptu wykorzystywanego podczas renderowania strony, np. biblioteki innych firm i analitykę użytkowników. Dlatego sprawdzone metody unikania zakłócania zakresu globalnego, gdy to możliwe.

Dowolna zmienna zadeklarowana za pomocą parametru var poza funkcją nadrzędną lub za pomocą let lub const poza blokiem nadrzędnym, jest globalny:

var functionGlobal = true; // Global
let blockGlobal = true; // Global

{
    console.log( blockGlobal );
    console.log( functionGlobal );
}
> true
> true

(function() {
    console.log( blockGlobal );
    console.log( functionGlobal );
}());
> true
> true

Przypisanie wartości do zmiennej bez jej jednoznacznego zadeklarowania (czyli przez nigdy nie użyto do jego utworzenia var, let ani const) podnosi zmienną do zakresu globalnego, nawet jeśli jest zainicjowana wewnątrz funkcji lub bloku. Zmienną utworzony za pomocą tego wzorca jest czasami nazywany „domniemanym globalnym”.

function myFunction() {
    globalVariable = "global";

    return globalVariable
}

myFunction()\
> "global"

globalVariable\
> "global"

Z wymiennym podnośnikiem

Zmienne i deklaracje funkcji są przenoszone na górę zakresu, co oznacza, że interpreter JavaScript przetwarza wszystkie zmienne zadeklarowane w dowolnym w skrypcie i skutecznie przenosi go do pierwszego wiersza przed wykonaniem skryptu. Oznacza to, że zmienna zadeklarowana za pomocą funkcji Można odwołać się do funkcji var przed zadeklarowaniem zmiennej bez napotykania błąd:

hoistedVariable
> undefined

var hoistedVariable;

Ponieważ hostowana jest tylko deklaracja zmiennej, a nie inicjalizacja, zmienne, które nie zostały bezpośrednio zadeklarowane za pomocą funkcji var, let lub const które nie są podnoszone:

unhoistedVariable;
> Uncaught ReferenceError: unhoistedVariable is not defined

unhoistedVariable = true;

Jak wspomnieliśmy wcześniej, zadeklarowana, ale niezainicjowana zmienna ma przypisaną wartość undefined. To zachowanie ma zastosowanie do zmiennej podniesionej ale tylko w przypadku tych zadeklarowanych za pomocą funkcji var.

hoistedVariable
> undefined

var hoistedVariable = 2 + 2;

hoistedVariable\
> 4

To nieintuicyjne zachowanie wynika głównie z podejmowanych przez nas systemu JavaScript i nie można ich zmienić bez ryzyka, a także psuć istniejące witryny.

Rozwiązania let i const rozwiązują to zachowanie, zamiast tego zwracają błąd, gdy uzyskuje dostęp do zmiennej przed jej utworzeniem:

{
    hoistedVariable;

    let hoistedVariable;
}
> Uncaught ReferenceError: can't access lexical declaration 'hoistedVariable' before initialization

Ten błąd różni się od „niezdefiniowana zmienna podnoszona” Wystąpił błąd czego można się spodziewać, próbując uzyskać dostęp do niezadeklarowanej zmiennej. Ponieważ JavaScript który podniósł zmienną, wie, że zostanie ona utworzona danego zakresu. Zamiast jednak udostępniać tę zmienną przed jej z wartością undefined, tłumacz zwróci błąd. Zmienne zadeklarowane za pomocą funkcji let lub const (albo class) należą do funkcji „tymczasowa martwa strefa” („TDZ”) od początku bloku nadrzędnego do w kodzie, gdzie deklarowana jest zmienna.

Martwe strefy czasowe sprawiają, że działanie funkcji let jest bardziej intuicyjne niż w var autorów. Ma również kluczowe znaczenie przy projektowaniu strony const. Stałych nie można stała się przeniesiona na wierzch swojego zakresu i otrzymuje niejawną wartość z undefined nie można następnie zainicjować z konkretną wartością.

Sprawdź swoją wiedzę

Od jakich znaków można rozpocząć identyfikator?

List

Podkreślenie

Cyfra

Jaka jest preferowana metoda deklarowania zmiennej, której wartość można zmienić w dowolnym momencie?

pozwól

const

zmienna