给你介绍对象~

163 阅读5分钟

对象(object)

一、前言

本篇内容为大家详细介绍对象的概念,创建以及用法,不管你有没有对象,都来看一看这个新的对象吧

二、什么是对象

对象指行动或思考时作为目标的事物或特指恋爱的对方,其实在现实生活中,万物皆对象,对象是一个具体的事物 ,看得见摸得着的实物。例如, 一台电脑、一辆汽车、 一个人可以是"对象", 一个数据库、一个网页也可以是"对象"。在JS中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、函数等。

三、对象的组成

1.属性:事物的特征,在对象中用属性来表示(常用名词)

2.方法:事物的行为,在对象中用方法来表示(常用动词)

举个栗子:

1、一辆Audi R8

属性(特征):四个轮子,V8/V10引擎,2.7秒破百

方法(行为):载人,比赛,拍电影

2、艾斯奥特曼

属性(特征):银红色,法王,奥特兄弟

方法(行为):砍超兽,劈超兽,揍超兽

四、对象的创建

1、利用字面量创建对象

对象字面量:就是花括号{}里面包含了表达这个具体事物(对象)的属性方法

代码实现

    var obj = {
        name: '迪迦',
        age: 30000000,
        sex: '男',
        skill: function () {
            console.log('哉佩利敖光线');
        }
    }
    //调用对象的属性,采取对象名.属性名的格式
    console.log(obj.name);
    //还可以通过 对象名['属性名'] 的格式来调用
    console.log(obj['age']);
    //调用对象的方法 使用 对象名.方法名() 的形式
    obj.skill();

注:

(1) 里面的属性或者方法我们采取键值对的形式 键:属性名 值:属性值

(2) 多个属性或者方法中间用逗号隔开的

(3)方法冒号后面跟的是一个匿名函数

键:相当于属性名

值:相当于属性值,可以是任意类型的值(数字类型、字符串类型、布尔类型,函数类型等)

对象调用

    var UltraMan = {
    name: '梦比优斯',
    type: '奥特曼',
    age: 6800,
    color: '银红',
    skillBark: function () {
        console.log('梦比姆射线');
        },
    }
    console.log(UltraMan.name);
    console.log(UltraMan.type);
    console.log(UltraMan['age']);
    console.log(UltraMan.color);
    UltraMan.skillBark();

运行结果

QQ截图20220912083448.png

总结

对象里面的属性调用:对象.属性名, 这个小点.就理解为“的”,也就是 对象的名字,对象的年龄等

对象里面属性的另一种调用方式:对象['属性名'] ,注意方括号里面的属性必须加引号

变量、属性、函数、方法的区别

1.变量和属性的相同,他们都是用来存储数据的 变量单独声明并赋值使用的时候直接写变量名单独存在,属性在对象里面的不需要声明,使用的时候必须是对象.属性

2.函数和方法的相同点都是实现某种功能做某件事,函数是单独声明并且调用的函数名()单独存在的方法,在对象里面调用的时候--对象.方法

2、利用new Object创建对象

1.创建一个空对象

2.用对象名.属性名 = '值' 来添加属性,注意用分号来隔开

3.添加方法和添加属性一样,对象名.属性名 = function(){}; 分号结尾哦!

4.调用属性,对象名.属性名 的格式来调用

5.使用方法直接用对象名.方法名();即可

代码实现

    var obj = new Object();
     //添加属性
    obj.name = '艾斯';
    obj.age = 15000;
    obj.sex = '男';
     //添加方法
    obj.skill = function(){
        console.log('梅塔利姆光线');
    }
     //调用属性
    console.log(obj.name);
    console.log(obj['sex']);
    console.log(obj.age);
     //使用方法
    obj.skill();

执行效果

艾斯.png

3、利用构造函数创建对象

1.构造函数概念: 构造函数是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与new运算符一起使用。我们可以把对象中一些公共的属性和方法抽取出来,然后封装到这个函数里面。

注:构造函数不需要return就能返回结果

代码实现

    // 声明构造函数
    function UltraMan(age,name,sex){
        this.age = age ;
        this.name = name;
        this.sex = sex;
    }    
    // 调用构造函数
    var Zett = new UltraMan('5000','泽塔奥特曼','男');  
    //调用函数返回的是一个对象
    console.log(Zett);

使用方法代码实现

    function UltraMan (sname,age,sex,home){
        this.name = sname;
        this.age = age;
        this.sex = sex;
        this.home = home;
        this.skill = function(write){//创建方法,write是形参来接受下面传来的实参
                console.log(write);
            }
    }
    var Zero = new UltraMan('赛罗','5900','男','光之国')
    console.log(Zero.name);
    console.log(Zero.age);
    console.log(Zero.sex);
    console.log(Zero.home);
    Zero.skill('赛罗集束光线');//给方法传递一个实参

执行结果

赛罗.png

注: 构造函数,如Stars() ,抽象了对象的公共部分,封装到了函数里面,它泛指某一大类( class ) 创建对象,如new Stars(),特指某一个,通过new关键字创建对象的过程我们也称为对象实例化

new关键字的执行过程

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

遍历对象(for...in)

    // 利用for...in遍历对象
    // for...in语法格式
    //for(var 变量 in 对象){}
    var obj = {
        name: '雷欧奥特曼',
        age: 10000,
        sex: '男'
    }
    for (var key in obj) {
        console.log(key); // key 输出变量 得到的是 属性名
        console.log(obj[key]); //如果输出的是obj[i]得到的就是属性值
    }

执行效果

雷欧.png

五、总结

1.对象可以让代码结构更清晰。

2.对象复杂数据类型object。

3.本质:对象就是一组无序的相关属性和方法的集合。

4.构造函数泛指某一大类,比如苹果,不管是红色苹果还是绿色苹果,都统称为苹果。

5.对象实例特指一个事物,比如这个苹果。

6.for..in语句用于对对象的属性进行循环操作。