javascript：在可重復使用的d3js圖表中廣泛使用“ this”

Question

在可重用的d3庫的源代碼中（代碼可在這里找到： https : //github.com/bugzu/reD3/blob/master/src/area.js ），幾乎每一行都包含this的引用。 網站主頁： http : //bugzu.github.io/reD3/#/

例：

(function(global) {

    global.reD3 = global.reD3 || {};

    function Area(element, options) {
        this.element = element;
        this.options = options;
        this.init();
    }

    Area.prototype = {

        init: function() {
            var options = this.options,
            width = options.width || 960,
            height = options.height || 500,
            oMargin = options.margin;

            var margin = {
                top: 20,
                right: 30,
                bottom: 30,
                left: 40
            },

            margin = reD3.util.mixin(margin, oMargin);

            width = this.width = width - margin.left - margin.right;
            height = this.height = height - margin.top - margin.bottom;
            var xValue = this.xValue = options.xValue || 'date';
            var yValue = this.yValue = options.yValue || 'value';

如此頻繁使用的目的是什么？ 對於可重用（圖表）組件，這種技術的優點/缺點是什么？

Answer 1

由於Area是一個類（您可以在構造函數中使用'this'進行區分，並且對其調用將使用new關鍵字），因此使用this會修改對象，而不是局部變量或全局變量。 不管庫是用於圖表還是其他任何庫，使用this鼓勵封裝，盡管與其他具有類的語言相比，它顯然不那么明顯。