JavaScript de aprendizaje front-end

1. El valor máximo de un número que se puede representar en JS y el valor mínimo mayor que cero.

• Número.MAX_VALUE y Número.MIN_VALUE
• Si es mayor que Number.MAX_VALUE, use Infinity (infinito positivo) para expresarlo e -Infinity para expresarlo (infinito negativo).
• NAN es un número especial que significa No es un número
• Utilice typeof para verificar Number.MAX_VALUE, NaN e Infinity para obtener el número de resultado
• Intente no utilizar JS para calcular números de punto flotante, especialmente cuando los requisitos de precisión son altos. Para obtener más detalles, consulte
  por qué 0.1+0.2 === 0.3 es falso en JavaScript.

2. Conversión de tipo forzada

1. La diferencia entre String() y toString():

Uso de toString():

let a = 123;
a.toString()

toString() no puede convertir variables con valores nulos e indefinidos en cadenas.Uso
de String():

let a = 123;
String(a)

String() puede convertir variables nulas e indefinidas en cadenas

2. La diferencia entre Number(), parseInt() y parseFloat():

Número:
1. Si es una cadena puramente numérica, se puede convertir directamente a un número
2. Si tiene una cadena no numérica, se convierte a NaN
3. Si es una cadena vacía o todos los espacios, es convertido a 0
4. Si el valor booleano es verdadero, se convierte a 1, si es falso, se convierte a 0
5. Si el valor es nulo, se convierte a 0
6. Si el valor no está definido, se convierte a NaN

parseInt:
puede sacar el número entero válido a partir del primer carácter de una cadena

let a = '123px';
a = parseInt(a);   //a = 123
let b = '123.456px';
b = parseInt(b);   //b = 123
let c = '123b456px';
c = parseInt(c);   //c = 123
let d = 'b123px';
d = parseInt(d);   //d = NaN

parseFloat:
puede extraer los números de punto flotante válidos comenzando desde el primer carácter de una cadena.

let a = '123.456px';
a = parseFloat(a);   //a = 123.456
let b = '123.456.789px';
b = parseFloat(b);   //b = 123.456
let c = '123.456b456px';
c = parseFloat(c);   //c = 123.456
let d = 'b123.456px';
d = parseFloat(d);   //d = NaN
let e = '123px';
e = parseFloat(e);   //e = 123

Si usa parseInt y parseFloat para variables que no son de tipo String, el método primero convertirá la variable al tipo String y luego operará

let a = true;
a = parseFloat(a);   //a = NaN
a = parseInt(a);     //a = NaN
let b = null;
a = parseFloat(b);   //a = NaN
a = parseInt(b);     //a = NaN
let c = undefined;
a = parseFloat(c);   //a = NaN
a = parseInt(c);     //a = NaN
let d = 198.123;
d = parseInt(d);     //d = 198   可以用来给浮点数取整
let e = 070;         //0开头代表八进制的数字，0x开头代表十六进制的数字
e = parseInt(e, 10); //e = 56 第二个参数指定数字的进制

3.Booleano()

1. Número----->Booleano
   Excepto 0 y NaN, todo lo demás es cierto

2. Cadena----->Booleano
   Excepto la cadena vacía, todo lo demás es verdadero

3. Tanto nulo como indefinido se convierten a falso

4. El objeto también se convertirá a verdadero.

5. if() convertirá implícitamente la condición de juicio entre paréntesis a un tipo booleano, que tiene el mismo efecto que Boolean()

3. Operadores básicos

1. Agregar cualquier valor a una cadena convertirá la cadena y realizará una operación de concatenación de cadenas. Podemos aprovechar esta característica para convertir cualquier tipo de datos en una cadena, simplemente agregue una cadena vacía "";

let a = 123;
a = a + "";
console.log(typeof(a));   // string
let resultOne = 1 + 2 + "3";   //ruseltOne = "33"
let resultTwo = "1" +2 + 3;    //reseltTwo = "123"

2. Cualquier valor se convertirá automáticamente a Número al realizar - * / operación
3. Para valores que no sean de tipo numérico, puede usar + para convertirlos a números

let a = "123";
a = +a;     //a = 123(number类型）
let result = 1 + +'2' + 3;    //result = 6

4. Autoincremento (++) y autodecremento (- -)

• Incremento (++):

Mediante el incremento automático, una variable se puede aumentar en 1 en función de sí misma.

Después de incrementar una variable, el valor de la variable original aumentará inmediatamente en 1.

Hay dos tipos de incremento automático: atrás++(a++) y frente++(++a)

Ya sea a++ o ++a, el valor de la variable original aumentará en 1 inmediatamente.

La diferencia es que los valores de a++ y ++a son diferentes

El valor de a++ es igual al valor original (el valor antes del autoincremento)
El valor de ++a es igual al nuevo valor (el valor después del autoincremento)

let a = 10;
let resultOne = a++ + ++a + a;    //resultOne = 10 + 12 + 12 = 34
a = a++;     //a = 10

• Decremento (–):

Al disminuir, una variable se puede reducir en 1 en función de sí misma.

La disminución automática se divide en dos tipos: atrás- -(a- -) y adelante- -(- -a)

Ya sea a- - o - -a, el valor de la variable original disminuirá en 1 inmediatamente.

La diferencia es que a- - y - -a tienen valores diferentes

a- -El valor es igual al valor original (el valor antes de la autodecremento)
- -El valor de a es igual al nuevo valor (el valor después de la autodecremento)

5. Operadores relacionales (menor que, mayor que, menor o igual que, mayor o igual que, igual que, no igual que)

• Al comparar dos cadenas se compara la codificación de los caracteres, y solo se compara el primero, si el primero es igual se compara el segundo, y así sucesivamente.
• Debido a que la comparación en inglés también se realiza mediante codificación, se puede utilizar para ordenar.
• Una comparación entre un número y un valor no numérico se convertirá en un número para comparar. Cualquier comparación con NaN será falsa.
• Si se compara un número de cadena con un número de tipo numérico, se transformará automáticamente, pero comparar los números de dos cadenas tendrá resultados impredecibles.

6. Codificación
   Aquí decimos UTF-8, también conocido como Código Universal. Cada texto o letra está representado por cuatro dígitos hexadecimales.
   Si queremos usar algunos símbolos poco comunes, podemos usar \u+ para mostrar la codificación del símbolo.

console.log('\u2620')

7. operador de igualdad

• indefinido == nulo

console.log(undefined == null) // true

• NaN no es igual a ningún valor, incluido él mismo

console.log(NaN == NaN) // false

• La diferencia entre el operador de igualdad === y el operador de igualdad ==:
  el operador de igualdad realizará automáticamente la conversión de tipo, pero el operador de igualdad no

console.log(undefined == null) // true
console.log(undefined === null) // false

• La diferencia entre !== operador de desigualdad y != operador de desigualdad:
  el operador de desigualdad realizará automáticamente la conversión de tipo, mientras que el operador de desigualdad no

console.log(1 != '1') // false
console.log(1 !== '1') // true

8. operador condicional

El operador condicional también se llama operador ternario.

Sintaxis: ¿
Expresión condicional? Declaración 1: Declaración 2;

Proceso de ejecución:
cuando se ejecuta el operador condicional, primero evalúa la expresión condicional.
Si el valor es verdadero, se ejecuta la declaración 1 y se devuelve el resultado de la ejecución . Si el valor es falso, se ejecuta la declaración 2 y se devuelve la ejecución. resultado

4. ciclo

1. La función de descanso:

• break se utiliza para salir de las sentencias switch y loop
• break solo interrumpe la declaración de bucle más reciente

for(var i=0;i<5;i++){
    
    
	console.log("外层循环："+i);
	for(var j=0;j<5;j++){
    
    
		break;
		console.log("内层循环："+j);
	}
}

• break puede interrumpir el bucle con el nombre especificado

outer: /*outer是第一个for循环的名称*/
for(var i=0;i<5;i++){
    
    
	console.log("外层循环："+i);
	for(var j=0;j<5;j++){
    
    
		break outer;
		console.log("内层循环："+j);
	}
}

2. El papel de continuar:

• continuar se utiliza para omitir el bucle actual

for(var i = 0;i<5;i++){
    
    
	if(i == 2){
    
    
		continue;
	}
	console.log(i);
}

• continuar solo interrumpe la declaración de bucle más reciente
• continuar puede interrumpir el bucle con el nombre especificado

3. Rápida eficiencia del bucle durante la interrupción

//测试如下的程序的性能
//在程序执行前，开启计时器
//console.time( "计时器的名字")可以用来开启一个计时器
//它需要一个字符串作为参数，这个字符串将会作为计时器的标识
console.time( "test" );
//打印2-10000之间所有的质数
for(var i = 2;i<10000;i++){
    
    
	var flag = true;
	for(var j = 2;j<i;j++){
    
    
		if(i%j ==0){
    
    
			//如果进入判断则证明 i不是质数,修改flag值为false
			flag = false;
			//一旦进入判断，则证明 i不可能是质数了，此时循环再执行已经没有任何意义了
			//使用break来结束循环
			break;
		}
	}
	//如果是质数，则打印 i的值
	if(flag){
    
    
		//console.log(i); //为了测试使用和不使用break的性能，去掉输出，减少输出时间，减少误差
	}
}
// console.timend()用来停止一个计时器，需要一个计时器的名字作为参数
console.timeEnd( "test" );

Utilice descanso:

No utilice descanso:

5. Objeto

1.Tipos de datos en JS:

• cadena de cuerda
• Valor numérico
• Booleano
• valor nulo nulo
• Indefinido indefinido

Los cinco tipos anteriores son tipos de datos básicos. Los valores que veremos en el futuro, siempre que no sean los cinco tipos anteriores, son todos objetos.

objeto Objeto

Si utilizamos tipos de datos básicos, las variables que creamos son independientes y no se pueden integrar en un todo.

Los objetos pertenecen a un tipo de datos compuesto y en el objeto se pueden almacenar atributos de varios tipos de datos diferentes.

Clasificación de objetos:

1. Los objetos integrados
   son objetos definidos en el estándar ES y se pueden utilizar en cualquier implementación de ES.
   Por ejemplo: Número de cadena matemática Función booleana 0objeto... . .

2. Los objetos host
   son objetos proporcionados por el entorno de ejecución JS y actualmente se refieren principalmente a objetos proporcionados por el navegador,
   como BOM DOM.
   La consola en console.log() es un objeto y
   el documento en document.write() también es un objeto.

3. Objeto personalizado
   Un objeto creado por el propio desarrollador.

2. Objeto de operación

1. Crea un objeto.
   La función llamada usando la nueva palabra clave es el constructor. El constructor
   es una función especialmente utilizada para crear objetos.

var obj = new Object();
//使用typeof检查一个对象时,会返回object
console.log(typeof obj)

2. Agregar atributos
   Los valores guardados en el objeto se denominan atributos.
   Agregar atributos al objeto
   sintaxis: objeto.nombre del atributo = valor del atributo

//向obj中添加一个 name属性
obj.name ="猪八戒";
//向obj中添加一个 gender属性
obj.gender ="男";
//向obj中添加一个 age属性
obj.age = 18;

3. Sintaxis para leer propiedades en un objeto
   : objeto.nombre de propiedad

console.log(obj.name);// 猪八戒

Si lee una propiedad que no está en el objeto, no se informará ningún error, pero se devolverá indefinido.

4. Modifique la sintaxis del atributo en el objeto
   : objeto.nombre de propiedad = nuevo valor

obj.name = "沙和尚"

5. Eliminar atributos en el objeto
   Sintaxis: eliminar objeto.nombre del atributo

delete obj.name;

3.Nombre del atributo y valor del atributo.

1. Nombre del atributo
   Además de agregar atributos al objeto a través del objeto. Nombre del atributo = valor del atributo , también puede agregar atributos al objeto a través de otro método:
   sintaxis: objeto ["nombre del atributo"] = valor del atributo.
   El nombre del atributo escrito en este forma puede ser cualquier personaje. La composición, incluso puede ser una variable.

var obj = new Object();
obj["123"] = 789;
obj["wenhao"] = "你好呀！";
var n = "wenhao"; // 让变量n等于属性名
console.log(obj["123"]); // 789
console.log(obj[n]); // 通过读取变量n得到属性名“wenhao”，从而得到属性值“你好呀！”

2. Valor de propiedad
   El valor de propiedad de un objeto JS puede ser cualquier tipo de datos, o incluso un objeto.

var obj = new Object();
obj.test = null;
obj.test = undefined;
var obj2 = new Object();
obj2.name = "宋江";
obj.test2 = obj2;
console.log(obj.test2);
console.log(obj.test2.name); // 读取ogj2中的属性

4. Tipos de datos básicos y tipos de datos de referencia.

La variable b es igual a la variable a. Si se cambia el valor de a, el valor de b no cambiará.

var a = 123;
var b = a;
a++
console.log(a); // 124
console.log(b); // 123

Motivo:
las variables en JS se guardan en la memoria de la pila. Los valores de los tipos de datos básicos se almacenan directamente en la memoria de la pila. Los valores existen de forma independiente. La modificación de una variable no afectará a otros objetos variables. Obj2 es igual a obj. Si

cambia el nombre de obj, el nombre de obj2 también cambiará en consecuencia.

var obj = new Object();
obj.name = 'swk';
var obj2 = obj;
obj.name = 'zbj';
console.log(obj.name);  // zbj
console.log(obj2.name); //zbj

Motivo:
el objeto se guarda en la memoria del montón. Cada vez que se crea un nuevo objeto, se abrirá un nuevo espacio en la memoria del montón y la variable guarda la dirección de memoria del objeto (referencia del objeto). Si dos variables Lo que se guarda es la misma referencia de objeto. Cuando uno modifica una propiedad a través de una variable, el otro también se verá afectado. El

objeto obj2 es igual a obj. Sea obj2 igual a nulo. Obj no se vuelve nulo.

var obj = new Object();
obj.name = 'swk';
var obj2 = obj;
obj2 = null;
console.log(obj);  // Object
console.log(obj2); //null

Motivo: obj2=null significa que su puntero es nulo. En este momento, ya no se refiere a la misma dirección que obj

. Obj3.name y obj4.name son ambos 'shs', pero no son iguales.

var obj3 = new Object();
var obj4 = new Object();
obj3.name = 'shs';
obj4.name = 'shs';
console.log(obj3.name == obj4.name); // false

Motivo:
al comparar valores de dos tipos de datos básicos, estás comparando valores.
Al comparar dos tipos de datos de referencia, es la dirección de memoria del objeto comparado.
Si los dos objetos son exactamente iguales pero tienen direcciones diferentes, también devolverá falso.

5. Objetos literales

El segundo método para crear un nuevo objeto:

var obj = {
    
    };

ventaja:

1. Más conveniente y conciso
2. Al crear un objeto, puede especificar directamente el nombre del atributo y el valor del atributo.

var obj = {
    
    
	name:'swk',
	age:24
}

6. Objetos integrados

(1).Matriz

Las matrices también son objetos.
Las matrices tienen funciones similares a nuestros objetos comunes. También se usan para almacenar algunos valores. La diferencia es que los objetos comunes usan cadenas como nombres de atributos, mientras que las matrices usan números como índices para operar índices de elementos: números enteros que comienzan desde 0
. son índice.
¿Por qué utilizar matrices?
El rendimiento de almacenamiento de las matrices es mejor que el de los objetos ordinarios . En el desarrollo, a menudo utilizamos matrices para almacenar algunos datos.

var arr = new Array(); // 创建一个数组对象
var arr2 = []; // 使用字面量创建一个数组对象
console.log(arr); // []
console.log(typeof arr); // object

Agregar elementos a una matriz
Sintaxis: nombre de la matriz [índice] = valor

arr[0] = 10; // 向数组中索引为0的地方添加值10
arr[1] = 20;
console.log(arr[3]); // 读取不存在的索引，不会报错，会返回undefined

Puede utilizar el atributo de longitud para obtener la longitud de la matriz (número de elementos)
Sintaxis: matriz.longitud

arr[0] = 10; 
arr[1] = 20;
console.log(arr.length); //2
console.log(arr); // [10, 20]
arr[10] = 20;
console.log(arr.length); //11
console.log(arr); // [10, 20, , , , , , , ,20]未赋值的地方默认为空

Para una matriz continua, use longitud para obtener la longitud de la matriz (el número de elementos). Para una matriz no continua, use longitud para obtener el índice máximo + 1 de la matriz.

Modificar longitud

arr[0] = 10; 
arr[1] = 20;
arr[2] = 30;
arr[3] = 40;
arr.length = 10 // 设置长度为10
console.log(arr); // [10, 20, 30, 40, , , , , ,]
arr.length = 2 // 设置长度为2
console.log(arr); // [10,20] 后面的值被截断了

Los elementos de la matriz pueden ser de cualquier tipo.

var arr = ['Hello',true,123,null,undefined];
console.log(arr);

Puede poner objetos

var obj = {
    
    name:'swk'}
var arr = [obj];
console.log(arr);
console.log(arr[0].name);

Puedes poner funciones.

var arr = [function fun(){
    
    console.log('我是一个函数')}];
console.log(arr);
console.log(arr[0]());

Se pueden colocar matrices

var arr = [[1,2,3],[4,5,6]];
console.log(arr);

Métodos de matriz:

• pop: puede eliminar el último elemento de la matriz y devolver el elemento como valor de retorno
• push: inserta uno o más elementos al final de la matriz y devuelve la nueva longitud de la matriz como valor de retorno
• unshift: inserta uno o más elementos al comienzo de la matriz y devuelve la nueva longitud de la matriz como valor de retorno
• shift: puede eliminar el primer elemento de la matriz y devolver el elemento como valor de retorno
• forEach()
  forEach() es una función de devolución de llamada.
  Función de devolución de llamada: creada por nosotros, pero no llamada por nosotros, la función forEach() llamada por el propio navegador
  tiene cuatro parámetros:
  el primer parámetro (valor en el ejemplo) es
  el segundo parámetro que se está atravesando actualmente (el valor en el ejemplo) índice), que es el índice del elemento que se está atravesando actualmente.
  El tercer parámetro (arr en el ejemplo) es la matriz que se está atravesando.
  El cuarto parámetro (arr2 en el ejemplo), esto (representa el objeto que desea usar)

var arr = ['孙悟空','猪八戒','沙和尚','唐僧','牛魔王'];
var arr2 = ['123'];
arr.forEach(function(value,index,arr) {
    
    
	console.log('value = '+value);
	console.log('index= '+index);
	console.log('arr= '+arr);
	console.log('a=',this[0]); // 此时this指向arr2
},arr2)

• Slice
  se puede utilizar para extraer elementos específicos de una matriz.
  Este método no cambia la matriz de elementos, sino que encapsula los elementos interceptados en una nueva matriz y la devuelve. Parámetros
  :
  1. El índice de la posición inicial de interceptación, incluido el inicio índice
  2. El final de la intercepción El índice de la posición no incluye el índice final, el segundo parámetro se puede omitir.
• El uso de empalme
  () afectará la matriz original, eliminará el elemento especificado de la matriz original y
  devolverá el elemento eliminado como valor de retorno.
  Parámetros:
  1. Indica el índice de la posición inicial
  2. Indica el número de eliminaciones
  3 y more Parámetros. Representa los elementos reemplazados. Estos elementos se insertarán automáticamente delante del índice de posición inicial.
• concat
  se utiliza para conectar dos o más matrices o elementos

var arr = [1,2,3];
var arr2 = [4,5,6];
var arr3 = [7,8,9];
var result = arr.concat(arr2); // 连接两个数组
var result2 = arr.concat(arr2,arr3); // 连接多个数组
var result3 = arr.concat(arr2,arr3,'a','b','c'); // 还能连接多个元素
console.log(result);
console.log(result2);
console.log(result3);
console.log('arr = '+arr+' || arr2 = '+arr2+' || arr3 = '+arr3); //concat不会影响原数组

• unirse
  convierte una matriz en una cadena

var arr = [1,2,3];
var result = arr.join(); // 默认使用逗号(，)来作为连接符
var result2 = arr.join('@@@'); // 使用@@@作为连接符，
console.log(result);
console.log(typeof result); // 类型是String
console.log(result2);
console.log('arr = '+arr); // 不会影响原数组

• invertir
  invierte la matriz

var arr = [1,2,3,4,5];
var result = arr.reverse();
console.log(result); // 将数组头尾翻转
console.log(arr); // 原数组会被影响

• ordenar Ordenar
  según el código Unicode

var arr = ['b','d','a','c','f','e'];
var result = arr.sort();
console.log(result); // 根据Unicode重新排序
console.log(arr); // 会影响原数组

// 要求升序排列
var arr = [5,4,9,2,7,11];
var result = arr.sort();
console.log(result); // 纯数字也会根据Unicode重新排序，但是有两位数和一位数时，只会比较第一位数，会出现问题
var result2 = arr.sort(function(a,b) {
    
     // 可以加一个回调函数，修改sort()比较数字时的bug
	if (a>b) {
    
    
		return 1; // 返回大于0的数，a和b会交换位置
	} else if (a<b) {
    
    
		return -1; // 返回小于0的数，a和b不会交换位置
	} else {
    
    
		return 0; // 返回等于0的数，a和b不会交换位置
	}
	// 更简便的方法
	// return a - b; // 升序排列
	// return b - a; // 降序排列
});
console.log(result2); // 加上回调函数后的结果

(2) Métodos de función call() y apply()

• Estos dos métodos son métodos de objetos de función y deben llamarse a través de objetos de función.
• Cuando se llama a call() y apply() en una función, se llamará a la función para su ejecución.
• Al llamar a call () y apply (), puede especificar un objeto como primer parámetro. En este momento, este objeto se convertirá en esto cuando se ejecute la función.
• El método call() puede pasar los parámetros reales en secuencia después del objeto.
• El método apply() necesita encapsular los parámetros reales en una matriz y pasarlos de manera uniforme

function fun(a,b) {
    
    
	console.log('我是fun函数');
	console.log('我的名字是'+this.name);
	console.log('a= '+a+' , b= '+b);  
}
var obj = {
    
    name:'swk'};
var obj2 = {
    
    name:'zbj'};
fun(); // 我是fun函数
fun.call(); // 可以调用fun函数
fun.apply(); // 可以调用fun函数
fun.call(obj,2,3); // this指向obj,2和3是实参
fun.apply(obj2,[4,5]); // this指向obj2,4和5是实参,用数组的形式传入

Este caso:

1. Cuando se llama como función, esto siempre es ventana
2. Cuando se llama como método, este es el objeto sobre el que se llama el método.
3. Cuando se llama como constructor, este es el objeto recién creado.
4. Cuando se llama usando call() y apply(), este es el objeto especificado

(3).argumentos

Al llamar a una función, el navegador pasará dos parámetros implícitos cada vez:

1. El objeto de contexto de la función this
2. Los argumentos del objeto que encapsulan los parámetros reales

• argumentos es un objeto similar a una matriz, que también puede operar datos mediante indexación y obtener la longitud.
• Al llamar a una función, los parámetros reales que pasemos se guardarán en argumentos.
• arguments.length se puede utilizar para obtener la longitud del argumento real
• Incluso si no definimos parámetros formales, aún podemos usar parámetros reales a través de argumentos.
• Hay un atributo en él llamado callee, que corresponde a un objeto de función, que es el objeto de la función a la que apunta actualmente.

function fun(){
    
    
	console.log('是否是数组:'+Array.isArray(arguments));
	console.log('实参的长度:'+arguments.length);
	console.log('第一个实参:'+arguments[0]);
	console.log(arguments.callee == fun);
}
fun('Hello',1,2,true);

(4) Objeto de fecha

consigue tiempo()

• Obtener la marca de tiempo del objeto de fecha actual
• La marca de tiempo se refiere a la cantidad de milisegundos que transcurren desde el 1 de enero de 1979, hora media de Greenwich, 0:00:00 hasta la fecha actual (1 segundo = 1000 milisegundos)
• La capa inferior de la computadora utiliza marcas de tiempo para ahorrar tiempo.
• Obtenga la marca de tiempo de la hora actual:

var time = Date.now();

(5) Objeto matemático

El objeto Math no es un constructor, por lo que no es necesario crear un nuevo objeto al usarlo, puede usar directamente sus propiedades y métodos para usar las
propiedades de Math:

console.log(Math.PI);

Método matemático:

• techo: redondear
• piso: redondear hacia abajo
• redondo: redondear a un número entero
• aleatorio: se puede utilizar para generar un número aleatorio del 0 al 1

Generar números aleatorios para XY
Math.round(Math.random * (yx)+x)

• max: obtiene el valor máximo entre varios números
• min: obtiene el valor mínimo entre varios números
• Math.pow(x,y): Devuelve x elevado a la potencia y
• Math.sqrt(x): Devuelve el valor de x después de sacar la raíz cuadrada

(6).Embalaje

JS nos proporciona tres clases contenedoras a través de las cuales los tipos de datos básicos se pueden convertir en objetos.

Cadena()

• La cadena del tipo de datos básico se puede convertir en un objeto String

Número()

• Puede convertir números de tipos de datos básicos en objetos numéricos.

Booleano()

• Los valores booleanos de tipos de datos básicos se pueden convertir en objetos booleanos, pero tenga en cuenta: no utilizaremos objetos de tipos de datos básicos en aplicaciones reales.

Si usa objetos de tipos de datos básicos, hacer algunas comparaciones puede traer algunos resultados inesperados. Dado que no los usamos, ¿cuál es el significado de la existencia de clases contenedoras?

Los métodos y propiedades solo se pueden agregar a objetos, no a tipos de datos básicos.

var a = 123;
a = a.toString(); // 基本类型没有方法和属性，那么是怎么调用toString()的呢？
console.log(a);  // 123
console.log(typeof a);  //String

Cuando llamamos propiedades y métodos en algunos valores de tipos de datos básicos, el navegador usará temporalmente una clase contenedora para convertirlo en un objeto y luego, después de llamar a las propiedades y métodos del objeto, se convertirá en un tipo de datos básico.

(7).Expresión regular

• search()
  puede buscar si el contenido especificado está contenido en la cadena. Si se busca el contenido especificado, devolverá el índice de la primera aparición. Si no se busca, devolverá -1. Puede aceptar una expresión
  regular como parámetro, y luego se basará en la expresión regular. La expresión para recuperar
  la búsqueda de cadenas () solo encontrará la primera, incluso si se establece una coincidencia global, es inútil

str = 'hello abc hello aec afc';
var result = str.search(/a[bef]c/); // 查找abc或aec或afc
var result2 = str.search(/a[bef]c/g); // g代表全局匹配搜索
console.log(result);  //返回第一个匹配的字符的位置
console.log(result2);  // search()只会查找第一个，即使设置全局匹配也没用

• match()
  puede extraer contenido calificado de una cadena basada en una expresión regular. De forma
  predeterminada, nuestra coincidencia solo encontrará el primer contenido que cumpla con los requisitos y detendrá la recuperación después de encontrarlo.
  Podemos configurar la expresión regular como modo de coincidencia global, para que todo el contenido coincida.
  match() encapsulará el contenido coincidente en una matriz y lo devolverá, incluso si solo se encuentra un resultado.

str = "1a2b3c4h5e6l7l8B9";
var result = str.match(/[A-z]/); // 查找字母，找到一个后就返回
var result2 = str.match(/[A-z]/g); // g代表全局匹配搜索
console.log(result);  // 不使用g全局匹配搜索只返回一个值
console.log(result2); // 使用全局搜索会返回所有搜索到的值
console.log(Array.isArray(result)); // 判断是否是数组

• replace()
  puede reemplazar el contenido especificado en la cadena con contenido nuevo.
  Parámetros:
  1. El contenido a reemplazar puede aceptar una expresión regular como parámetro
  . 2. El nuevo contenido
  solo reemplazará al primero de forma predeterminada.

str = "1a2b3c4h5e6l7l8B9";
var result = str.replace(/[A-z]/,'@-@'); // 将第一个字母替换为@-@
var result2 = str.replace(/[a-z]/ig,'$'); // 将全局字母替换为$
console.log(result);  
console.log(result2); 

• split()
  puede dividir una cadena en una matriz.
  Puede pasar una expresión regular como parámetro en el método, de modo que el método dividirá la cadena de acuerdo con la expresión regular. Incluso si este método no especifica una coincidencia global, dividirá todas las cuerdas.

str = "1a2b3c4h5e6l7l8B9";
var result = str.split(/[A-z]/); // 根据字母拆分
var result2 = str.split(/[a-z]/ig); // g代表全局匹配搜索，i表示忽略大小写，可以两种模式一起用
console.log(result);  // 不使用g全局匹配搜索也会自动全部拆分
console.log(result2); 

6. Función

1.Crea una función

1. Debido a que las funciones también son objetos, puede usar new para crear un objeto de función ( pero no se recomienda en desarrollo, es problemático )

var fun  = new Function("console.log('我是new出来的函数对象');");
fun();

2. función nombre de la función ([parámetro 1, parámetro 2, parámetro 3...]) {}

function fun2(){
    
    
	console.log("我是直接创建的函数！");
}
fun2();

3. Asignar una función anónima a una variable

var fun3 = function(){
    
    
	console.log('我是赋值给变量的匿名函数！');
};
fun3();

Extensión:
Ejecución inmediata de la función: una vez definida la función, se llama inmediatamente. Este tipo de función se denomina función de ejecución inmediata. Las funciones ejecutadas inmediatamente tienden a ejecutarse sólo una vez. Como no hay un nombre de función, no se puede volver a llamar más tarde.

(function(){
    
    
	console.log('我是立即执行函数');
})(); // 后面的括号表示掉这个匿名函数

2.Parámetros formales y parámetros reales.

Los valores entre paréntesis al crear una función son parámetros formales (parámetros formales) y los valores pasados ​​al llamar a la función son parámetros reales (parámetros reales)

function fun(a,b){
    
    } // a和b是形参
fun(1,2); // 1和2是实参

Declarar parámetros formales equivale a definir dos variables con el mismo nombre dentro de la función, pero sin asignar valores.

1. El analizador no verifica el tipo de los parámetros reales al llamar a la función

// 求两数的和
function sum (a,b){
    
    
	console.log('他们的和是：'+(a+b));
}
sum(1,2); // 3
sum(true,false); //1
sum(123,'Hello'); //123Hello

Por lo tanto, debe prestar atención a si puede recibir parámetros ilegales. Si es posible, debe escribir y verificar los parámetros, porque los parámetros reales de la función pueden ser cualquier tipo de datos.

2. El analizador tampoco verifica la cantidad de argumentos al llamar a una función.

// 求两数的和
function sum (a,b){
    
    
	console.log('他们的和是：'+(a+b));
}
sum(1,2,3,4); //3
sum(1); // 1+undefined=NaN

No se asignarán los parámetros reales excedentes.
Si el número de parámetros reales es menor que el número de parámetros formales, los parámetros formales sin los parámetros reales correspondientes no estarán definidos.

3.Valor de retorno

Las funciones pueden devolver valores mediante retorno.

// 求两数的和
function sum (a,b){
    
    
	return a+b;
	console.log('hahahaha'); //return后的语句不会执行
}
var result = sum(1,2); 
console.log(result);

El valor después del retorno se devolverá como resultado de la ejecución de la función. Puede definir una variable para recibir el resultado. La
declaración después del retorno en la función no se ejecutará. Si la declaración de retorno no va seguida de ningún valor, es equivalente a devolver un indefinido. Si return no está escrito en la función, también se devolverá undefinido.

4. La relación entre objetos y funciones.

Las propiedades de los objetos también pueden ser funciones.

var obj = new Object();
obj.name = 'swk';
obj.say = function(){
    
    
	console.log('Hello');
}
console.log(obj.say);
console.log(obj.say());

Una función puede convertirse en un atributo de un objeto.
Si una función se guarda como un atributo de un objeto, entonces llamamos a la función un método del objeto. Llamar a esta función
significa llamar al método del objeto,
pero la diferencia entre un método y una funcion esta solo en el nombre y nada mas.la diferencia

5. Propiedades del objeto de enumeración.

var obj = {
    
    
	name:'zbj',
	age:19,
	gender:'男',
	address:'花果山'
};
for(var n in obj){
    
    
	console.log('属性名：'+n);
	console.log('属性值：'+obj[n]);
}

6. Declaración anticipada de funciones y variables.

1. Declaración de variables por adelantado.
   Las variables declaradas usando la palabra clave var se declararán antes de que se ejecute todo el código (pero no se les asignará un valor).
   Sin embargo, si la palabra clave var no se usa al declarar la variable, la variable no se declarará. por adelantado.

console.log(a); //不会报错，但是输出undefined
console.log(b); // 报错
var a = 123;
b = 123

2. La función se declara por adelantado.
   Para las funciones creadas usando el formulario de declaración de función, el nombre de la función (){}
   se creará antes de que se ejecute todo el código, por lo que podemos llamar a la función antes de la declaración de la función.
   Para las funciones creadas usando expresiones de función, no se declarará con anticipación, por lo que no se puede llamar antes de la declaración

fun();  //可以执行
fun2(); // 报错
function fun(){
    
     //函数声明，会被提前创建
	console.log('我是函数声明形式创建的函数');
}
var fun2 = function(){
    
     // 函数表达式，fun2会被声明，他的值为undefined，但是函数不会被创建
	console.log('我是函数表达式创建的函数');
}

7.Alcance

El alcance se refiere al alcance de una variable.

Hay dos tipos de ámbitos en JS:

1. El código JS de alcance global
   escrito directamente en la etiqueta de script está en el alcance global, que se crea cuando se abre la página y se destruye cuando se cierra la página.
   Hay una ventana de objeto global en el alcance global, que representa una ventana del navegador, la crea el navegador y podemos usarla directamente.
   En el ámbito global:
   las variables creadas se guardarán como atributos del objeto de ventana y las funciones se guardarán como métodos del objeto de ventana. Las variables en el ámbito global son variables globales y se puede acceder a ellas en cualquier parte de la página. .

console.log(window); // window是个对象
var a = 123;
console.log(window.a); // 全局变量a也是window的属性
function fun(){
    
    
	console.log('我是window的方法');
}
window.fun(); // 创建的函数fun也是window的方法

2. Alcance de la función:
el alcance de la función se crea cuando se llama a una función. Después de ejecutar la función, el alcance de la función se destruye. Cada vez que se llama a una función, se crea un nuevo alcance de la función. Son independientes entre sí.
Se puede acceder a las variables en el alcance global en el alcance de la función, pero no se puede acceder a las variables en el alcance de la función en el alcance global.

var a = 123;
function fun() {
    
    
	console.log(a); // 123
	var b = 456;
}
fun();
console.log(b); //报错 b is not defined

Al operar una variable en el alcance de la función, primero la buscará en su propio alcance. Si existe, se usará directamente. De lo contrario, buscará en el alcance de nivel superior hasta encontrar el alcance global. Si Todavía no existe tal variable en el ámbito global, se usará directamente y, si se encuentra, se informará un error de referencia.

var a = 123;
var b = 456;
function fun() {
    
    
	var a = 'hello';
	var b = 789;
	console.log(a); // hello
	function fun2() {
    
    
		console.log(b); //789
		console.log(c); //ReferenceError: c is not defined
	}
	fun2();
}
fun();

Para acceder a las variables globales en una función, puede usar el objeto de ventana.
Al crear una variable, si no se usa la palabra clave var, la variable creada se convertirá en una variable global.

Nota: Use eliminar para eliminar las propiedades de un objeto. De la misma manera, puede eliminar las propiedades de la ventana. Si no usa var para crear variables (propiedades del objeto de ventana), puede usar eliminar para eliminarlas. Sin embargo, las variables creadas con var (también propiedades del objeto de ventana) se pueden eliminar usando eliminar. ) no se pueden eliminar usando eliminar, porque el atributo configurable de una variable creada usando var por defecto es falso, por lo que no se puede eliminar usando eliminar. Puede ver el "objeto interno de propiedad" de las propiedades del objeto a través de Object.getOwnPropertyDescriptor (objeto, 'nombre de propiedad')

var a = 10;
function fun() {
    
    
 	var a = 123;
 	console.log(window.a); // a = 10  通过window，可以访问到被局部变量覆盖后的全局变量
 	b = 456; // 没有使用var 创建变量，所以b是全局变量
 	a = 789; 
 	console.log(a); // 789
}
fun();
console.log(b); // 456
console.log(a); // 10

También existe la característica de declaración temprana en el alcance de la función.
Las variables declaradas usando la palabra clave var se declararán antes de que se ejecute todo el código de la función. Las declaraciones de funciones también se ejecutarán antes de que se ejecute todo el código de la función.

var a = 111;
function fun() {
    
    
	fun2(); //提前声明和赋值，输出123
	console.log(a); //变量提前声明，但是没有赋值，所以a=undefined，即使有全局变量a，a还是undefined
	var a = 123;
	function fun2() {
    
    
		console.log('123');
	}
}
fun();

8.esto

Cada vez que el analizador llama a una función, pasa un parámetro implícito a la función. Este parámetro implícito es este, y esto apunta a un objeto. Este objeto se denomina objeto de contexto de ejecución de la función.
Dependiendo de cómo se llame la función, esto apuntará a diferentes objetos.
1. Cuando se llama como función, siempre es ventana
. 2. Cuando se llama como método, este es el objeto que llama al método.

function fun() {
    
    
	console.log(this); //this是一个隐含传入的参数
	console.log(this.name);
}
var obj = {
    
    
	name:'swk',
	say:fun
}
var obj2 = {
    
    
	name:'zbj',
	say:fun
}
var name = 'shs';
obj.say(); // swk，以方法的形式调用时，this就是调用方法的那个对象
obj2.say(); // zbj
fun(); //shs， 以函数的形式调用时，this永远都是window
console.log(obj.say == fun);  //true代表两者是同一个地址的函数
console.log(obj2.say == fun);
console.log(obj.say == obj2.say);

9. Constructor

El constructor es una función ordinaria. El método de creación no es diferente al de las funciones ordinarias. La diferencia es que la primera letra del constructor está en mayúscula.

function Person(name,age,gender){
    
     //首字母大写
	this.name = name;
	this.age = age;
	this.gender = gender;
	this.say = function(){
    
    
		console.log('你好！');
	}
}
var per = new Person('swk',18,'男'); // 使用new是调用构造函数Person，不使用new则是调用普通函数Person
var per1 = new Person('zbj',28,'男'); //我是Person类的一个实例
var per2 = new Person('shs',38,'男'); //我也是Person类的一个实例

function Dog(name,age){
    
    
	this.name = name;
	this.age = age;
	this.say = function(){
    
    
		console.log('汪汪~~');
	}
}
var dog = new Dog('柴犬',1); //我是Dog类的一个实例
console.log(per); // Person {name: "swk", age: 18, gender: "男", say: ƒ}
console.log(dog); // Dog {name: "柴犬", age: 1, say: ƒ}

La diferencia entre un constructor y una función ordinaria es el método de llamada.
Las funciones ordinarias se llaman directamente, mientras que los constructores deben llamarse usando la palabra clave new.
El flujo de ejecución del constructor:
1. Crear un nuevo objeto inmediatamente
2. Establecer el nuevo objeto creado para This en la función, puede usar this en el constructor para hacer referencia al objeto recién creado
3. Ejecute el código en la función línea por línea
4. Devuelva el objeto recién creado como valor de retorno

Los objetos creados con el mismo constructor se denominan clase de objetos y un constructor se denomina clase. Llamaremos al objeto creado a través de un constructor una instancia de la clase.

La situación de esto:
1. Cuando se llama en forma de función, esta es la ventana
2. Cuando se llama en forma de método, quien llama al método es quién
3. Cuando se llama en forma de constructor, esto es el objeto recién creado

console.log(per instanceof Person); //true
console.log(dog instanceof Person); //false
console.log(dog instanceof Dog); //true
console.log(dog instanceof Object); //true
console.log(Dog instanceof Object); //true

Use instancia de para verificar si un objeto es una instancia de una clase, sintaxis: objeto instancia de constructor
Si es así, devuelve verdadero, de lo contrario devuelve falso
El objeto es la clase principal de todas las clases, todos los objetos son descendientes de Objeto, todos los objetos y clases hacen instancia de devolverá verdadero al realizar la consulta

10. prototipo

Cada función que creamos, el analizador agrega un prototipo de atributo a la función.

Este atributo corresponde a un objeto, que es lo que llamamos objeto prototipo.

• Si la función se llama como un prototipo de función normal no tiene ningún efecto

• Cuando se llama a una función como constructor, el objeto que crea tendrá una propiedad implícita, ver más abajo

function MyClass() {
    
    
}
function Person() {
    
    
}
console.log(MyClass.prototype); // 每个构造函数都有prototype
console.log(Person.prototype);
console.log(Person.prototype == MyClass.prototype); // false，每个构造函数的prototype都不同

• Apunta al objeto prototipo del constructor. Podemos acceder a esta propiedad a través de __proto__, ver más abajo

function MyClass() {
    
    
}
var mc = new MyClass();
console.log(mc.__proto__);
console.log(mc.__proto__ == MyClass.prototype); // true

• El objeto prototipo es equivalente a un área pública. Todas las instancias de la misma clase pueden acceder a este objeto prototipo. Podemos establecer de manera uniforme el contenido común del objeto en el objeto prototipo.

• Cuando accedemos a una propiedad o método de un objeto, primero lo buscará en el objeto mismo. Si existe, lo usará directamente. Si no, lo buscará en el objeto prototipo. Si lo encuentra, Se utilizará directamente. Vea abajo

function MyClass() {
    
    
}
MyClass.prototype.a = 123;
var mc = new MyClass();
console.log(mc.a); // 123
mc.a = 456;
console.log(mc.a); //456

• Cuando creemos un constructor en el futuro, podemos agregar las propiedades y métodos comunes a estos objetos al objeto prototipo del constructor, de esta manera no necesitamos agregarlo a cada objeto por separado y no afectará el alcance global, de modo que cada objeto pueda ser Todos los objetos tienen estas propiedades y métodos

function Person(name,age,gender) {
    
    
	this.name= name;
	this.age = age;
	this.gender = gender;
}
Person.prototype.say = function() {
    
    
	console.log('Hello,我是：' + this.name);
}
var per = new Person('swk',18,'男');
var per2 = new Person('zbj',28,'男');
per.say();
per2.say();

Cadena de prototipos
El objeto prototipo también es un objeto, por lo que también tiene un prototipo.
Cuando usamos las propiedades o métodos de un objeto, los buscaremos en sí mismo. Si hay uno en sí mismo, lo usaremos directamente.
Si no lo buscaremos en el objeto prototipo. Si está en el objeto prototipo. Si lo hay, úsalo.
Si no, busca el prototipo del prototipo hasta encontrar el prototipo del objeto Objeto.
El prototipo del objeto Objeto no tiene prototipo, si aún no se encuentra en el Objeto, se devuelve indefinido.

function MyClass() {
    
    
}
var mc = new MyClass();
// 在对象的原型中查找hasOwnProperty方法
console.log(mc.__proto__.hasOwnProperty('hasOwnProperty')); //false
// 在对象的原型的原型中查找hasOwnProperty方法
console.log(mc.__proto__.__proto__.hasOwnProperty('hasOwnProperty')); // true
console.log(mc.__proto__.__proto__); // 对象原型的原型
console.log(mc.__proto__.__proto__.__proto__); // null 没有对象原型的原型的原型

11. Recolección de basura (GC)

• Así como las personas generan basura mientras viven durante mucho tiempo, también se generará basura durante la ejecución del programa. Cuando se acumula demasiada basura, el programa se ejecutará demasiado lento. Entonces necesitamos un mecanismo de recolección de basura para manejar la basura generada durante la ejecución del programa.
• Cuando un objeto no tiene variables o atributos para hacer referencia a él, nunca podremos operar el objeto. En este momento, este objeto es basura. Demasiados objetos de este tipo ocuparán mucho espacio de memoria, lo que provocará que el programa se ejecute. lentamente. , por lo que este tipo de basura debe limpiarse.
• Existe un mecanismo automático de recolección de basura en] S, que destruirá automáticamente estos objetos basura de la memoria. No necesitamos ni podemos realizar operaciones de recolección de basura.
• Todo lo que tenemos que hacer es establecer nulo para los objetos que ya no se utilizan.
  

7.DOM

1. ¿Qué es DOM?

• DOM, el nombre completo es Modelo de objetos de documento.
• JS opera documentos HTML a través de DOM
• El
  documento Documento representa toda la página HTML.
• El
  objeto Object representa la conversión de cada parte de la página web en un objeto.
• Model Model
  utiliza modelos para representar las relaciones entre objetos, lo que nos facilita la obtención de objetos.
  

2.Nodo

• El nodo es el componente más básico de nuestra página web. Cada parte de la página web se puede llamar nodo . Por ejemplo: etiquetas html, atributos, texto, comentarios, todo el documento, etc. son todos nodos.
• Aunque ambos son nodos, sus tipos específicos son en realidad diferentes. Por ejemplo: las etiquetas se denominan nodos de elementos, los atributos se denominan nodos de atributos, el texto se denomina nodos de texto y los documentos se denominan nodos de documentos .
• Los diferentes tipos de nodos tienen diferentes propiedades y métodos.
  

Nodo de documentoDocumento

• El documento del nodo del documento representa el documento HTML completo y todos los nodos de la página web son sus nodos secundarios.
• El objeto de documento existe como una propiedad del objeto de ventana y podemos usarlo directamente sin obtenerlo.
• A través de este objeto podemos encontrar objetos de nodo dentro de todo el acceso al documento, y podemos crear varios objetos de nodo a través de este objeto.

Elemento nodoElemento

• Varias etiquetas en HTML son nodos de elementos, que también son los nodos más utilizados.
• El navegador convertirá todas las etiquetas de la página en un nodo de elemento y podremos obtener el nodo de elemento a través del método del documento. Por ejemplo:
  document.getElementByld()
  obtiene un objeto de nodo de elemento según el valor del atributo id.

Nodo de textoTexto

• Los nodos de texto representan contenido de texto distinto de las etiquetas HTML. Cualquier texto que no sea HTML es un nodo de texto. Incluye contenido de texto plano que puede interpretarse literalmente.
• Los nodos de texto generalmente existen como nodos secundarios de nodos de elementos.
• Al obtener nodos de texto, generalmente primero necesita obtener nodos de elementos. Obtenga el nodo de texto a través del nodo de elemento. Por ejemplo:
  elemento nodo.firstChild;
  obtiene el primer nodo hijo del nodo del elemento, que suele ser un nodo de texto.

Nodo de atributo Arrt

• El nodo de atributo representa cada atributo en la etiqueta. Cabe señalar aquí que el nodo de atributo no es un nodo secundario del nodo de elemento, sino una parte del nodo de elemento.
• El nodo de atributo especificado se puede obtener a través del nodo de elemento. Por ejemplo:
  elemento nodo.getAttributeNode("nombre de atributo")
  Nota: Generalmente no utilizamos nodos de atributos.

3.Evento

• Los eventos son momentos específicos de interacción que ocurren dentro de un documento o ventana del navegador.
• La interacción entre JavaScript y HTML se logra mediante eventos.
• Para las aplicaciones web, existen los siguientes eventos representativos: hacer clic en un elemento, mover el mouse sobre un elemento, presionar una tecla en el teclado, etc.

objeto de evento

Cuando se activa la función de respuesta al evento, el navegador pasará un objeto de evento como parámetro real a la función de respuesta cada vez , y toda la información relacionada con el evento actual se encapsula en el objeto de evento, como por ejemplo: las coordenadas del mouse, qué botón del teclado se presionó. La dirección en la que se desplaza la rueda del mouse. . .

btn.onclick = function(event) {
    
    
	console.log('我是事件对象：' + event);
}

difusión de eventos

El HTML burbujeante del evento
se muestra a continuación: tres divs cada uno con un

código JS de la siguiente manera:

window.onload = function() {
    
    
	var one = document.getElementById('one');
	var two = document.getElementById('two');
	var three = document.getElementById('three');
	one.onclick = function() {
    
    
	console.log('我是青色方块!')
	}
	two.onclick = function() {
    
    
		console.log('我是绿色方块!')
	}
	three.onclick = function() {
    
    
		console.log('我是黄色方块!')
	}
}

Cuando hago clic en el cuadrado amarillo, lógicamente solo se activará un evento, pero se activan los tres eventos. Esta situación es el burbujeo de los acontecimientos.
Al hacer clic en el elemento objetivo se activará el mismo evento en los elementos ancestros del elemento .

difusión de eventos

1. Fase de captura
   En la fase de captura, los eventos se capturan desde el elemento ancestro más externo al elemento objetivo, pero de forma predeterminada el evento no se activará en este momento.
2. Fase de destino:
   el evento captura el elemento de destino. Una vez finalizada la captura, el evento comienza a activarse en el elemento de destino.
3. En la fase de burbujeo
   , el evento se pasa del elemento de destino a sus elementos ancestros, y los eventos en los elementos ancestros se activan a su vez.
   
   Si desea activar el evento en la fase de captura, puede configurar el tercer parámetro de addEventListener () a verdadero. Generalmente, no querrás activar el evento durante la fase de captura, por lo que este parámetro generalmente es falso.
   No hay fase de captura en los navegadores IE8 y anteriores

// addEventListener()函数
addEventListener(eventStr, callback, false){
    
    
// eventStr：事件的名称，不带on，例如click
// callback：回调函数
// false：如果为false，则捕获阶段不会触发事件，如果为true，捕获阶段会触发事件
}

4.Objeto de lista de materiales

BOM: Modelo de objetos del navegador
BOM nos permite operar el navegador a través de JS. El BOM nos proporciona un conjunto de objetos para completar la operación del navegador: objetos BOM

• La ventana
  representa la ventana completa del navegador y la ventana también es el objeto global en la página web.
• Navigator
  representa la información del navegador actual. Este objeto se puede utilizar para identificar diferentes navegadores.
• La ubicación
  representa la información de la barra de direcciones del navegador actual. Puede obtener la información de la barra de direcciones a través de Ubicación u operar el navegador para saltar a la página.
• El historial
  representa el historial del navegador. Puede utilizar este objeto para operar el historial del navegador.
  Debido a razones de privacidad, este objeto no puede obtener registros históricos específicos. Solo puede operar el navegador para avanzar o retroceder una página, y esta operación solo está disponible en Válido para la visita actual
• La pantalla
  representa la información de la pantalla del usuario, a través de este objeto se puede obtener la información relevante de la pantalla del usuario.

console.log(window);
console.log(navigator);
console.log(Location);
console.log(history);
console.log(screen);

Estos objetos BOM se guardan como propiedades del objeto de ventana en el navegador y se pueden usar a través del objeto de ventana o directamente.

5.JSON

Notación de objetos JavaScript Notación de objetos JS

• JSON es una cadena en un formato especial. Esta cadena puede ser reconocida por cualquier idioma y se puede convertir en un objeto en cualquier idioma. JSON se utiliza principalmente para la interacción de datos en el desarrollo.
• El formato de los objetos JSON y JavaScript es el mismo, excepto que los nombres de los atributos en la cadena JSON deben estar entre comillas dobles. La otra sintaxis es consistente con JavaScript.

JSON —> objeto JS

JSON.parse()

• Puede convertir una cadena JSON en un objeto JS
• Toma una cadena JSON como parámetro y convertirá la cadena en un objeto JS.

var json = '{"name":"swk","age":18}'; // JSON格式的数据
var obj = JSON.parse(json); // 将JSON格式数据转为JS对象
console.log(typeof json); // JSON的类型：string
console.log(typeof obj); // 转换后的类型：object

Objeto JS —> JSON

JSON.stringify()

• Puede convertir un objeto JS en una cadena JSON
• Se requiere un objeto JS como parámetro y se devolverá una cadena en formato JSON.

var obj = {
    
    name:"zbj", age:18, gender:"男"}; // JSON格式的数据
var json = JSON.stringify(obj); // 将JSON格式数据转为JS对象
console.log(typeof json); // 转换后的类型：string
console.log(typeof obj); // JS对象类型：object

8. Finalmente

Finalmente, recomiendo el "Tutorial de introducción al lenguaje JavaScript" del profesor Ruan Yifeng.