javascript 定义一个对象然后赋值 javascript怎么定义对象

转载

mob64ca141a2a87 2023-12-07 09:20:44

文章标签 数据数组构造函数 文章分类 JavaScript 前端开发

对象

你有对象吗？没有就可以new一个对象：万物皆对象

1.对象的概念：对象可以看成是一个容器，用来存储数据

2.表现形式

[ ]数组

{ }对象

null 空（特殊）

3.对象的创建

声明式/直接创建 var obj={ }

构造函数方式 var obj=new Object（）

注意

大括号是对象的表达形式创建就表示有了对象的容器但是还没有数据

使用构造函数方式创建的是时候 new关键字后面的英文单词首字母记得要大写

重点-对象的数据存储

有两种方式

1.使用声明式创建对象的数据存储方法

var obj={

键1：值1

键2：值2

键3：值3

}

2.var obj=new Object(

{

键1：值1

键2：值2

键3：值3

}

)

总结

1.对象的数据都是以键值对的方式进行存储的（属性和属性值）

2.键值对常见的英文单词可以表示为 key：value

3.每个键值之间需要使用冒号隔开每个键值对结束了后面需要使用逗号

4.对象中的数据存储都是无序的：无序的数据集合

对象数据的写法需要注意的点

1.书写键值对中的键的时候需要使用引号

键的默认数据类型是字符串，但可以省略不写

2.书写键值对总的值需要注意点

值可以根据需求去决定可以使任意的数据类型

对象是无序的

对象的访问：取到对象中的数据显示在浏览器的显示区域的过程叫做渲染

访问对象的方式

1.对象.键

2.对象["键"]

var obj = {
          name:"彭于晏",
          age:18,
          gender:"男",
          "background-color":"saopink"
      }
      // console.log(obj.age,obj.name,obj.gender,obj.background-color)
      console.log(obj["age"],obj["name"],obj["gender"],obj["background-color"])
      console.log(obj,obj.wife) // undefined

总结

1.两种方式都可以取到对象中的数据通过对象中的键获取值

2.使用对象.键这种方式获取的时候需要注意键中不能有连接符号报错获取不到

3.获取对象中的键的时候如果这个键不存在会返回undefined

遍历：针对与对象中的每个数据进行循环操作拿到你想要的数据信息

循环：根据条件虚幻得出你想要的需求数据

在对象中为什么会存在遍历？循环得到所有的数据

对象中遍历的方法

for（var 自定义的名称 in obj）{

//可以输出当前对象中的每个键

}

var person = {
          name:"彭泉",
          age:50,
          gender:"不详",
          wife:"chou",
          salary:"0.3w包吃住"
      }
      for(var i in person){
          console.log(i,typeof i)
          // console.log(i) // 有键了获取值
          // 第一种方式获取 对象.键
          // console.log(person.i)
          console.log(person[i])
      }

解释取数据的过程中出现的一些问题

1.为什么person.i获取到的值全部是undefined

对象.键 后面的键默认的数据是字符串

使用for...in这种方式获取的变量，所获取到的就是undefined

2.为什么person["i"]获取到的值全部是undefined

对象[“键”] 默认的数据时字符串

这种方式获取对象中的值不需要加引号了本来就是字符串

3.这两种方式获取对象的时候建议使用第二种方式获取对象[键]

3.获取到了数据这些数据可以渲染在页面中，还可以对数据进行一些操作

对象中的方法：函数

1.对象中的键值对的得值可以是任意的数据类型

2.值也可以是一个函数在对象中的函数就是当前这个对象的方法

var person = {
          name:"彭泉",
          age:50,
          gender:"不详",
          wife:"chou",
          salary:"0.3w包吃住",
          eat:function(){
              console.log('彭泉淦饭人')
          }
      }
      console.log(person.name)
      console.log(person["age"])
      console.log(person.eat) // 当前eat后面的值 但是这时候值是函数 所以输出得到就是整个函数体
      // 想要这个方法执行 那就是调用函数
      person.eat()

想要执行这个方法，那么必须要调用这个函数

对象的操作

1.增加：对象.键=值

2.删除：delete 对象.键（慎用）

3.修改：对象.键 =值

4.查询：对象的访问对象.键/对象["键"]

var person = {
          name:"佑周同学",
          age:38,
          gender:'女',
          wife:{
              name:"彭泉"
          }
      }
      person.money = 0 // 没有的话就表示新增一个
      person.money = 1800 // 有的话就表示覆盖修改
      delete person.name
      console.log(person)
  
      // 拓展一种删除的方法 
      for(var i in person){
          delete person[i]
      }
      console.log(person)

构造函数的概念

主要是使用了new关键字创建对象、数组、字符串、函数......

// 1.创建对象
      var obj = new Object()
      console.log(obj)
  
      // 2.创建函数
      function Fn(){}
      var fun = new Fn()
      console.log(fun)
  
      // 3.数字类型
      var num = new Number()
      console.log(num)

构造函数的总结

1.所有的都可以使用构造函数方式去创建只是比较麻烦目前不推荐使用

2.关键字new只是区分普通函数和构造函数的一个方法

**3.this指向的问题：构造函数中this可以表示赋值操作

1.数组的概念：是用来存储数据的对象的另外一种表达形式

对象是无序的数据集合

数组是有序的数据集合

2.数组的创建方式

声明式/直接创建方式var arr=[ ]

构造函数的方式var arr =new Array( )

3.数组的数据存储

声明式var arr=[数据1，数据2，数据3]