I am learning package:js and the dart file, which is a dart wrapper for chart.js.
I think this file is a bridge which connects dart and javascript. So, in this file, it must tell what javascript library this dart file is trying to connect. Am I right? But I did not find it.
What do the following statements mean? Do the following two statements tell what javascript library this dart file is trying to connect?
#JS('Chart')
library chart.js;
I have no idea how to map functions https://github.com/google/chartjs.dart/blob/master/lib/chartjs.dart to functions in https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.js. Anyone can give more tutorials?
You don't need to map to a JavaScript file, you just need to map to JS objects and functions.
You need to add a script tag to index.html that loads the JavaScript file you want to map to, this will make it available globally.
You then need to map
Dart functions to JavaScript functions, so when you call such a Dart function the call will actually be forwarded to the JavaScript function.
Dart classes so that you can use strongly typed Dart classes which will then be converted to and from JavaScript objects when you for example pass them as parameters to mapped functions or get them as return values from such function calls.
#JS('Chart')
library chart.js;
The name chart.js after library is arbitrary. The library directive just needs an unique name.
#JS('Chart') means that the loaded chart.js library is available in JavaScript land under window.Chart (window means global in JS land and is implicit).
#JS()
class Chart {
declares a Dart class Chart and #JS() maps it to a JS class with the same name in the library scope declared above. So the Dart class Chart will map to the JavaScript class window.Chart.Chart.
external factory Chart(
The external ... declarations inside the Dart Chart class map to the JS methods with the same name.
More details can be found in the README.md https://pub.dartlang.org/packages/js.
If you're still stuck you can ask more concrete questions. It's difficult to answer generic questions about how to use a package.
Related
Ordinarily in standards JavaScript projects I have a series of Date/Array/String.prototype functions I used regularly and declare using a utilities file.
Trying to use a similar method in Google Apps Script, I'm setting up a library but object prototypes don't carry across when the library is loaded, and aren't recognised when they'd declared in the library and called from a function in the library.
E.g. In library file:
Array.prototype.test = function(){
console.log('test prototype');
}
In file library is used, calling [].test() would error as undefined. The same calling a function in the library with this in it.
I am trying to use some functions from a code that has been obfuscated. So i have an html file that is calling a JS file thru the tag:
<script src="gwt_svg_viewer/gwt_svg_viewer.nocache.js"></script>
that file is defining a function called "onScriptdownloaded" which receives a string like this:
gwt_svg_viewer.onScriptDownloaded(["var $wnd = window.parent;function RE(){}"]);
So my question is how can i access to RE? in another JS file?
It seems that there was a kind of GWT code implemented, but i am not really familiar with that.
Variable names and functions in gwt will be obfuscated every time you compile your project, and variables and functions will be renamed in the process, in order to call a gwt code from javascript in a consistence manner you will need to use jsinterop to export java types. more information can be found in the gwt jsinterop documentation
Are built in objects in JavaScript like Math, Array, String etc... just defined in a .js file and then compiled and or interpreted? Can I get a basic high level overview of how they are implemented and made available? I see that in Java there is a String class and that class gets compiled and is available when I need to create an object, is JavaScript similar?
Thank You.
I'm sorry to ask quite a dim question as I'm very new to OOP in JavaScript.
I'm trying to use John Resig's Simple JavaScript Inheritance method, and ideally I'd like to store this within say utils.js, and then use it (using Class.extend), throughout the range of script files that my project uses. Is this possible? I've noticed that if I create a subclass from within my utils.js file, I can then create a new instance of that class from a different script, so that makes me think it might be possible. Does it have something to do with the method being wrapped in an immediately-invoked function expression?
Sure it's possible, just load the util.js file before the rest. ALthough if I were you (seems like you're starting to have several different files in your project) I'd check out http://requirejs.org/ or some other AMD library to break up your project in modules.
Yes, this is possible only thing is you have to include Utils.js file before calling Class.extend, so that browser should be able to find the base class.
Browser works like an interpreter, it loads scripts once it finds the script tag
Does it have something to do with the method being wrapped in an immediately-invoked function expression?
Yes, in the moment in which the utils.js script is loaded, the method executes and returns the object Class to the global scope. From then on, the object can be used in all other files.
I understand Dart compiles to JavaScript, and I read the Dart Language Spec on Libraries, although I didn't see an answer there. Also a search on their discussion form for the word 'existing' turns up 3 results that are not related.
Does anyone know if Dart will support the use of existing JavaScript libraries such as jQuery or Raphael?
The answer is now Yes! Dart now ships a JS-interop library to use existing JavaScript code with your Dart app. Learn more here: https://www.dartlang.org/articles/js-dart-interop/
You will not be able to call javascript directly from dart code. The native directive is reserved for the core libraries of dartc (dart:core, dart:dom, dart:html, dart:json, etc), which itself compiles to javascript.
There is now a new simpler way https://pub.dartlang.org/packages/js (currently version 0.6.0-beta.6)
Make JS classes and functions available to Dart like:
#JS("JSON.stringify")
external String stringify(obj);
#JS('google.maps')
library maps;
// Invokes the JavaScript getter `google.maps.map`.
external Map get map;
// `new Map` invokes JavaScript `new google.maps.Map(location)`
#JS()
class Map {
external Map(Location location);
external Location getLocation();
}
// `new Location(...)` invokes JavaScript `new google.maps.LatLng(...)`
//
// We recommend against using custom JavaScript names whenever
// possible. It is easier for users if the JavaScript names and Dart names
// are consistent.
#JS("LatLng")
class Location {
external Location(num lat, num lng);
}
for more see the readme of the package
There is also a dart:js library. And here is an article explaining how to use this library for interoperating with JavaScript.