Одной из самых основных характеристик любого языка являются переменные. Их использование (или неправильное использование) может вызвать у нас головную боль.

По этой причине очень важно знать, каковы их характеристики и особенности переменных Javascript.

Давайте рассмотрим 5 советов:

1. var, пусть y const

В JS (по крайней мере, из ES6) у нас есть 3 разных способа объявления переменных:

var oneVarlet 
let antoherVar
const constVar

‘var’ — это старый способ объявления переменных и, сильно его упрощая, главный минус здесь в том, что с var у нас есть только 2 области видимости: глобальная или метод. В следующем примере, можете ли вы предсказать, что получится на выходе?

var sampleVar = 'Hello'
function test() {
  var insideVar = 'world'
  
  for (var i = 0; i<1; i++) {
    var insideVar = ' dentro de ámbito interno'
  }
  console.log(sampleVar + ' ' + insideVar)
}

test()

В отличие от того, что мы можем думать, мы можем видеть, что внутреннее назначение переменной переопределяет переменную нашего метода.

Рекомендация: всегда используйте let и const. Оба они имеют блочные области.

2. Подъем

Поднятие — это механизм JS, позволяющий нам использовать функции, которые еще не были объявлены.

test() // It's not yet declared, but I can use it
function test() {
   console.log('Hello world')
}

Но подъем не применяется к переменным:

var x = 5
console.log('x: ' + x + ' - y: ' + y)
var y = 3
$> x: 5 - y: undefined

3. 0, null y не определено

В JS переменная может иметь 3 разных состояния:

  • 0 (или любое значение): переменная инициализирована и может использоваться
  • undefined: мы только объявили переменную, но не присвоили ей никакого значения.
  • null: это особый тип, означающий, что переменная «пустая» (не имеет значения).
console.log('myVar is undefined ' + myVar) // myVar is undefined $> $> undefined
var myVar = null
console.log('myVar is null ' + myVar)       // myVar is null null
console.log('typeof myVar ' + typeof myVar) 
$> typeof myVar object                      // (bug in ECMAScript,      
                                            // it should be null)
myVar = 0
console.log('myVar is 0 ' + myVar)          
console.log('typeof myVar ' + typeof myVar) 
$> myVar is 0 0
$> typeof myVar number

4. Равно и равно

В JS у нас есть 2 разных типа сравнения: == и ===

С помощью == мы проверяем, что значения равны (позволяя JS сделать приведение, если это необходимо).

let numeric = 5
let oneString = "5"
console.log('typeof numeric: ' + typeof numeric)
$> typeof numeric: number
console.log('typeof oneString: ' + typeof oneString)
$> typeof oneString: string
console.log('numeric == oneString? ' + (numeric == oneString))  
$> true

Но с помощью === мы проверяем значение и тип (мы не разрешаем JS приводить к другому типу).

let numeric = 5
let oneString = "5"
console.log('typeof numeric: ' + typeof numeric)
$> typeof numeric: number
console.log('typeof oneString: ' + typeof oneString)
$> typeof oneString: string
console.log('numeric === oneString? ' + (numeric === oneString))  
$> false

Всегда используйте ===, если вы не знаете, почему вы это делаете.

5. NaN может быть строкой

Если мы попытаемся выполнить математическую операцию над нематематической переменной, JS присвоит значение NaN (не число). Это значение может быть преобразовано (с нашего ведома или нет) в строку.

Не могли бы вы посмотреть, что происходит со следующим фрагментом кода?

console.log('b' + 'a' + + 'a' + 'a') 
$> baNaNa