Los artículos y códigos se han archivado en [almacén de Github: https://github.com/timerring/front-end-tutorial ] o en la cuenta pública [AIShareLab] también se pueden obtener respondiendo a javascript .

Directorio de artículos

objeto

objeto

Los objetos son un tipo de datos de JavaScript. Ya has aprendido sobre tipos numéricos, tipos de cadenas, tipos booleanos e indefinidos. Los tipos de datos de objetos pueden entenderse como una colección de datos. Consta de dos partes, atributos y métodos.

gramática

Declarar una variable de tipo Objeto no es fundamentalmente diferente de declarar una variable de tipo Número o Cadena antes.

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

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

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
Una propiedad es una variable adjunta a un objeto.
Los nombres de los atributos se pueden utilizar ""o '', generalmente, omitirse, a menos que el nombre encuentre símbolos especiales como espacios, guiones, etc.

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

Después de declarar un objeto y agregar varias propiedades, puedes usar .o []para obtener el valor correspondiente a la propiedad en el objeto, lo que yo llamo acceso a la propiedad.

  <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>

Extensión: también puede agregar atributos 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.

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

métodos y llamadas

La información sobre el comportamiento de los datos se denomina método y su esencia es una función.

Un método se compone de un nombre de método y una función, separados por:
,Utilice inglés para separar múltiples atributos
Un método es una función adjunta a un objeto.
El nombre del método se puede utilizar ""o ''generalmente omitir, a menos que el nombre encuentre símbolos especiales como espacios, guiones, etc.

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

Después de declarar un objeto y agregar varios métodos, puede usar .o []para llamar funciones en el objeto, lo que se denomina llamada a método.

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

  </script>

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.

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

Nota: Ya sea un atributo o un método, si el mismo nombre aparece en el mismo objeto, este último anulará al primero.

atributo de varias palabras o atributo -etc.

Para atributos como atributos de varias palabras o ze-, no se puede utilizar la operación de punto.
Podemos tomar: 对象[‘属性’] manera, tanto las comillas simples como las comillas dobles están bien.

let person = {
    
    
	'user-name' : 'timerring',
}

console.log(person.user-name) // NaN
console.log(person['user-name']) // timerring

nulo

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

atravesar objetos

Los objetos no tienen la misma propiedad de longitud que las matrices, por lo que no se puede determinar la longitud. Los objetos contienen pares clave-valor desordenados (el contexto no se verá afectado), lo cual es irregular, a diferencia de los subíndices regulares en las matrices.

  <script>
    // for in 我们不推荐遍历数组
    let arr = ['pink', 'red', 'blue']
    for (let k in arr) {
      
      
      console.log(k)  // 数组的下标 索引号  但是是字符串类型的 '0'
      console.log(arr[k])  // arr[k]
    }
    // 1. 遍历对象 for in  
    let obj = {
      
      
      uname: 'pink老师',
      age: 18,
      gender: '男'
    }

    // 2. 遍历对象
    for (let k in obj) {
      
      
      console.log(k) // 属性名  'uname'   'age'
      // console.log(obj.k)
      // 翻译过来就是：console.log(obj.'uname') 实际不能这么用，可以采用另一种方法：
      // console.log(obj['uname'])   'uname'  === k
      console.log(obj[k])  // 输出属性值  obj[k]
    }
  </script>

⚠for in no recomienda atravesar la matriz porque k es de tipo cadena.
Recuerde: kpara obtener el nombre del atributo del objeto, 对象名[k]para obtener el valor del atributo

objeto incorporado

Recuerde que lo que hemos utilizado es en realidad un objeto integrado en JavaScript. Hay un método llamado en este objeto , y luego llamamos a este método, es console.logdecir . Además de los objetos, JavaScript tiene otros objetos integrados.consoleloglogconsole.log()
console

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(): Un número aleatorio entre 0 y 1, incluido 0 pero sin incluir 1 [0, 1）
Math.ceil(3.4): Descarta la parte decimal y suma 1 a la parte entera (redondea hacia arriba)
Math.floor(4.68): Descarta la parte decimal, la parte entera permanece sin cambios
Math.round(4.849): redondeado
Math.max(10, 21, 7, 24, 13): Encuentra el mayor de un conjunto de números
Math.min(24, 18, 6, 19, 21): Encuentra el más pequeño de un conjunto de números.
Math.pow(4, 2) : encuentra 4 elevado a 2
Math.sqrt(16): Encuentra la raíz cuadrada

Prueba: https://ks.wjx.top/vj/tHu7X7y.aspx

conceptos básicos de objetos javascript