`
cuitongxin
  • 浏览: 27070 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

JavaScript 原理详解之类声明及对象创建

    博客分类:
  • js
js 
阅读更多

/**

 * 讲述js中类的声明及对象的创建方式

 * @author cuitongxin

 */

/**

 * 1、工厂方法来创建javaScript对象

 * 缺点:该方法创建的实力都有一个独立的函数,而不是多个实例共用同一个函数。

 */

function createObject () {

var obj = new Object;

obj.color = "red";

obj.name = "object to object";

obj.sayName = function () {

alert(this.name);

}

return obj;

}

 

//采用函数指针的问题来解决共享同一个函数的问题,但是该函数看起来不像对象的方法,倒是像对象的属性

function showMsg () {

alert(this.msg);

}

 

function createObject2 (ss,tt,dd) {

var obj = new Object;

obj.ss = "ss";

obj.msg = tt;

obj.dd = "dd";

obj.showMsg = showMsg;

return obj;

}

 

/**

 * 2、上面的问题引起了构造函数的出现

 * 当采用 var car = new Car("sss","dddd","tt");形式来创建对象时,实际执行的步骤如下:

 * (1)、首先在执行构造函数的第一行代码前,先去创建一个对象,然后把它付给当前的this指针。

 * (2)、执行后面的代码为this附上属性值。

 * (3)、执行完相关的操作之后,构造函数通过new 的系统操作默认返回 this对象。

 * 

 * 缺点:构造函数仍然会为不同的实力独立的创建函数,如果采用工厂方法中的外部指针的方式,也会引起语义的问题。

 */

function Car (ss,dd,tt) {

this.ss = ss;

this.dd = dd;

this.tt = tt;

this.showMsg = function  () {

 alert(this.ss);

}

}

 

/**

 * 3、原型方式

 * 该方式利用了对象的prototype属性,可以把它看作创建新对象所依赖的原型。

 * 当执行:var car = new Car(); 实际执行步骤如下:

 * (1)、原型的所有属性都被立即的赋予要创建的所有对象。函数赋值,付的是指向函数的指针--引用。

 * (2)、new 操作本身会返回要创建的对象。

 * 

 * 缺点:

 * 1、使用原型方式,不能给构造函数传递参数值。

 * 2、当属性指向的是对象而不是函数时,所有的实力将共享该对象,引起并发访问的问题。

 */

function Car () {

 

}

Car.prototype.msg = "msg";

Car.prototype.showMsg = function () {

alert(this.msg);

}

 

 

/**

 * 4、构造函数和原型的方式一起使用,来解决上面存在的问题。混合 构造函数/原型 方式

 * 设计步骤:

 * (1)、用构造函数来定义对象的所有非函数属性。

 * (2)、用原型方式来定义对象的函数属性。

 * 结果:所有的函数只创建一次,而每个对象都有属于自己的属性实例

 */

function Car (ss,dd) {

this.ss = ss;

this.dd = ss;

this.aVal = new Array("ss","dd","tt");

}

Car.prototype.showMsg = function () {

alert(this.ss);

}

 

/**

 * 5、动态的原型方式

 * 原因:考虑到和其他的语言一样把属性和方法封装在一起。

 */

function Car (dd,tt) {

this.dd = dd;

this.tt = tt;

this.aDeriver = new Array("sss","dddd");

if(typeof Car._initialized == "undefined") {

Car.prototype.showMsg = function  () {

 alert(this.tt);

}

Car._initialized = true;

}

}

 

 

/**

 * 6、混合工厂方式

 * 说明:该方式创建假的构造函数,只返回另一对象的新实例。

 * 使用方式:var car = new Car(); 执行步骤:

 * (1)、忽略掉外部的 new 关键字,执行内部的 new 关键字。

 */

function Car () {

  var obj = new Object;

  obj.ss = "ss";

  obj.tt = "tt";

  obj.showMsg = function () {

  alert(this.tt);

  }

  return obj;

}


分享到:
评论

相关推荐

    JavaScript对象模型-执行模型

    ### JavaScript对象模型-执行模型详解 #### 一、基本数据类型 JavaScript作为一种广泛使用的脚本语言,在其设计之初便提供了一系列的基本数据类型,这些类型构成了JS语言的基础,并且是理解和运用JS的重要基石。 ...

    JavaScript 使用详解

    JavaScript的基础包括变量声明(`var`, `let`, `const`)、数据类型(如字符串、数字、布尔值、对象、数组等)、操作符(算术、比较、逻辑)、流程控制(条件语句`if...else`、循环`for`, `while`)以及函数的使用...

    JavaScript实战.pdf 中文完整版

    JavaScript,作为全球最广泛使用的编程语言之一,是前端开发的核心技术,也是许多后端和全栈开发者的必备技能。本书“JavaScript实战.pdf 中文完整版”深入浅出地介绍了JavaScript在实际项目中的应用,旨在帮助读者...

    完全手册-JavaScript动态网页开发详解

    JavaScript作为Web开发的核心语言之一,其功能强大且灵活性高,被广泛应用于创建交互式网站。以下是对“JavaScript动态网页开发详解”这一主题的关键知识点进行的详尽解读。 ### 一、JavaScript基础 #### 1.1 ...

    【JavaScript源代码】详解JavaScript的垃圾回收机制.docx

    在JavaScript中,字符串、对象、数组等数据类型的内存分配通常是动态的,即根据程序运行的实际需求来决定何时分配及分配多少内存。这些数据所占用的内存在不再使用时应当被释放,以避免内存耗尽的情况发生。因此,...

    javascript

    3. **对象模型**:JavaScript主要基于原型的对象模型,而Java使用基于类的对象模型。 4. **用途**:Java通常用于服务器端开发和桌面应用程序开发,而JavaScript主要用于Web前端开发。 #### 四、JavaScript基本语法...

    变量对象概念

    ### 变量对象概念详解 #### 一、引言 在JavaScript编程中,函数和变量是构建系统的基石。然而,当我们在代码中声明并使用这些元素时,它们是如何被JavaScript引擎解析和处理的呢?本篇文章将深入探讨“变量对象”这...

    javascript教程

    JavaScript教程详解:带你深入理解与实战 JavaScript,作为全球最广泛使用的编程语言之一,是构建交互式网页和网络应用的核心工具。本教程旨在为初学者和有经验的开发者提供一个全面且深入的学习资源,帮助你们掌握...

    《实战ES2015:深入现代JavaScript 应用开发》.pdf

    ### 实战ES2015:深入现代JavaScript应用开发 #### ES2015(ES6)概述 ES2015(ECMAScript 2015),也被称为ES6,是JavaScript语言的一种规范标准,它在原有的ES5基础上进行了一次重大的更新与升级。ES2015引入了...

    Javascript教程

    - 对象创建与属性操作 - 数组方法(push、pop、shift、unshift等) - 遍历对象与数组的方法 5. **第五章:DOM操作** - DOM的概念与结构 - 获取元素、修改元素属性 - 动态创建与删除DOM节点 6. **第六章:...

    web编程基础试题及答案

    - **窗口对象 `window`**:代表浏览器窗口,是所有JavaScript全局对象、函数以及变量的直接父级。 - **文档对象 `document`**:封装整个HTML文档的对象,通过它可以访问和修改网页上的任何元素。 **5. 复选框的...

    java笔试面试题汇总 基础版 最新 最全

    - **对象实例化**:通过类创建对象的过程称为实例化。 - **类与对象的关系**:类是对象的模板或蓝图,而对象则是类的具体实例。 #### 3. 字符串处理 - **面试题背景**:字符串是编程中最常用的数据类型之一,...

    06 You Don't Know JS:ES6 & Beyond.pdf

    - 讨论WeakMap对象的特点及其与普通Map对象的不同之处。 - 分析WeakMap对象如何帮助优化内存使用。 4. **Sets Set对象** - 介绍Set对象的概念及其在集合操作中的应用。 - 探讨Set对象如何提供更高效的数据去重...

    Javascript 设计模式(二) 闭包

    ### JavaScript设计模式之闭包详解 #### 一、闭包概念与原理 闭包是JavaScript中一个非常重要的概念,它不仅是理解高级编程技巧的基础,也是深入掌握JavaScript内存管理的关键之一。简单来说,**闭包**就是一个...

    软通面试题

    1. **创建Servlet对象**:首次请求Servlet时,服务器通过反射机制创建Servlet对象。 2. **初始化**:调用`init()`方法进行初始化操作,该方法只会执行一次。 3. **服务请求**:`service()`方法会根据HTTP请求类型...

    java面试题实践收集及答案详解

    ### Java面试题实践收集及答案详解 #### 一、Java基础知识与面试题解析 ##### 1. 面试时应注意哪些事项? - **技术准备**:深入理解Java基础(如集合框架、多线程、异常处理等)、设计模式、算法与数据结构。 - *...

Global site tag (gtag.js) - Google Analytics