Javascript高级教程之创建对象(一)

不多说,JS面向对象开发很重要!它极大的简化了代码,提高了开发效率!一个前端高级程序员必不可少的开发思维!

如何创建对象?

1.直接new一个新对象,以下代码中我们new了一个空对象Object,如何给空对象添加了blood(血量),name,weapon(武器)三个属性以及一个函数表达式;

    new Object()
    var hero = new Object();  // 空对象
    hero.blood = 100;
    hero.name = '刘备';
    hero.weapon = '剑';

    hero.attack = function () {
      console.log(this.weapon + ' 攻击敌人');
    }

2.对象字面量;

    var hero = {};   // 空对象
    var hero1 = {
      blood: 100,
      name: '刘备',
      weapon: '剑',
      attack: function () {
        console.log(this.weapon + ' 攻击敌人');
      }
    }

    hero1.attack();

3.工厂函数–创建多个对象;
工厂函数创建对象的优点在于可创建多个对象,极大简化代码量!但无法查看对象类型

function createHero(name, blood, weapon) {
      var o = new Object();
      o.name = name;
      o.blood = blood;
      o.weapon = weapon;
      this.attack = function () {
        console.log(this.weapon + ' 攻击敌人');
      }
      return o;
    }
    var hero = createHero('刘备', 100, '剑');
    var hero1 = createHero('关羽', 100, '刀');
    console.log(hero);
    hero.attack();
    hero1.attack();
    //无法查看对象类型,返回false
    console.log(hero instanceof createHero);
    //对比,返回true
     var arr = [];
    console.log(arr instanceof Array);

4.构造函数–构造对象的函数;

 function Hero(name, blood, weapon) {
      this.name = name;
      this.blood = blood;
      this.weapon = weapon;

      this.attack = function () {
        console.log(this.weapon + ' 攻击敌人');
      }
    } 
    // 1 会在内存中创建一个空对象
    // 2 设置构造函数的this,让this指向刚刚创建好的对象
    // 3 执行构造函数中的代码
    // 4 返回对象
    var hero = new Hero('刘备', 100, '剑');
    hero.attack();
    
	// 无法使用typeof获取对象的具体类型
	// constructor  构造器 / 构造函数
    // 获取对象的具体类型   不建议
    // console.log(hero.constructor === Hero);
    // var arr = []; //new Array()
    // console.log(arr.constructor === Array);
    
    // instanceof 判断某个对象是否是某个构造函数的实例/对象
    console.log(hero instanceof Hero);
    var arr = [];
    console.log(arr instanceof Array);
     

想获取相关视频的添加微信:lizhi151555

你可能感兴趣的:(Javascript高级教程之创建对象(一))