Notas del día 5 sobre conceptos básicos de JavaScript

Conceptos básicos de JavaScript: día 5

Conocer las características de los tipos de datos de objetos y poder utilizar objetos de matriz para representar páginas.

Comprender qué es un objeto y dominar la sintaxis para definir objetos.
Dominar el uso de objetos matemáticos.

objeto

El objeto es un tipo de tipo de datos JavaScript. Hemos aprendido sobre tipos numéricos, tipos de cadenas, tipos booleanos e indefinidos antes. El tipo de datos del objeto puede entenderse como una colección de datos. Consta de dos partes: propiedades y métodos.

gramática

Declarar una variable de tipo objeto no es fundamentalmente diferente de declarar una variable de tipo numérico o cadena.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象语法</title>
</head>
<body>

  <script>
    // 声明字符串类型变量
    let str = 'hello world!'
    
    // 声明数值类型变量
    let num = 199

    // 声明对象类型变量，使用一对花括号
    // user 便是一个对象了，目前它是一个空对象
    let user = {
      
      }
  </script>
</body>
</html>

Propiedades y acceso

La información descriptiva de los datos se denomina atributos, como el nombre, la altura, la edad, el sexo, etc. de una persona, que generalmente son nominales.

Los atributos aparecen en pares, incluidos los nombres y valores de los atributos, :separados por inglés.
,Utilice inglés para separar múltiples atributos
Las propiedades son variables adjuntas a un objeto.
El nombre del atributo puede usar ""o '', que generalmente se omite, a menos que el nombre encuentre símbolos especiales como espacios, guiones, etc.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象语法</title>
</head>
<body>

  <script>
    // 通过对象描述一个人的数据信息
    // person 是一个对象，它包含了一个属性 name
    // 属性都是成对出现的，属性名 和 值，它们之间使用英文 : 分隔
    let person = {
      
      
      name: '小明', // 描述人的姓名
      age: 18, // 描述人的年龄
      stature: 185, // 描述人的身高
      gender: '男', // 描述人的性别
    }
  </script>
</body>
</html>

Después de declarar un objeto y agregar varios atributos, puedes usar .u []para obtener el valor correspondiente al atributo en el objeto, lo que yo llamo acceso a atributos.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象语法</title>
</head>
<body>

  <script>
    // 通过对象描述一个人的数据信息
    // person 是一个对象，它包含了一个属性 name
    // 属性都是成对出现的，属性名 和 值，它们之间使用英文 : 分隔
    let person = {
      
      
      name: '小明', // 描述人的姓名
      age: 18, // 描述人的年龄
      stature: 185, // 描述人的身高
      gender: '男', // 描述人的性别
    };
    
    // 访问人的名字
    console.log(person.name) // 结果为 小明
    // 访问人性别
    console.log(person.gender) // 结果为 男
    // 访问人的身高
    console.log(person['stature']) // 结果为 185
   // 或者
    console.log(person.stature) // 结果同为 185
  </script>
</body>
</html>

Extensión: también puede agregar atributos a los objetos de forma dinámica. La adición dinámica es lo mismo que la definición directa, pero la sintaxis es más flexible.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象语法</title>
</head>
<body>

  <script>
    // 声明一个空的对象（没有任何属性）
	let user = {
      
      }
    // 动态追加属性
    user.name = '小明'
    user['age'] = 18
    
    // 动态添加与直接定义是一样的，只是语法上更灵活
  </script>
</body>
</html>

métodos y llamadas

La información sobre el comportamiento de los datos se denomina método, como correr, cantar, etc., que generalmente son verbos y su esencia es una función.

Un método consta de dos partes: nombre del método y función, separados por:
,Utilice inglés para separar múltiples atributos
Los métodos son funciones adjuntas a un objeto.
El nombre del método puede usar ""o '', que generalmente se omite, a menos que el nombre encuentre símbolos especiales como espacios, guiones, etc.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象方法</title>
</head>
<body>

  <script>
    // 方法是依附在对象上的函数
    let person = {
      
      
      name: '小红',
      age: 18,
      // 方法是由方法名和函数两部分构成，它们之间使用 : 分隔
      singing: function () {
      
      
        console.log('两只老虎，两只老虎，跑的快，跑的快...')
      },
      run: function () {
      
      
        console.log('我跑的非常快...')
      }
    }
  </script>
</body>
</html>

Después de declarar un objeto y agregar varios métodos, puede usar .o []para llamar funciones en el objeto, a las que yo llamo llamadas a métodos.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象方法</title>
</head>
<body>

  <script>
    // 方法是依附在对象上的函数
    let person = {
      
      
      name: '小红',
      age: 18,
      // 方法是由方法名和函数两部分构成，它们之间使用 : 分隔
      singing: function () {
      
      
        console.log('两只老虎，两只老虎，跑的快，跑的快...')
      },
      run: function () {
      
      
        console.log('我跑的非常快...')
      }
    }
    
    // 调用对象中 singing 方法
    person.singing()
    // 调用对象中的 run 方法
    person.run()

  </script>
</body>
</html>

Extensión: también puede agregar métodos dinámicamente a los objetos. La adición dinámica es lo mismo que la definición directa, pero la sintaxis es más flexible.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>JavaScript 基础 - 对象方法</title>
</head>
<body>

  <script>
    // 声明一个空的对象（没有任何属性，也没有任何方法）
	let user = {
      
      }
    // 动态追加属性
    user.name = '小明'
    user.['age'] = 18
    
    // 动态添加方法
    user.move = function () {
      
      
      console.log('移动一点距离...')
    }
    
  </script>
</body>
</html>

Nota: Ya sea una propiedad o un método, si el mismo nombre aparece en el mismo objeto, el último sobrescribirá al anterior.

nulo

null también es un tipo de datos en JavaScript y, por lo general, solo se usa para representar objetos inexistentes. Cuando se usa typeof para detectar el tipo de su tipo, el resultado es object.

Atravesar objetos

let obj = {
    
    
    uname: 'pink'
}
for(let k in obj) {
    
    
    // k 属性名  字符串  带引号    obj.'uname'     k ===  'uname'
    // obj[k]  属性值    obj['uname']   obj[k]
}

for in no se recomienda para atravesar matrices porque k es una cadena

objetos incorporados

Recuerde que lo que hemos utilizado es en realidad un objeto integrado en JavaScript. Hay un método llamado en este objeto console.log, y luego se llama a este método, es decir .consoleloglogconsole.log()

Además consolede los objetos, JavaScript también tiene otros objetos integrados.

Matemáticas

MathEs un objeto integrado en JavaScript, llamado objeto matemático, que contiene propiedades y muchos métodos.

Atributos

Math.PI, obtener pi

// 圆周率
console.log(Math.PI);

método

Math.random, genera un número aleatorio entre 0 y 1

// 0 ~ 1 之间的随机数, 包含 0 不包含 1
Math.random()

Math.ceil, números redondeados

// 舍弃小数部分，整数部分加1
Math.ceil(3.4)

Math.floor, los números se redondean hacia abajo

// 舍弃小数部分，整数部分不变
Math.floor(4.68)

Ronda matemática, redondeo

// 取整，四舍五入原则
Math.round(5.46539)
Math.round(4.849)

Math.max, encuentra el número más grande en un conjunto de números

// 找出最大值
Math.max(10, 21, 7, 24, 13)

Math.min, encuentra el número más pequeño en un conjunto de números

// 找出最小值
Math.min(24, 18, 6, 19, 21)

Math.pow, método de potencia

// 求某个数的多少次方
Math.pow(4, 2) // 求 4 的 2 次方
Math.pow(2, 3) // 求 2 的 3 次方

Math.sqrt, raíz cuadrada

// 求某数的平方根
Math.sqrt(16)

Los objetos matemáticos proporcionan muchos métodos. No es necesario memorizarlos aquí. Al demostrar el uso de objetos matemáticos, puede profundizar su comprensión de los objetos.