Alcance de JavaScript, promoción variable

你越是认真生活，你的生活就会越美好——Frank Lloyd Wright
Citas clásicas de "El fruto de la vida"

Alcance de JavaScript

作用域Sí, 可访问变量la colección.

En JavaScript, 对象和函数también es una variable.

En 作用域为可访问变量，对象，函数的集合JavaScript,.

JavaScript 函数作用域: el alcance se modifica dentro de la función.

Alcance local de JavaScript

La variable está adentro 函数内声明y la variable es de alcance local.

只能在函数内部访问Variables locales :.

// 此处不能调用 carName 变量
function myFunction() {
    
    
    var carName = "Volvo";
    // 函数内可调用 carName 变量
}

Debido a que 局部变量solo funciona 函数内, se 不同的函数puede usar 相同名称的变量.

局部变量Creado cuando la función comienza a ejecutarse, 函数执行完后las variables locales serán 自动销毁.

Variables globales de JavaScript

La variable está 函数外definida, es decir 全局变量.

Las variables globales son 全局作用域: 所有脚本y se pueden utilizar funciones en la página web .

var carName = " Volvo";
 
// 此处可调用 carName 变量
function myFunction() {
    
    
    // 函数内可调用 carName 变量
}

Si las variables 函数内没有声明(sin usar la 该变量为全局变量),.palabra clave

En el siguiente ejemplo, carName está en la función, pero es una variable global.

function myFunction() {
    
    
    carName = "Volvo";
    // 此处可调用 carName 变量
}
myFunction()
// 此处可调用 carName 变量  前提是myFunction函数执行过
console.log(carName) // Volvo

Ciclo de vida variable de JavaScript

JavaScript 变量生命周期En ella 声明时初始化.

局部变量En 函数执行完毕后销毁.

全局变量En 页面关闭后销毁.

Parámetros de función

函数参数Solo 函数内funciona, sí 局部变量.

Variables globales en HTML

En HTML, las variables globales son objetos de ventana: todas las variables de datos pertenecen a objetos de ventana.

function myFunction() {
    
    
    carName = "Volvo";
}
myFunction()

//此处可使用 window.carName
console.log(window.carName)

PD:
Sus variables o funciones globales pueden sobrescribir las variables o funciones del objeto de ventana.
Las variables locales, incluidos los objetos de ventana, pueden cubrir variables y funciones globales.

Variables y alcance en ES6

Determinar el alcance del bloque por let y const

letY constlas variables creadas son 只在块作用域中válidas. Solo existen en el bloque que los contiene. El código que se muestra a continuación usa let para declarar una variable tmp en un bloque de instrucciones if. Esta variable solo es válida en la instrucción if.

function func() {
    
     
	if (true) {
    
     
		let tmp = 123; 
		console.log(tmp); // => 123 
	} 
}
func() // 123
console.log(tmp); // => ReferenceError: tmp is not defined

Por el contrario, el var声明的变量alcance del alcance es 函数范围内:

function func() {
    
    
	console.log(tmp) // undefined 变量声明提升 还没赋值
	if (true) {
    
    
		var tmp = 123
		console.log(tmp) // 123
	}
	console.log(tmp) // 123
}
func()
console.log(tmp) // Uncaught ReferenceError: tmp is not defined

El alcance de bloque significa que puede tener sombras de variables dentro de una función.

function func() {
    
    
    let foo = 5;
    console.log(foo) // 5
    if(true) {
    
    
        let foo = 10;
        console.log(foo) // 10
    }
    console.log(foo) // 5
}
func()

const crea variables inmutables

La letvariable creada es variable:

let foo = 'abc'
foo = 'def'
console.log(foo) // def

La constcreación de una variable 常量, la variable está 不可变en:

const foo = 'abc'
foo = 'def' // Uncaught TypeError: Assignment to constant variable.

Si una constante se refiere a uno 对象, const并不影响常量本身的值es mutable, porque siempre apunta a ese objeto, pero el objeto en sí todavía se puede cambiar.

const obj = {
    
    }
obj.prop = 123
console.log(obj.prop) // 123
console.log(obj) // {prop: 123}
obj = {
    
    } // Uncaught TypeError: Assignment to constant variable.

Si quieres ser objverdaderamente uno 常量, debes 冻结它的值:

const obj = Object.freeze({
    
    }); 
obj.prop = 123;
console.log(obj) // {}

En otras palabras, si const定义la constante apunta a un objeto. En este momento, en realidad apunta a la dirección del objeto actual. Esta dirección está en la pila y el objeto real está en la pila. Por lo tanto, después de usar const para definir este objeto, podemos cambiar el contenido del objeto. Pero 这个地址是不可以改变的... Esto significa que no puede reasignar este objeto. Por ejemplo const obj= {}, obj = {}, aun así, obj parece no haber cambiado nada, pero sigue siendo incorrecto.
Sin embargo, en el 普通模式caso, y no hay error, mientras que obj.name = 'abc' es completamente posible. Esto está estrechamente relacionado con la forma en que JavaScript almacena el valor del objeto referenciado.

const obj = Object.freeze({
    
    })
const newObj = {
    
    }
obj.name = 'w3cplus'
newObj.name = 'damo'; 

console.log(obj) // {}
console.log(newObj) // {name: "damo"}

Utilice Babel para compilar el código ES6 anterior en el código ES5:

'use strict';
var obj = Ob

Promoción de variables de JavaScript

• En JavaScript, 函数及变量的声明todo será 提升到函数的最顶部.

• En JavaScript 变量可以在使用后声明, eso es 变量可以先使用再声明.

• 类Sin promoción variable

Los siguientes dos ejemplos obtendrán el mismo resultado:
Ejemplo 1

x = 5; // 变量 x 设置为 5

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x;                     // 在元素中显示 x

var x; // 声明 x

Ejemplo 2

var x; // 声明 x
x = 5; // 变量 x 设置为 5

console.log(x)  // 5

Para comprender los ejemplos anteriores, debe comprender " hoisting(变量提升)".

变量提升: 函数声明Y 变量声明siempre estará en silencio por el intérprete 被"提升"到方法体的最顶部.

类Sin promoción variable

new Foo() // Uncaught ReferenceError: Foo is not defined
class Foo {
    
    }

La inicialización de JavaScript no mejorará

En JavaScript, solo se promoverán las variables declaradas, no las inicializadas.
Ejemplo 1

var x = 5; // 初始化 x
var y = 7; // 初始化 y

console.log(x) // 5
console.log(y) // 7

Ejemplo 2

var x = 5; // 初始化 x

console.log(x) // 5
console.log(y) // undefined

var y = 7; // 初始化 y

La y del Ejemplo 2 da como resultado indefinida, esto se debe a que se promueve la declaración de variable (var y), pero la inicialización (y = 7) no se promoverá, por lo que la variable y es una variable indefinida.

El ejemplo 2 es similar al siguiente código:

var x = 5; // 初始化 x
var y;     // 声明 y

console.log(x) // 5
console.log(y) // undefined

y = 7;    // 设置 y 为 7

Declara tus variables al principio

Para la mayoría de los programadores no lo sé JavaScript 变量提升.

Si los programadores no comprenden bien la promoción de variables, los programas que escriben son propensos a algunos problemas.

Para evitar estos problemas, usualmente usamos 在每个作用域开始前声明estas variables, que también es un paso de análisis de JavaScript normal, que es fácil de entender para nosotros.

---

谢谢你阅读到了最后~
期待你关注、收藏、评论、点赞~
让我们一起 变得更强

Alcance de JavaScript de referencia

Se recomienda leer y
comprender el punto de esto en js (algunas reglas más ejemplos + llamar, aplicar, enlazar para cambiar este punto)