Javascript 面向对象实践

踩到了坑,才能学到东西。

记录我在慢慢的转向模块化遇到的问题以及解决的思路。

1.采用立即执行函数,闭包的方式创建模块

html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Module</title>
    <script type="text/javascript" src="store.js"></script>
    <script type="text/javascript">
        var store = storeModule.getStore({x:1});
    </script>
</head>
<body>

</body>
</html>

js:


var storeModule = (function(){
    var Store = function(opinion){
        this.opinion = opinion;
    }

    Store.prototype = {
        constructor:Store,
        init:function(opinion){
            console.log('a:',opinion);
            this.opinion = opinion;
            console.log('b:',this.opinion);
        }
    }

    return {
        getStore:function(opinion){
            var storeInstance = Object.create( Store.prototype );
            Store.prototype.init.apply(storeInstance,arguments);

            // var storeInstance2 = new Store(opinion);
            // storeInstance2.init(opinion);
            console.log('store end');
            return storeInstance;
        }
    }

})();

坑:
采用 Object.create( Store.prototype ) 这种方式创建对象,无法将参数opinion传递给Store这个function对象,百思不得其解,后来,参阅了一下Jquery的插件的源码,发现需要在 init:function(opinion)中增加一行this.opinion = opinion,否则传递不过去。

时间: 2024-07-31 18:37:49

Javascript 面向对象实践的相关文章

JavaScript 面向对象代码实践_js面向对象

因此很有必要在这里为同学们举一个例子: JavaScript面向对象代码示例 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

《JavaScript面向对象编程指南》——1.6 OOP概述

1.6 OOP概述 JavaScript面向对象编程指南 如果您在面向对象程序设计方面是一个新手,或者您不能确定自己是否真的理解了上面这些概念,请不必太担心.以后我们还会通过一些代码来为您具体分析它们.尽管这些概念说起来好像很复杂.很高级,但一旦进入真正的实践,事情往往就要简单得多. 话虽如此,但还是先让我们再来复习一下这些概念吧(见表1-1).

浅谈javascript 面向对象编程_js面向对象

感叹是为了缓解严肃的气氛并引出今天要讲的话题,"javascript面向对象编程",接下来,我们围绕面向对象的几大关键字:封装,继承,多态,展开. 封装:javascript中创建对象的模式中,个人认为通过闭包才算的上是真正意义上的封装,所以首先我们先来简单介绍一下闭包,看下面这个例子: 复制代码 代码如下: <script type="text/javascript"> function myInfo(){ var name ="老鱼&quo

老鱼 浅谈javascript面向对象编程_js面向对象

感叹是为了缓解严肃的气氛并引出今天要讲的话题,"javascript面向对象编程",接下来,我们围绕面向对象的几大关键字:封装,继承,多态,展开. 封装:javascript中创建对象的模式中,个人认为通过闭包才算的上是真正意义上的封装,所以首先我们先来简单介绍一下闭包,看下面这个例子: 复制代码 代码如下: <script type="text/javascript">// <![CDATA[ function myInfo(){ var nam

js面向对象 编程: JavaScript 面向对象编程,严格过程的标准化编程法,目前为止最好的 JS 生成对象代码结构

市面上流行了很多 JavaScript 面向对象的编程方法,其中不少都有好些问题.这里总结最正确的 JavaScript 面向对象编程模式.对于类 Special 继承自类 Common 继承自类 Super 的情况,一个 Special 对象的创建,详细说来,应该经历以下步骤.1 确定继承关系1.1 读取 Special 的父类,发现是 Common1.2 读取 Common 的父类,发现是 Super1.3 读取 Super 的父类,发现没有了(隐形父类 Object)2 加载类结构(如果没

JavaScript面向对象的支持(4)

javascript|对象 ================================================================================Qomolangma OpenProject v0.9 类别    :Rich Web Client关键词  :JS OOP,JS Framwork, Rich Web Client,RIA,Web Component,          DOM,DTHML,CSS,JavaScript,JScript 项目发

JavaScript面向对象的支持(3)

javascript|对象 ================================================================================Qomolangma OpenProject v0.9 类别    :Rich Web Client关键词  :JS OOP,JS Framwork, Rich Web Client,RIA,Web Component,          DOM,DTHML,CSS,JavaScript,JScript 项目发

JavaScript面向对象的支持(1)

javascript|对象 ================================================================================Qomolangma OpenProject v0.9 类别    :Rich Web Client关键词  :JS OOP,JS Framwork, Rich Web Client,RIA,Web Component,          DOM,DTHML,CSS,JavaScript,JScript 项目发

JavaScript面向对象的支持(6)

javascript|对象 ======================================================================Qomolangma OpenProject v0.9 类别    :Rich Web Client关键词  :JS OOP,JS Framwork, Rich Web Client,RIA,Web Component,          DOM,DTHML,CSS,JavaScript,JScript 项目发起:aimingoo