在JavaScript中擴展功能

Question

好吧，長話短說，我有2個類（功能），需要從第二個延伸一個..在艱難的一天結束時，我寫了簡單的解決方案，但后來我回家了，我認為這是錯誤的..但是..實際上它工作，只有我不明白為什么..所以例如我有2個功能：

function aa() {
  var r = "aaaa";
  this.method = function(){
    console.log(r);
  }
}

function bb() {
  var e = "bbbb";
  this.method2 = function(){
    console.log(e);
  }
}

var a = new aa();
var b = new bb();

在我使用此函數合並它們之后：

var merge = function(one, two) {
  for(var method in two) {
    one[method] = two[method];
  }
  return one;
}
var c = merge(a, b);

這工作正常..所以問題是為什么？ 我猜在'merge'函數中，我只是添加第二個的第一個對象方法，但是這個方法使用的私有變量沒有在第一個對象中定義，為什么他會看到它？

Answer 1

的r和e值包括在的范圍method和method2的功能。 即使在移動這些函數之后，它們仍然保持對定義它們的范圍中的變量的引用。 這稱為閉包。 更多： JavaScript閉包如何工作？

Answer 2

請注意，您沒有將method2函數從一個原型復制到另一個原型 - 您在aa添加了對method2的引用。

只要bb存在， method2就能訪問bb的變量e 。 特別因為e的范圍是可見宣布method2 。

Answer 3

這基本上是關閉工作的方式。 您的代碼可以簡化為：

var bar;
(function foo () {
    var x = 10;
    bar = function () {
        alert(x);
    }
})();

// Now that we're outside of foo:
bar(); // bar can still see "x".

// Even if you do this:
var x = 0;
bar(); // bar still sees x=10

Answer 4

這是jQuery用於.extend（）api的深層復制方法

function() {
var src, copyIsArray, copy, name, options, clone,
    target = arguments[0] || {},
    i = 1,
    length = arguments.length,
    deep = false;

// Handle a deep copy situation
if ( typeof target === "boolean" ) {
    deep = target;
    target = arguments[1] || {};
    // skip the boolean and the target
    i = 2;
}

// Handle case when target is a string or something (possible in deep copy)
if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
    target = {};
}

// extend jQuery itself if only one argument is passed
if ( length === i ) {
    target = this;
    --i;
}

for ( ; i < length; i++ ) {
    // Only deal with non-null/undefined values
    if ( (options = arguments[ i ]) != null ) {
        // Extend the base object
        for ( name in options ) {
            src = target[ name ];
            copy = options[ name ];

            // Prevent never-ending loop
            if ( target === copy ) {
                continue;
            }

            // Recurse if we're merging plain objects or arrays
            if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
                if ( copyIsArray ) {
                    copyIsArray = false;
                    clone = src && jQuery.isArray(src) ? src : [];

                } else {
                    clone = src && jQuery.isPlainObject(src) ? src : {};
                }

                // Never move original objects, clone them
                target[ name ] = jQuery.extend( deep, clone, copy );

            // Don't bring in undefined values
            } else if ( copy !== undefined ) {
                target[ name ] = copy;
            }
        }
    }
}

// Return the modified object
return target;
};