简单分析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 相关文章推荐
扩展jQuery 键盘事件的几个基本方法
Oct 30 Javascript
jQuery 选择器项目实例分析及实现代码
Dec 28 Javascript
js中创建对象的几种方式示例介绍
Jan 26 Javascript
教你如何使用PHP输出中文JSON字符串
May 22 Javascript
js生成随机数的过程解析
Nov 24 Javascript
JS控制TreeView的结点选择
Nov 11 Javascript
JS实现元素上下左右移动效果
Oct 18 Javascript
解决vue-router中的query动态传参问题
Mar 20 Javascript
浅谈vue首屏加载优化
Jun 28 Javascript
jQuery实现的老虎机跑动效果示例
Dec 29 jQuery
多个vue子路由文件自动化合并的方法
Sep 03 Javascript
ElementUI之Message功能拓展详解
Oct 18 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
应用开发中涉及到的css和php笔记分享
2011/08/02 PHP
PHP封装的MSSql操作类完整实例
2016/05/26 PHP
用PHP将Unicode 转化为UTF-8的实现方法(推荐)
2017/02/08 PHP
PHP观察者模式实例分析【对比JS观察者模式】
2019/05/22 PHP
用JavaScript获取DOM元素位置和尺寸大小的方法
2013/04/12 Javascript
点击按钮或链接不跳转只刷新页面的脚本整理
2013/10/22 Javascript
JS的参数传递示例介绍
2014/02/08 Javascript
JS实现一个列表中包含上移下移删除等功能
2014/09/24 Javascript
node.js中的fs.existsSync方法使用说明
2014/12/17 Javascript
分享一则javascript 调试技巧
2015/01/02 Javascript
jQuery基础_入门必看知识点
2016/07/04 Javascript
js实现仿购物车加减效果
2017/03/01 Javascript
jquery手机触屏滑动拼音字母城市选择器的实例代码
2017/12/11 jQuery
详解JavaScript中typeof与instanceof用法
2018/10/24 Javascript
vue组件 keep-alive 和 transition 使用详解
2019/10/11 Javascript
JavaScript计算正方形面积
2019/11/26 Javascript
vuejs实现下拉框菜单选择
2020/10/23 Javascript
vue实现lodop打印功能的示例
2020/11/11 Javascript
Python常见读写文件操作实例总结【文本、json、csv、pdf等】
2019/04/15 Python
Django的CVB实例详解
2020/02/10 Python
解决Python发送Http请求时,中文乱码的问题
2020/04/30 Python
pyspark对Mysql数据库进行读写的实现
2020/12/30 Python
tensorflow与numpy的版本兼容性问题的解决
2021/01/08 Python
EVE LOM英国官网:全世界最好的洁面膏
2017/10/30 全球购物
俄罗斯茶和咖啡网上商店:Tea.ru
2021/01/26 全球购物
SQL Server数据库笔试题和答案
2016/02/04 面试题
命名空间(namespace)和程序集(Assembly)有什么区别
2015/09/25 面试题
幼儿园实习自我鉴定
2013/12/15 职场文书
公司业务员岗位职责
2014/03/18 职场文书
员工安全承诺书
2014/05/22 职场文书
课外访万家心得体会
2014/09/03 职场文书
大学生党员批评与自我批评
2014/09/28 职场文书
投标文件签署授权委托书范本
2014/10/12 职场文书
学校党支部公开承诺书
2015/04/30 职场文书
温馨祝福晨语:美丽的一天从我的问候开始
2019/11/28 职场文书
python3 实现mysql数据库连接池的示例代码
2021/04/17 Python