JS Object.create() in Dart

Issue

I’m constructing two JS object in Dart. In JS, they are constructed with Object.create():

var wavesurfer1 = Object.create(WaveSurfer);
var wavesurfer2 = Object.create(WaveSurfer);

This is what I think is Dart equivalent:

var wavesurfer1 = context['WaveSurfer'];
var wavesurfer1 = context['WaveSurfer'];

But, I found that the two objects in Dart appear to be the same. When I call a function in one object it gets triggered in both. This does not happen in the JS code. I suspect that Object.create() should not be written as context[”] in Dart. If this is true, I’m not able to find an example in dartlang.org or stackoverflow.com for how to correctly translate this expression to Dart. You can see the JS source code for WaveSurfer here.

Solution

With context['WaveSurfer'] you get a JsObject corresponding to the Js WaveSurfer and not to a new object.

To do the Dart equivalent of your pasted JS code :

import 'dart:js';

var wavesurfer = context['WaveSurfer'];
var wavesurfer1 = context['Object'].callMethod('create', [waveSurfer]);
var wavesurfer2 = context['Object'].callMethod('create', [waveSurfer]);

See Using JavaScript from Dart.

If you find the usage of dart:js to hard and verbose you can use package:js that provides a simplier API (but with a larger JS generated size) :

import 'package:js/js.dart';

var wavesurfer1 = context.Object.create(context.WaveSurfer);
var wavesurfer2 = context.Object.create(context.WaveSurfer);

Answered By – Alexandre Ardhuin

Answer Checked By – Timothy Miller (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.