了解JavaScript中的函数和模块

我想更好地理解JavaScript中的函数和模块，特别是了解创建我自己的数据类型的最佳方法。我列出了下面的两个文件，Rectangle1.js和Rectangle2.js，以及它们的示例输出，这些输出是我为了更好地理解这一点而创建的。了解JavaScript中的函数和模块

我希望社区帮助我理解哪些（或哪种方式）是构建我的代码以创建自己的数据类型的最佳方式。

Rectangle1.js

function Rectangle(x,y,w,h) { 
    width = w; 
    height = h; 

    this.area1 = function() { 
    return width*height; 
    } 
} 

Rectangle.prototype.area2 = function() { 
    return width * height; 
}; 

Rectangle.area3 = function() { 
    return width * height; 
} 

exports.Rectangle = Rectangle;

Rectangle2.js

var RECTANGLE = (function(my) { 
    function init(x,y,w,h) { 
    this.w = w; 
    this.h = h; 
    } 

    function area() { 
    return this.w * this.h; 
    } 

    my.init = init; 
    my.area = area; 
    return my; 
})(RECTANGLE || {}); 

exports.RECTANGLE = RECTANGLE;

样本相互作用

var r2 = require('Rectangle2.js'); 
r2.RECTANGLE.init(1,2,3,4); 
r2.RECTANGLE // ...can see the private properties 
r2.RECTANGLE.area() // returns 12 

var r1 = require('Rectangle1.js'); 
r1 // shows area3 in r1 
var rect = new r1.Rectangle(1,2,3,4); 
rect // shows area1 in rect 
rect.area1() // visible in methods, spits out 12 
rect.area2() // not visible in methods, spits out 12 
r1.Rectangle.area3() // not visible in rect, spits out 12

来源

2013-01-12 appa

优选STRUC的方式javascript中的图灵对象与您在Rectangle1.js中编写的内容更接近，但存在一些问题：

首先，在接受Rectangle(x,y,w,h)构造函数中的参数时，不会将它们分配给实例变量，而是分配给有点不安全的全球范围，这就解释了为什么Rectangle.area3()返回相同的结果。关键字this允许您分配和访问实例变量。保持一切一样，你宁愿需要像这样定义构造函数（请注意使用的this.）：

function Rectangle(x,y,w,h) { 

    this.width = w; 
    this.height = h; 

    this.area1 = function() { 
    return this.width*this.height; 
    } 
} 

Rectangle.prototype.area2 = function() { 
    return this.width * this.height; 
};

而且，理想情况下，当你定义，将跨相同的所有实例重复使用的功能同样的对象，在您的构造函数中将它们定义在Rectangle.prototype而不是this上更好。在第一种情况下，只有一个Function对象被创建并且为Rectangle的所有实例共享;在后者中，为每个Rectangle创建一个新的。

构建模块的方式很好，因为你的目标是一个JavaScript平台，你可以在CommonJS模块中组织代码，比如Node.js.

来源

2013-01-12 04:55:22 matehat

了解JavaScript中的函数和模块

回答

相关问题