JavaScript对象

mzmm403
98 阅读4分钟

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第26天

对象

定义

在生活中，万物皆为对象，对象是一个具体的事物，看得见摸得着的实物，在js中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象

  • 属性：事物的特征，在对象中用属性来表示（常用名词）
  • 方法：事物的行为，在对象中用方法来表示（常用动词）

为什么要对象

在保存一个值时，可以用变量，保存多个（一组）值时，可以用数组，如果保存一个人完整的信息呢

var arr = ['mzmm403','男',18,181]

对象可以让这一组信息更加清晰

person.name = 'mzmm403';
person.sex = '男';
person.age = 18;
person.height = 181;

创建和使用对象

创建对象的三种方式

  • 利用字面量创建对象
var obj = {}; //创建了一个空对象
var person = {
    name : 'mzmm403',
	sex : '男',
	age : 18,
	height : 181,
    //以上都是对象的属性创建
    sayHi: function(){
        console.log('hi~');
    //以上是对象的方法创建    
    }
}
  1. 里面呢的属性和方法采用键值对的形式 键 属性名： 值 属性名
  2. 多个属性或方法中间用逗号隔开
  3. 方冒号后面跟的是一个匿名函数
  • 利用new Object创建对象
var obj = new Object(); //创建了一个空的对象
obj.name = 'mzmm403';
obj.sex = '男';
obj.age = 18;
obj.height = 181;
obj.sayHi = function(){
    console.log('hi~');
}

  1. 通过等号赋值的方法，添加对象的属性和方法

  2. 每个属性和方法之间用分号结束

  • 利用构造函数创建对象

为什么需要用构造函数创建对象

前面两种创建对象的方式只能创建一个对象，而我们一次创建一个对象有很多属性方法相同，所以我们可以利用函数的方法重复完成这些相似对象的创建

构造函数就是把我们的对象里面一些相同的属性和方法抽象出来封装到函数里

//构造函数的格式
function 构造函数名(){
    this.属性 = 值;
    this.方法 = function(){}
}
//调用构造函数
new 构造函数名();
//我们来创建一个歌手的构造函数
function Singer(name,sex,age){
    this.name = name;
    this.sex = sex;
    this.age = age;
    this.sing = function(song){
        console.log('正在唱'+ song);
    }
}
var zjl = new Singer('周杰伦','男',43);
zjl.sing('花海');
  1. 构造函数的首字母必须大写
  2. 构造函数不需要return就能返回结果
  3. 构造构造函数返回的是一个对象
  4. 我们调用构造函数必须使用new
  5. 我们只要new Singer()调用函数就创建了一个对象
  6. 我们的属性和方法前面必须添加this

构造函数和对象的区别

  • 构造函数泛指某一大类，类似于java和python里面的类
  • 对象特指一个具体的事物
  • 我们利用构造函数创建对象的过程我们称为对象实例化

new关键字执行过程

  1. new构造函数可以在内存中创建一个空的对象
  2. this就会指向创建的空对象
  3. 执行构造函数里的代码，给空对象添加属性和方法
  4. 返回这个对象

调用对象

console.log(obj.name);
console.log(obj['age']);
obj.sayHi();
  • 调用对象的属性，我们采取对象名.属性名
  • 调用属性还有一种方法，对象名['属性名']
  • 调用对象方法sayHi 对象名.方法名(),注意方法后面一定要加()

变量，属性，函数，方法

  • 变量和属性的相同之处：都是用来存储数据的

  • 变量和属性的不同之处：变量要单独声明并赋值，使用的时候直接写变量 单独存在。而属性在对象里面不需要声明，使用时必须是对象.属性

  • 函数和方法的相同点：都是实现某种功能，做某事

  • 函数和方法的不同点：函数是单独声明并且调用的，通过函数()调用，单独存在。方法在对象里面，调用的时候是对象.方法()

遍历对象属性

var person = {
    name : 'mzmm403',
	sex : '男',
	age : 18,
	height : 181
}

传统的for循环不能遍历对象属性，因为对象属性是无序的，所以在这里我们要使用for..in来对对象的属性进行遍历

for in 遍历的对象
for (变量 in 对象){
    
}
//例子
for (var k in obj){
    console.log(k); //k是属性名
    console.log(obj[k]); //obj[k]是属性值
}
  • 我们使用for in时，里面的变量我们喜欢写k或者key

小结

  1. 对象可以让代码的结构更清晰
  2. 对象是复杂数据类型
  3. 本质：对象就是一组无序的相关属性和方法的集合
  4. 构造函数泛指某一大类
  5. 对象特指某一个具体的事物
  6. for...in语句用于对象的属性进行循环操作
avatar
文章
阅读
粉丝