ECMAScript有两种开发模式:

1.函数式(过程化)

2.面向对象(OOP)。

面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象。但是,ECMAScript没有类的概念,因此它的对象也与基于类的语言中的对象有所不同。

创建对象

创建一个对象,然后给这个对象新建属性和方法。

方法一:基本写法

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

  box.name = 'Lee';//创建一个 name属性并赋值

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

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

    return this.name + this.age + '运行中...';

  };

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

方法二:工厂模式的方法

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);//第二个实例

alert(box1.run());   //Lee100运行中...

alert(box2.run());   //Jack200运行中...

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

方法三:构造函数(构造方法)

function Box(name, age) {//构造函数模式

  this.name = name;

  this.age = age;

  this.run = function () {

    return this.name + this.age + '运行中...';

  };

}

var box1 = new Box('Lee', 100);

var box2 = new Box('Jack',200);

alert(box1.run());
alert(box1 instanceof Box); //很清晰的识别他从属于 Box

使用构造函数的方法,即解决了重复实例化的问题,又解决了对象识别的问题

构造函数的方法和工厂模式的方法有何不同之处?

1.构造函数方法没有显式的创建对象(new Object());
2.直接将属性和方法赋值给 this 对象;
3.没有 return 语句。
构造函数的方法有一些规范:
1.函数名和实例化构造名相同且大写,(PS:非强制,但这么写有助于区分构造函数和普通函数);
2.通过构造函数创建对象,必须使用 new 运算符。

既然通过构造函数可以创建对象,那么这个对象是哪里来的,new Object()在什么地方执行了?

执行的过程如下:
1.当使用了构造函数,并且 new 构造函数(),那么就后台执行了 new Object();
2.将构造函数的作用域给新对象,(即 new Object()创建出的对象),而函数体内的 this 就代表 new Object()出来的对象。
3.执行构造函数内的代码;
4.返回新对象(后台直接返回)。

构造函数和普通函数的唯一区别,就是他们调用的方式不同。只不过,构造函数也是函数,必须用 new 运算符来调用,否则就是普通函数。

判断一个对象是否指向了该构造函数的原型对象,可以使用 isPrototypeOf()方法来测试。

alert(Box.prototype.isPrototypeOf(box));            //只要实例化对象,即都会指向

js面向对象概念解析的更多相关文章

  1. js面向对象学习 - 对象概念及创建对象

    原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...

  2. JS作用域概念-预解析规则

    // 作用域: // 域:空间.范围.区域…… // 作用:读.写 script 全局变量.全局函数 自上而下 函数 由里到外 {} 浏览器: “JS解析器” 1)“找一些东西” :var funct ...

  3. 全面理解js面向对象

    前言 当今 JavaScript 大行其道,各种应用对其依赖日深.web 程序员已逐渐习惯使用各种优秀的 JavaScript 框架快速开发 Web 应用,从而忽略了对原生 JavaScript 的学 ...

  4. JS面向对象笔记二

    菜单导航,<JS面向对象笔记一>,  参考书籍:阮一峰之<JavaScript标准参考教程> 一.构造函数和new命令 二.this关键字 三.构造函数和new命令 四.构造函 ...

  5. js面向对象(对象/类/工厂模式/构造函数/公有和原型)

    https://www.cnblogs.com/sandraryan/ 什么是对象 js中一切都是对象(有行为和特征).js允许自定义对象,也提供了内建对象(string date math等) 对象 ...

  6. 大话JS面向对象之开篇万物皆对象------(ATM取款机引发的深思)

    一,总体概要 OO(面向对象)概念的提出是软件开发工程发展的一次革命,多年来我们借助它使得很多大型应用程序得以顺利实现.如果您还没有掌握并使用OO进行程序设计和开发,那么您无疑还停留在软件开发的石器时 ...

  7. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  8. JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  9. JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

随机推荐

  1. 2014 Container技术大会:未来Linux Container会是PaaS平台的核心

    不应错过2014 Container技术大会的九大理由. 一.Docker官方人员再次来到北京,首次向中国布道Docker技术.2013年Docker高级软件工程师Jerome Petazzoni,曾 ...

  2. uva 1658 Admiral 【 最小费用最大流 】

    拆点,每个点拆成 i,i' 在i 和i‘之间连一条费用为0,容量为1的边,就可以保证每个点只经过一次 特殊的点,1和n之间,,,n和2*n之间连一条费用为0,容量为2的边,可以求出两条路径 #incl ...

  3. spring之interceptor篇

    springmvc中要写一个拦截器非常的简单,有两种方式:要么实现HandlerInterceptor接口或者继承实现了该接口的类,如spring已经为我们写好的一个HandlerIntercepto ...

  4. CorelDRAW X8官方正版特惠下载

    CorelDRAW X8自发布以来,价格居高不下,这也使一众忠粉望而却步,之前看过CorelDRAW做活动,都是X6\X7这些比较早的版本,比较新的版本也没做什么优惠,不过还好看了一下,CorelDR ...

  5. 优动漫PAINT是什么?有哪些功能和特色

    优动漫PAINT软件介绍: 优动漫PAINT是一款功能强大的漫画制作软件,该软件可以帮助漫画创作人员制作出完美,惟妙惟肖的漫画作品,它搭载了绘制漫画和插画所需的所有功能--丰富的笔工具.超强的笔压感应 ...

  6. jsoup解析页面

    package com.java.jsoup; /** * jsoup解析网页 * @author nidegui * @version 2019年4月29日 下午5:12:02 * */ impor ...

  7. 企业级任务调度框架Quartz(4) 多个job实例注册到任务调度器上

    前序:     在第一个例子我看到了自定义的作业类在任务调度器上注册后,则通过任务调度器来实现启动:下面,我们将同一个作业类执行两个任务,并都将他们注册到任务调度器上!     首先一个job类指向两 ...

  8. VS Code中编写html(3) 标签的宽高颜色背景设置

    1 创建一个div标签: <body> <div> 这是一个div标签: </div> </body> 变成了圆圆的,是因为后面有设置了样式: back ...

  9. timeval的时间转换成毫秒之后多大的数据类型可以装下

    struct timeval { long tv_sec; /*秒*/ long tv_usec; /*微秒*/ }; 秒的定义为long,为了防止溢出,转换成毫秒之后保存在long long中

  10. vim+astyle安装使用

    astyle下载安装 wget https://sourceforge.net/projects/astyle/files/astyle/astyle%203.1/astyle_3.1_linux.t ...