Scala.js在全局范围内没有看到JS * class *，但是看到了构造函数 [英] Scala.js does not see a JS *class* in the global scope, but sees a constructor function

问题描述

在尝试为javascript类编写scalajs外观时，我在Chrome控制台中收到以下错误：错误未捕获的TypeError：$ g.MyRect2不是构造函数。

While trying to write scalajs facade for javascript class, i am getting the following error: "error Uncaught TypeError: $g.MyRect2 is not a constructor" in chrome console.

我的javascript类定义如下：

My javascript class defination is as follows:

class MyRect2 {
    constructor(height, width) {
        this.height = height;
        this.width = width;
      }

      area() {
      return this.height * this.width
      }

}

然后我将其按以下方式在Scala中导入

Then I imported it as follows in scala

@js.native
class MyRect2(h:Int,w:Int) extends  js.Object {

  val height:Int = js.native
  val width:Int = js.native
  def area():Int = js.native
}

最后我实例化了该类，如下所示

Finally I instantiated the class as follows

val rect2 = new MyRect2(2,2) //This is giving the above error.

但是，当我编写如下所示的javascript类时，相同的导入和实例化都有效

However, when I write javascript class as below, the same import and instantiation works

function MyRect2(height,width) {
    this.height = height;
    this.width = width;
    this.area = function() {return this.height * this.width;};
}

请提示我在做什么不对。

Pls suggest what i am not doing right.

推荐答案

编辑：此问题已在Scala.js 1.x（在撰写本文时为Scala.js 1.0.0）中已修复。 -M1已发布）。

This has been fixed in Scala.js 1.x (as of this writing, Scala.js 1.0.0-M1 has been released).

哦……好吧，这使我的日子更加黑暗。

Ouch ... Well that just made my day a lot darker.

结果是 class 声明（以及 let s和 const s，但与 var s和函数）不同的是 not 不添加它们声明为JavaScript的全局对象的属性。它们仅在 global范围中可用。

It turns out that class declarations (along with lets and consts, but unlike vars and functions) do not add what they declare as properties of the global object of JavaScript. They are only available in the global scope.

在ECMAScript 5.1之前，这两项是等效的：在且仅当全局范围内如果它是全局对象的属性。现在，有些东西在全局范围内，但不是全局对象的 属性。

Until ECMAScript 5.1, these two things were equivalent: something was in the global scope if and only if it was a property of the global object. Now, there are things that are in the global scope but are not properties of the global object.

请参见 ES 6第6节：全局对象中的变量和作用域，以获取有关此问题的更多详细信息。我们还可以在浏览器的控制台中进行以下实验（或在Node.js中，将窗口替换为 global ）： / p>

See Variables and Scoping in ES 6, section 6: The Global object for more details on this issue. We can also experiment as follows in a browser's console (or in Node.js by replacing window by global):

class MyRect2 {
    constructor(height, width) {
        this.height = height;
        this.width = width;
    }

    area() {
      return this.height * this.width
    }
}

new window.MyRect2(2, 2)

导致：

TypeError: window.MyRect2 is not a constructor [Learn More]

但是

function MyRect3(height,width) {
    this.height = height;
    this.width = width;
    this.area = function() {return this.height * this.width;};
}
new window.MyRect3(2, 2)

给出：

Object { height: 2, width: 2, area: MyRect3/this.area() }

这与迄今为止Scala.js的设计方式不符。根据设计，Scala.js仅使您可以访问全局 object ，而不能访问全局范围。这样做是为了使编译器永远不会因为您自己内部生成的名称而影响您对全局变量的访问。也就是说，考虑到前提是您可以通过全局范围访问的所有内容也可以通过全局对象进行访问，所以这是一个好主意。

This is at odds with how Scala.js was designed so far. By design, Scala.js only gives you access to the global object, and not the global scope. This was done so that the compiler would never shadow your accessing to a global variable by its own internally generated names. I.e., it was a good idea given the premise that everything you would access through the global scope can also be accessed through the global object.

现在，此前提已被打破，意味着Scala.js有一个严重的限制，我们需要修复。

Now this premise is broken, which means that Scala.js has a severe limitation, which we will need to fix.

解决方法是将以下内容添加到您的.js文件中：

The workaround is to add the following to your .js file:

class MyRect2 { ... }
window.MyRect2 = MyRect2;

强制 MyRect2 成为其财产全局对象，因此让Scala.js访问它。

to force MyRect2 to become a property of the global object, and therefore let Scala.js access it.

这篇关于Scala.js在全局范围内没有看到JS * class *，但是看到了构造函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！