js基础---对象

1.对象是由属性和方法组成的。
2.创建方式:

  • 利用字面量创建对象
  • 利用 new Object 创建对象
  • 利用 构造函数创建对象

1 字面量

<script>
   //1.创建对象
    var dog = {
    
    
            name: '可可',
            type: '阿拉斯加犬',
            age: 5,
            color: 'brown',
            bark: function() {
    
    
                console.log('汪汪汪');
            },
            showFilm: function() {
    
    
                console.log('导盲犬');
            }
        }
    //2访问
    //(1)访问属性
    console.log(dog.name);
    console.log(dog['age']);
    //(2)访问方法
    dog.bark();
    dog.showFilm();
</script>

2 new Object

<script>
        //1.创建对象
        var person = new Object();
        person.name = '鸣人';
        person.sex = '男';
        person.age = 19;
        person.showSkill = function() {
    
    
            console.log('影分身术');
        };

        //2访问
        //(1)访问属性
        console.log(person.name);
        console.log(person['age']);
        //(2)访问方法
        person.showSkill();
    </script>

3 构造函数

将对象中一些公共的属性和方法抽取出来,封装到函数里

<script>
        //构造函数
        function Hero(name, type, blood, attack) {
    
    
            this.name = name;
            this.type = type;
            this.blood = blood;
            this.attack = attack;

            this.introduce = function() {
    
    
                console.log(this.name + this.type + this.blood + this.attack);
            }
        }
        //创建对象
        var hero1 = new Hero('廉颇', '力量型', '500血量', '近战');
        var hero2 = new Hero('后羿', '射手型', '100血量', '远程');
        //访问属性
        console.log(hero1.name);
        console.log(hero1['type']);
        //访问方法
        hero1.introduce();
    </script>

注意:

  1. 构造函数约定首字母大写。
  2. 函数内的属性和方法前面需要添加this ,表示当前对象的属性和方法。
  3. 构造函数中不需要return 返回结果。
  4. 当我们创建对象的时候,必须用new 来调用构造函数。

new的作用:

  1. 在内存中创建一个新的空对象。
  2. 让 this 指向这个新的对象。
  3. 执行构造函数里面的代码,给这个新对象添加属性和方法。
  4. 返回这个新对象(所以构造函数里面不需要return)。

遍历对象的属性:

for (var k in obj) {
     console.log(k); // 这里的 k 是属性名 
     console.log(obj[k]); // 这里的 obj[k] 是属性值 
}

例如:

<script>
    var star = {
    
    
        name: '小新',
        age: 18,
        sex: '男',
        sayHi: function() {
    
    
            alert('大家好啊~');
        }
    };
    for (key in star) {
    
    
        console.log(key); //属性
        console.log(star[key]); //属性值
    }
</script>

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/pilgrim_121/article/details/113040640