如何通過 JS - Dart 互操作從 JavaScript 訪問 `this`？

Question

我需要從 Dart 函數訪問 JavaScript 對象的this 。 我通過 Dart-JS 互操作有效地向 JavaScript 對象添加了一個新方法。 我需要從 Dart 中定義的方法訪問 JavaScript 對象上的屬性。

Answer 1

Callback構造函數可以從 JavaScript 傳遞this 。 根據回調的API 文檔：

new Callback.many(Function f, {bool withThis: false})
new Callback.once(Function f, {bool withThis: false})

下面是一個例子：

飛鏢代碼：

import 'dart:html';
import 'package:js/js.dart' as js;

void main() {
  var greeter = js.context['greeter'];
  var msg = greeter['greet']('Bob');
  greeter['doCoolStuff'] = new js.Callback.many(doCoolStuff, withThis: true);
}

doCoolStuff(jsThis) {
  print(jsThis['msg']);
}

請注意在創建回調時使用withThis: true 。 JavaScript 中的this作為回調函數的第一個參數傳入。 在這種情況下，我將其命名為jsThis 。

JavaScript 代碼：

function Greeter() {
  this.msg = 'hello';

  var that = this;
  document.getElementById('clickme').addEventListener('click', function() {
    that.doCoolStuff();
  });
}

Greeter.prototype.greet = function(name) {
  return this.msg + ' ' + name;
}

var greeter = new Greeter();

document.getElementById('clickme').addEventListener('click', function() {
  greeter.doCoolStuff(); // comes from Dart land
});