美文网首页前端JavaScript
复习笔记之对象(非面向对象)

复习笔记之对象(非面向对象)

作者: 晚月川 | 来源:发表于2020-03-29 23:09 被阅读0次

    对象

    万物皆对象,对象是一个具体的事物
    在JavaScript中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如:字符串、数值、数组、函数等

    • 对象是由属性和方法组成的
      • 属性:事物的特征,在对象中用属性来表示(常用名词)
      • 方法:事物的行为,在对象中用方法来表示(常用动词)

    创建变量的三种方式

    • 利用字面量创建对象

      • 对象字面量:就是花括号{}里面包含了表达这个具体事物(对象)的属性和方法
      • 里面的属性或者方法我们采用键值对的形式 键(属性名): 值(属性值)
      • 多个属性和方法中间用逗号隔开
      • 方法冒号后面跟的是一个匿名函数
      // var obj = {};  // 创建一个空对象
      var obj = {
          name: '赵四',
          age: 18,
          sex: '男',
          sayHi: function() {
              console.log('hi~');
          }
      }
      
    • 利用new Object创建对象

    • 利用构造函数创建对象

    使用对象
    • 调用对象的属性,我们采取 对象名.属性名 的方法
    • 调用属性第二种方法:对象名['属性名']
    • 调用对象的方法:对象名.方法名()

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

    • 变量和属性
      • 相同点:都是用来存储数据的
      • 不同点:变量是单独声明并赋值,使用的时候直接写变量名,单独存在;属性是在对象里面的不需要声明的,使用的时候必须 对象.属性名
    • 函数和方法
      • 相同点:都是实现某个功能,做某件事
      • 不同点:函数是单独声明,通过“函数名()”的方式调用,单独存在;方法在对象里面,不需要声明,调用的时候使用“对象.方法()”的方式调用,方法是用来描述该对象的行为和功能的

    利用new Object创建对象

    var obj = new Object(); // 创建了一个空对象
    obj.name = '赵四';
    obj.age = 18;
    obj.sex = '男';
    obj.sayHi = function() {
        console.log('hi~');
    }
    // 利用等号赋值的方法添加对象的属性和方法
    // 每个属性之间用分号结束
    console.log(obj.name);
    console.log(obj['sex']);
    obj.sayHi();
    

    利用构造函数创建对象

    因为前两种创建对象的方式一次只能创建一个对象,里面很多的属性和方法是相同的,所以可以利用函数的方法,重复这些相同的代码,这个函数就被称为构造函数构造函数里面封装的是对象
    构造函数就是把对象里面一些相同的属性和方法抽象出来封装到函数里面

    ============

    构造函数的语法格式:
    function 构造函数名() {
        this.属性 = 值;
        this.方法 = function() {}
    }
    new 构造函数名();
    // 构造函数名字首字母要大写
    // 构造函数不需要return就可以返回结果
    // 调用构造函数必须使用new
    // 是要new Star()调用函数就创建了一个对象
    // 属性和方法前面必须加this
    // 示例如下:
    function Star(name, age, sex) {
        this.name = name;
        this.age = age;
        this.sex = sex;
        this.sing = function(sang) {
            console.log(sang);
        }
    }
    var byc = new Star('白月初',18,'男'); // 调用函数返回的是一个对象
    console.log(byc.name);
    console.log(byc.age);
    console.log(byc['sex']);
    byc.sing('狐妖小红娘');
    
    构造函数和对象的相互联系
    • 构造函数泛指某一大类(
    • 对象是某一个具体的事物(实例
    • 利用构造函数创建对象的过程被称为对象的实例化
    构造函数中new的作用

    构造函数执行的步骤

    1. new 构造函数在内存中创建了一个空的对象
    2. this就会指向刚才创建的空对象
    3. 执行构造函数中的代码,给这个空对象添加属性和方法
    4. 返回这个对象(所以构造函数中不需要return)
      • 有return,并且返回基本类型值,最后返回的结果还是类的实例;如果返回一个引用数据类型,则会把默认把返回的实例给覆盖掉,这样我们接受结果就不再是当前类的实例了,而是自己返回的值 => 真实项目中,如果想创建类的实例,则建议大家不要手动写return了,防止实例被覆盖

    遍历对象

    for in循环:用于对数组或对象的属性进行循环操作

    // for in循环格式
    // for(var 变量 in 对象){}
    var obj = {
        name: '白月初',
        age: 18,
        sex: '男'
    }
    for(var k in obj) {
        console.log(k); // k 输出变量得到的是属性名 
        console.log(obj[k]); // obj[k] 得到的是属性值
    }
    // 使用for in里面的变量,常用 k / key
    

    对象总结

    1. 对象可以让代码结构更清晰
    2. 对象是引用数据类型值object
    3. 本质:对象就是一组无序的相关属性和方法的集合
    4. 构造函数泛指一大类
    5. 对象(实例)特质一个事物
    6. for in循环用于对对象的属性进行循环操作

    相关文章

      网友评论

        本文标题:复习笔记之对象(非面向对象)

        本文链接:https://www.haomeiwen.com/subject/npbpuhtx.html