首页 > Web开发 > 详细

js面向对象编程

时间:2021-07-02 11:57:29      阅读:20      评论:0      收藏:0      [点我收藏+]

①:字面量方式创建。

其实就是json形式的对象,适用于创建单个对象。

例:var obj = {

  name:"小明",

  age:18,

  run: function(){

    console.log(this.name)

}

}

②:实例创建。

实例创建对象,使用new Object()创建一个实例对象,然后再给这个对象添加属性和方法。

例:var box = new Object();      //创建一个Object对象

  box.name = "小明";            //创建一个name属性并赋值

  box.age= 18;                 //创建一个age属性并赋值

  box.run = function(){           //创建一个run ()方法并返回值

  console.log(this);

  return this.name + ‘--‘ + this.age

}

缺点:想创建一个类似的对象,就会产生大量的代码。

例:var box2 = box                   //得到box的引用

  box2.name = "小明";          //直接改变了name属性

  console.log(box2.run());

  console.log(box.run());      //box的name也改变了

  var box2 = new Object();   //创建一个Object对象

  box2.name = "小红";           

  box2.age= 20;               

  box.run = function(){         

  console.log(this);

  return this.name + ‘--‘ + this.age

  }

  console.log(box2.run())     //这样才避免和box混淆,从而保持独立

③:工厂模式创建对象

解决实例化对象产生大量重复代码的问题;工厂模式创建对象,其实就是函数封装

例:function createObject(name,age){    //集中实例化函数

    var obj = new Object();         //原材料

    obj.name = name;           //加工

    obj.age = age;

    obj.run = function(){

      return this.name + ‘--‘ + this.age;

  };

  return obj;              //出厂

  }

  var box1 = createObject(‘Lee‘ , 100);  //第一个实例

  var box2 = createObject(‘Jack , 200);    //第二个实例

  console.log(box1.run())

  console.log(box2.run())          //保持独立

 工厂模式解决了重复实例化的问题,但是还有一个问题,那就是识别问题,因为根本无法搞清楚他们到底是哪个对象的实例。

例:console.log(typeod box1);    //Object判断对象类型。

  //instanceof运算符,一个对象是否为指定的构造函数的实例,返回布尔值

  console.log(box1 instanceof Object);    //true box1是Object1的实例

  console.log(box1 instanceof createObject);    //false

但是我们box1应该是createObject创建出来的。

④:构造函数创建对象
构造函数创建对象,是使用最多的创建对象的方式,也是将所有的操作都封装在函数中,但是跟工厂模式的创建方式有很大的不同,而且可以明确区分对象的种类。
构造函数的特点:
∝:构造函数名首字母大写(为了区分普通函数,不是必须,是约定)
∝:构造函数方法没有显示的创建对象(new Object())
∝:直接将属性和方法赋值给 this 对象

∝:没有 return 语句,不需要返回对象

∝:通过构造函数创建对象,必须使用 new 运算符(直接调用跟普通函数一样)

js面向对象编程

原文:https://www.cnblogs.com/qiqi400820/p/14956917.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!