简单分析javascript面向对象与原型


Posted in Javascript onMay 21, 2015

本文主要内容参考来自JavaScript高级程序设计,面向对象与原型章节:

1、工厂模式

ECMAScript 可以通过工厂模式来创建对象:

//工厂模式
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 obj1 = createObject('Lee', 100);          //创建第一个对象
var obj2 = createObject('Jack', 200);          //创建第二个对象
//alert(obj1.run());                          //打印第一个对象实例的run()方法
//alert(obj2.run());                          //打印第二个对象实例的run()方法

//alert(typeof obj1);
//alert(typeof obj2);
alert(obj1 instanceof Object); //true
alert(obj2 instanceof Object); //true

通过工厂模式创建的对象,解决了重复实例化问题,但对象识别问题无法解决(所有对象均是Object),因此要想解决对象识别问题,我们采用下面的构造函数。

2、构造函数

//构造函数创建
function Person(name,age){  //所有构造函数对象都是Object
  this.name=name;
  this.age=age;
  this.run=function(){
    return this.name+this.age+"ing...";
  };
};
var person1=new Person('zhu1',100);
var person2=new Person('zhu2',200);
alert(person1.run());
alert(person2.run());

alert(person1 instanceof Object); //ture
alert(typeof person2);         //Person
alert(person2 instanceof Person);  // true
var person3=new Object();
Person.call(person3,'zhu3',300);//对象冒充,person3是Object类型,冒充Person类型
alert(person3.run());

构造函数中this:代表当前作用域对象的引用,如果在全局范围this代表window对象,如果在构造函数体内,就代表当前构造函数所声明的对象。

构造函数方法,及解决了重复实例化问题,有解决了对象识别问题,对比跟工厂方法不同之处可知:

1.构造函数方法没有显示的创建对象(new Object());

2.直接将属性和方法值赋值给this;

3.没有return 语句;

4.但是使用构造函数创建必须使用new运算符;

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
javascript 学习之旅 (2)
Feb 05 Javascript
JavaScript和JQuery实用代码片段(一)
Apr 07 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
Sep 03 Javascript
jQuery制作简洁的多级联动Select下拉框
Dec 23 Javascript
JavaScript中的Math.SQRT1_2属性使用简介
Jun 14 Javascript
浅谈javascript中return语句
Jul 15 Javascript
jQuery的文档处理程序详解
May 10 Javascript
BootStrap中Datepicker控件带中文的js文件
Aug 10 Javascript
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
Vue + better-scroll 实现移动端字母索引导航功能
May 07 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
Nov 02 Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 Javascript
jQuery获取上传文件的名称的正则表达式
May 21 #Javascript
js兼容火狐获取图片宽和高的方法
May 21 #Javascript
js兼容火狐显示上传图片预览效果的方法
May 21 #Javascript
javascript去除空格方法小结
May 21 #Javascript
删除javascript所创建子节点的方法
May 21 #Javascript
png在IE6 下无法透明的解决方法汇总
May 21 #Javascript
javascript相关事件的几个概念
May 21 #Javascript
You might like
overlord人气高涨,却被菲利普频繁举报,第四季很难在国内上映
2020/05/06 日漫
3.从实例开始
2006/10/09 PHP
关于文本留言本的分页代码
2006/10/09 PHP
关于访问控制的一首PHP面试题(对属性或方法的访问控制)
2012/09/13 PHP
php命名空间学习详解
2014/02/27 PHP
Ubuntu 16.04下安装PHP 7过程详解
2017/03/28 PHP
PHP静态方法和静态属性及常量属性的区别与介绍
2019/03/22 PHP
javascript 火狐(firefox)不显示本地图片问题解决
2008/07/05 Javascript
基于jquery的表头固定的若干方法
2011/01/27 Javascript
33个优秀的 jQuery 图片展示插件分享
2012/03/14 Javascript
javascript级联下拉列表实例代码(自写)
2013/05/10 Javascript
json中换行符的处理方法示例介绍
2014/06/10 Javascript
jQuery实现表格颜色交替显示的方法
2015/03/09 Javascript
javascript实现tab切换的两个实例
2015/11/05 Javascript
angularjs表格分页功能详解
2016/01/21 Javascript
Bootstrap table分页问题汇总
2016/05/30 Javascript
JQuery的attr 与 val区别
2016/06/12 Javascript
JavaScript之filter_动力节点Java学院整理
2017/06/28 Javascript
js中自定义react数据验证组件实例详解
2018/10/19 Javascript
微信小程序实现时间预约功能
2018/11/27 Javascript
element-ui树形控件后台返回的数据+生成组织树的工具类
2020/03/05 Javascript
Python中asyncore的用法实例
2014/09/29 Python
Python使用Supervisor来管理进程的方法
2015/05/28 Python
Python的collections模块中namedtuple结构使用示例
2016/07/07 Python
Python sqlite3事务处理方法实例分析
2017/06/19 Python
Python中super函数用法实例分析
2019/03/18 Python
Python生成个性签名图片获取GUI过程解析
2019/12/16 Python
解决Python3.7.0 SSL低版本导致Pip无法使用问题
2020/09/03 Python
WEB控件及HTML服务端控件能否调用客户端方法?如果能,请解释如何调用?
2015/08/25 面试题
骨干教师培训感言
2014/01/16 职场文书
个人合作协议书范本
2014/04/18 职场文书
任长霞观后感
2015/06/16 职场文书
2017元旦、春节期间廉洁自律承诺书
2016/03/25 职场文书
大学毕业生自我鉴定范文
2019/06/21 职场文书
诗词赏析-(浣溪沙)
2019/08/13 职场文书
CSS3实现的3D隧道效果
2021/04/27 HTML / CSS