6<保姆教程>》JavaScript基础(对象)

133 阅读3分钟

JavaScript基础

对象

是什么,作用

    // 是什么
    在js中,对象是一组无序的相关属性和方法的集合,对象是由属性和方法组成的
    // 作用:
    // 保存一个值时可以用变量,保存多个值时可以用数组,如果保存一个人的完整信息呢?
    var arr = ['小红', '女', 123, 158]//这样?
    // 对象表达的结构更清晰,更强大
    var obj={
        name:'小红',
        sex:'女',
        age:123,
        height:158
    }

创建对象的三种方式(现阶段)

  1. 利用字面量
    // 创建对象 属性或者方法采用键值对的形式,多个属性和方法用逗号隔开
    var obj = {
            name: '小红',
            sex: '女',
            satHi: function() {
                console.log('你好')
            }
        }
    // 使用对象 对象名.属性名 对象名['属性名']  对象名.方法名() 对象名['方法名']
    console.log(obj.name) //小红
    console.log(obj['sex']) //女
    obj.satHi() //你好
    obj['satHi']()//你好
  1. 利用new Object创建对象
    //创建了一个空对象
    var obj1 = new Object() 
    // 为对象添加属性和方法
    obj1.name = '小红';
    obj1.sex = '女';
    obj1.satHi = function() {
            console.log('你好')
        }
    // 使用同上
  1. 利用构造函数创建对象
    // 为什么需要构造函数:因为我们前面的两种方法创建对象一次只能创建一个对象:如下
    var ldh = {
        name: '刘德华',
        age: 55,
        sing: function() {
            console.log('冰雨')
        }
    }
    var zxy = {
        name: '张学友',
        age: 58,
        sing: function() {
            console.log('李香兰')
        }
    }

   /*  
    因为我们一次创建一个对象,里面很多的属性和方法是大量相同的,我们只能复制,
    因此我们可以利用函数的方法 重复这些相同的代码,我们就把这个函数称为构造函数
    又因为这个函数不一样,里面封装的不是普通代码,而是对象,
    构造函数就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面
     */
    // 利用构造函数创建对象
    // 创建四大天王的对象:相同的属性:名字,年龄,性别, 相同的方法:唱歌
    // 构造函数的语法:
    /* 
    function 构造函数名() {
        this.属性名 = 值;
        this.方法名 = function() {}
    }
    new 构造函数名()
    */
    function Star(uname, uage, usex) {
        this.name = uname;
        this.age = uage;
        this.sex = usex;
        this.sing = function() {
            console.log('唱歌')
        }
    }
    // new Star()就会返回一个对象
    var ldh = new Star('刘德华', 18, '男')
    var zxy = new Star('张学友', 15, '男')
    var gfc = new Star('郭富城', 30, '男')
    var lm = new Star('黎明', 20, '男')
    console.log(ldh) // Star {name: '刘德华', age: 18, sex: '男', sing: ƒ}
    console.log(typeof ldh) //object
    console.log(ldh.name) //刘德华
    // 注意点
    1. 构造函数名字首字母要大写
    2. 构造函数不需要return就可以返回对象
    3. 调用构造函数必须使用new
    4. 只要new 构造函数(),调用了构造函数就会创建一个对象
    5. 属性和方法前面必须添加this

构造函数与对象的区别

    1. 构造函数是泛指某一大类如:明星,车子
    2. 对象是特指某一个具体的事物如:刘德华,五菱宏光
    3. 利用构造函数创建对象的过程也称为对象的实例化

new关键字执行的过程

    // new 关键字执行的过程
     1.new构造函数的时候会在内存中创建了一个空的对象
     2. this就会指向刚才创建的空对象
     3. 执行构造函数里面的代码给空对象添加属性和方法
     4. 返回这个对象

遍历对象

    var obj = {
        name: '小红',
        sex: '男',
        age: 18
    }
    for (var k in obj) {
        console.log(k) //属性名
        console.log(obj[k]) //属性值
    }