JS中对象的总结

水深无声 2022-10-20 14:57 174阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>03_对象</title>
    </head>
    <body>
    
    <script type="text/javascript">
      // 创建对象
      var p = { 
        name: 'Tom',
        age: 12,
        setName: function (name) { 
          this.name = name
        },
        setAge: function (age) { 
          this.age = age
        }
      }
    
      // 访问对象内部数据
      console.log(p.name, p['age'])
      p.setName('Jack')
      p['age'](23)
      console.log(p['name'], p.age)
    
    </script>
    </body>
    </html>

<!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>03_相关问题</title>
    </head>
    <body>
    
    <script type="text/javascript">
      // 创建对象
      var p = { }
    
    /*情形一: 属性名不是合法的标识名*/
      /*需求: 添加一个属性: content-type: text/json */
      // p.content-type = 'text/json' //不正确
      p['content-type'] = 'text/json'
    
    /*情形二: 属性名不确定*/
      var prop = 'xxx'
      var value = 123
      // p.prop = value //不正确
      p[prop] = value
      console.log(p['content-type'], p[prop])
    </script>
    </body>
    </html>

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1NzgzNjYw_size_16_color_FFFFFF_t_70]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1NzgzNjYw_size_16_color_FFFFFF_t_70]: /images/20221020/bedf6b3c9a0446c7bb59e7c3b162d47d.png