Home  >  Article  >  Web Front-end  >  What is the difference between var, let and const in JavaScript

What is the difference between var, let and const in JavaScript

清浅
清浅Original
2019-04-22 15:05:213664browse

The difference between var, let and const is that the variable of var is declared before the code is executed and the working scope is in the context of the current execution. Let allows the creation of a variable but only acts in its block. What is the similarity between const and let The only difference is that variables defined by const cannot be changed

This article mainly introduces the differences between var, let and const through the method of creating variables in JavaScript (ES6), which has a certain reference effect. I hope to be helpful.

What is the difference between var, let and const in JavaScript

【Recommended course: JavaScript Tutorial

var VS let

The main difference between var and let is not the use of function scope, but the use of block scope. This means that a variable created using the let keyword is available within the "block" in which it is created, as well as within any nested blocks.

Example

function discountPrices (prices, discount) {
  var a = []
  for (var i = 0; i < prices.length; i++) {
    var discountedPrice = prices[i] * (1 - discount)
    var finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }  console.log(i) // 3  console.log(discountedPrice) // 150 
  console.log(finalPrice) // 150
  return a
  }

In the above example, the reason why i, discountedPrice and finalPrice can be used outside the for loop is because they are declared with var, and var is function scope. What happens if we replace var with let?

function discountPrices (prices, discount) {
  let a = []
  for (let i = 0; i < prices.length; i++) {
    let discountedPrice = prices[i] * (1 - discount)
    let finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }  
  console.log(i) // 3  
  console.log(discountedPrice) // 150  
  console.log(finalPrice) // 150
  return a
  }
  discountPrices([100, 200, 300], .5) // 这儿会报错i未定义

What this case tells us is that variables declared using let are block scope, not function scope. Therefore, accessing i (or discountedPrice or finalPrice) outside the "block" will report an error

The next difference is related to variable promotion. The definition of hoisting is "The JavaScript interpreter assigns variable declarations to a default value of undefined during the so-called 'creation' phase.

Example:

function discountPrices (prices, discount) {  
console.log(discounted) // undefined
  var a = []
  for (var i = 0; i < prices.length; i++) {
    var discountedPrice = prices[i] * (1 - discount)
    var finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }
  console.log(i) // 3
  console.log(discountedPrice) // 150
  console.log(finalPrice) // 150
  return a}

If you want Before declaring variables, use let to declare variables instead of undefined (such as those variables declared using var), the program will report an error

function discountPrices (prices, discount) {  
console.log(discounted) // 错误
  let a = []
  for (let i = 0; i < prices.length; i++) {
    let discountedPrice = prices[i] * (1 - discount)
    let finalPrice = Math.round(discountedPrice * 100) / 100
    a.push(finalPrice)
  }
  console.log(i) // 3
  console.log(discountedPrice) // 150
  console.log(finalPrice) // 150
  return a}

The conclusion is

var : Variable declaration is processed before the code is executed, and its scope is within the context of its current execution

let: The let statement allows us to create a variable whose scope is limited to the block in which it is used.

let VS const

Now that we understand the difference between var and let, what about const? It turns out that const is almost identical to let. But the only difference is, Once a variable is assigned a value using const, it cannot be reassigned to a new value.

let name = &#39;Tyler&#39;
const handle = &#39;tylermcginnis&#39;
name = &#39;Tyler McGinnis&#39; //正确
handle = &#39;@tylermcginnis&#39; //错误

From the above, it can be seen that variables declared with let can be reassigned, but variables declared with const cannot. So as long as If you want a variable to be immutable, you can declare it with const. But declaring a variable with const does not mean that it is immutable, it just cannot be reassigned, for example:

const person = {
  name: &#39;Kim Kardashian&#39;
  }
person.name = &#39;Kim Kardashian West&#39; // 正确
person = {} // 错误

So even if you use const Declaring an object does not mean that any of its properties cannot be changed. It only means that it cannot be reassigned to a new value

Summary: The above is the entire content of this article, I hope it will be helpful to everyone.

The above is the detailed content of What is the difference between var, let and const in JavaScript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn