代码之家  ›  专栏  ›  技术社区  ›  spencer741

调用另一个对象中的函数

  •  -1
  • spencer741  · 技术社区  · 6 年前

    当试图调用另一个对象中的函数时,我会遇到以下错误:“ObjectOneInstance未定义。”

    我知道一个选择是插入声明

    ObjectOneInstance.ObjectTwoInstance = ObjectTwoInstance;

    (反之亦然)更改函数以调用

    this.ObjectTwoInstance.two_A(); .

    这种方式似乎工作得不错,但我想知道是否有一种在JavaScript领域被认为更好或更合适的方式来做这件事,因为后一个例子似乎异常且令人困惑。

    最近,我一直在努力使我的Javascript更加面向对象,这可能引起了一些误解,即当应用程序变得更加复杂时,面向对象Javascript的结构是什么样的。

    window.onload = function() {
    
        var ObjectOneInstance = Object.create(ObjectOne);
        var ObjectTwoInstance = Object.create(ObjectTwo);
        ObjectOneInstance.one_A();
    
    }
    
    var ObjectOne = {
    
        one_A : function(){
            ObjectTwoInstance.two_A();
        }
    }
    
    var ObjectTwo = {
    
        two_A : function(){
            //do something
    
        }
    }
    
    1 回复  |  直到 6 年前
        1
  •  1
  •   Mark    6 年前

    这是一堂关于范围界定和理解的好课 什么时候 变量需要定义。

    让我们从最简单的一点开始:

    window.onload = function() {
        var ObjectOneInstance = Object.create(ObjectOne);
        var ObjectTwoInstance = Object.create(ObjectTwo);
        ObjectOneInstance.one_A();
    }
    

    在用创建的javascript变量中 var 范围限定为封闭函数。这意味着 ObjectOneInstance ObjectTwoInstance 仅在您刚刚创建的函数中可用。在这个功能之外,它们并不存在。

    为了解决这个问题,您可以将声明移到函数之外,让每个人都能看到它们,但有一个问题:

    /* BUT THIS DOESN'T WORK…FOR A DIFFERENT REASON */
    var ObjectOneInstance = Object.create(ObjectOne);
    var ObjectTwoInstance = Object.create(ObjectTwo);
    
    window.onload = function() {
        ObjectOneInstance.one_A();
    }
    

    现在 ObjectOneInstance ObjectTwoInstance 在所有人都能看到的范围内,但它们依赖于 ObjectOne ObjectTwo ,但尚未定义,因此会出现另一个错误:

    TypeError:对象原型只能是对象或null。

    关键是让一切都在正确的范围和正确的顺序。这在javascript中可能有点微妙,因为在计算对象或调用函数时需要定义对象,而这不一定是在加载脚本的同时定义的。很多东西,比如javascript unload 处理程序是异步发生的,这意味着整个脚本都会运行并 然后 这个 onload 处理者开火。这不应该抛出错误:

    window.onload = function() {
      /* ObjectOneInstance is not defined when the script loads, 
         but it will be when onload is called */
      ObjectOneInstance.one_A();
    }
    
    var ObjectOne = {
      one_A : function(){
          /* It doesn't matter that ObjectTwoInstance is not defined yet;
             it will be by the time this function is called */
          ObjectTwoInstance.two_A();
      }
    }
    var ObjectTwo = {
      two_A : function(){
          //do something
      }
    }
    /* Object create is not in an async handler it runs right away, 
       so ObjectOne and ObjectTwo need to be defined before calling this */
    var ObjectOneInstance = Object.create(ObjectOne);
    var ObjectTwoInstance = Object.create(ObjectTwo)