目录

  • 什么是对象
  • 对象字面量
  • 对象的创建
  • 属性和方法
  • new关键字
  • this详解
  • 对象的使用
    • 遍历对象中的属性
    • 删除对象的属性

今日份脑图,请戳☟[http://naotu.baidu.com/file/dba92f69c1b8a1902944644913d296e6?token=9d7e5519028c2daf]

什么是对象

  • 对象可以是任何东西,但对象是一个具体的事物
//手机不是对象, 手机是一类事物
//但是 一部具体的手机就是一个对象

//汽车也不是对象, 是一类事物
//但是一辆具体的车就是一个对象

// 对象由特征(属性)和行为(方法)组成

//程序中的对象都是现实生活中的事物的抽象
var student = {
    name : 'zs';  //属性
    age : 18;       //属性
    sayHi function() {  //方法
        console.log('hello');
    }
};

对象和函数的区别

  • 函数封装一组代码
  • 对象封装一组属性和方法

对象字面量

语法

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。
var 对象名 = {
    属性名 : ;
    方法名 :;
}
    // eg:创建dog对象
    // 属性:name 昵称  type 品种  age  color
    // 方法:bark 叫   eat  吃
 
var dog = {
            name: 'puppy',
            type: '柯基',
            age: 2,
            color: 'white',
            bark: function() {
                console.log(this.name + ':wangwangwang');
            },
            eat: function() {
                console.log(this.name + ':啃骨头');
            }
        }
        console.log(dog.name); //访问属性
        console.log(dog['age']); //访问对象的另一种方法
        dog.bark(); //访问方法

创建一个对象

//第一种
  // 创建一个hero对象
        // 属性:name 名字  装备  weapon 武器  blood 
        // 方法:attack 攻击   run

        var hero = {
            name: '兰陵王',
            equipment: ['头盔', '靴子', '盔甲'],
            weapon: '泣血之刃',
            blood: 100,
            attact: function() {
                console.log(this.name + '加速攻击');
            },

            run: function() {
                console.log(this.name + '加速跑');
            }
        }
        console.log(hero.name);
        hero.attact();
        hero.run();
        
// 第二种 用newObject()创建一个新的对象
        var hero = new Object(); //创建了一个空对象
        //打印一个不存在的属性返回值为undefined
        //console.log(hero.name); // undefined
        hero.name = '兰陵王';
        hero.equipment = ['头盔', '靴子', '盔甲'];
        hero.weapon = '泣血之刃';
        hero.blood = 100;
        hero.attack = function() {
            console.log(this.name + '加速攻击');
        }
        hero.run = function() {
            console.log(this.name + '飞速跑');
        }
        console.log(hero.name);
        hero.attack();
//第三种 工厂方法
        function creatHeroes(name, equipments, weapon, blood) {
            var hero = new Object();
            hero.name = name;
            hero.equipments = equipments;
            hero.weapon = weapon;
            hero.blood = blood;
            hero.attack = function() {
                console.log(this.name + '攻击');
            }
            hero.run = function() {
                console.log(this.name + '加速跑');
            }
            return hero;
        }
        var hero1 = creatHeroes('黄忠', ['鞋子, 背包, 炮弹'], '枪', 100);
        var hero2 = creatHeroes('刘备', '鞋子', '剑', 100);
        console.log(hero2);

        // 4 自定义构造函数
        function Heroes(name, equipments, weapon, blood) {
            this.name = name;
            this.equipments = equipments;
            this.weapon = weapon;
            this.blood = blood;
            this.attack = function() {
                console.log(this.name + '攻击');
            }
            return hero;
        }
        this.run = function() {
            console.log(this.name + '加速跑');
        }
        var hero = new Heroes('刘备', '鞋子', '剑', 100);
        console.log(hero);

属性和方法

  • 如果一个变量属于一个对象所有,那么该变量就可以称之为该对象的一个属性,属性一般是名词,用来描述事物的特征
  • 如果一个函数属于一个对象所有,那么该函数就可以称之为该对象的一个方法,方法是动词,描述事物的行为和功能

new 关键字

构造函数 ,是一种特殊的函数。主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。

  • 构造函数用于创建一类对象,首字母要大写。
  • 构造函数要和new一起使用才有意义。

new在执行时会做四件事情

new会在内存中创建一个新的空对象
new 会让this指向这个新的对象
执行构造函数  目的:给这个新对象加属性和方法
new会返回这个新对象

this详解

  • 函数在定义的时候this是不确定的,只有在调用的时候才可以确定
  • 一般函数直接执行,内部this指向全局window
funtion fn() {
    console.log(this);
}
fn();
  • 函数作为一个对象的方法,被该对象所调用,那么this指向的是该对象
 var student = {
            name: 'zs',
            age: 18,
            class: 'one',
            learn: function() {
                console.log(this.name + ' learn English');
            }
        }
        student.learn();
  • 在构造函数中,this就是构造函数创建的对象
// 在构造函数中,this就是构造函数创造的对象
       function person(name, age, classes) {
           this.name = name;
           this.age = age;
           this.classes = classes;
           this.learn = function() {
               console.log(this.name + ' learn English');
           }
       }
       for (var name in person) {
           console.log(name + '==' + person(name));
       }
       var student = new person('王五', 18, 'one');

       console.log(student.name);

对象的使用

遍历对象的属性和方法

通过for..in语法可以遍历一个对象

 var student = {
            name: 'zs',
            age: 8,
            classes: 'one',
            learn: function() {
                console.log(this.name + '正在学习');
            }
        }
        for (var key in student) {
            console.log(key + '===' + student[key]);
        }

删除对象的属性和方法

delete 对象名.属性名或 delete.方法名

function fun() { 
  this.name = 'mm';
}
var obj = new fun(); 
console.log(obj.name); // mm 
delete obj.name;
console.log(obj.name); // undefined

Bye for now!

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄