Convertir le langage C en JavaScript avec Emscripten

Je pense que C est le langage multiplateforme le plus puissant, iOS peut également utiliser le langage C en Objective-C, Android peut également utiliser le langage C avec NDK, donc Je pensais que si toute la logique autre que l'interface utilisateur était écrite en langage C, elle pourrait être utilisée sur toutes les plateformes. Cependant, avec FireFoxOS, je ne pouvais pas faire cela, et je ne pouvais pas utiliser le langage C sous la forme d'appeler l'API JavaScript de base.

J'étais au fond de ma déception Emscripten a été l'une des avancées! !! !! !!

Qu'est-ce qu'Emscripten

Emscripten est un compilateur qui génère LLVM à partir du langage C / C ++ et le convertit en JavaScript. Il prend également en charge une bibliothèque de langage C standard et une partie de POSIX, et il semble qu'OpenGL ES 2.0 puisse également être utilisé. Emscripten lui-même est ci-dessous. https://github.com/kripken/emscripten

Préparation (Mac OS X)

Permet d'utiliser emscripten.

J'ai essayé diverses choses, mais l'installation du SDK était la plus simple.

En tant que procédure, http://kripken.github.io/emscripten-site/docs/building_from_source/building_emscripten_from_source_using_the_sdk.html#building-emscripten-from-source-using-the-sdk Vous pouvez faire ce qui est écrit.

Si vous écrivez la procédure https://s3.amazonaws.com/mozilla-games/emscripten/releases/emsdk-portable.tar.gz Récupérez le code source à partir de.

Parce que j'utilise CMake

python


$ brew install cmake

Je vous en prie. Après avoir décompressé le code

python


$  cd emsdk_portable
$ ./emsdk install sdk-incoming-64bit
$ ./emsdk activate sdk-incoming-64bit

Tu peux le faire. Il semble utiliser node et python pour l'exécution, donc

python


$ brew install node

Et Après cela, créez un lien symbolique vers python2

python


$ sudo ln -s /usr/bin/python2.7 /usr/bin/python2

Courir

python


$ emsdk_portable/emscripten/incoming/emcc first.c -o first.js

Ensuite, vous pouvez le convertir en JS. (Il peut être préférable de le mettre dans PATH dans emsdk_portable / emscripten / incoming /)

Par exemple

first.c


#include <stdio.h>

int
main(void)
{
  printf("Hello, World!\n");
  return 0;
}

Si

python


$ emcc first.c -o first.js
$ node first.js
Hello, World!

Ce sera.

Appeler des fonctions C depuis JavaScript

Par exemple

second.c


int
add(int x, int y) 
{
  return x + y;
}

Je souhaite appeler la fonction depuis l'extérieur de JavaScript. À ce moment-là, lors de la conversion de js,

python


$ emcc second.c -s EXPORTED_FUCTIONS="['_add']" -o second.js

Spécifiez la fonction à publier dans EXPORTED_FUCTIONS et augmentez-la. Ajoutez d'abord "_" au nom de la fonction. Après cela, il est possible de l'appeler avec ccall du côté js. Il est utilisé sous la forme de ccal (nom de la fonction, type de retour, [type d'argument], [argument réel]).

second.html


<html>
<body>
<div id="output"></div>
<script type="text/javascript" src="./second.js"></script>
<script type="text/javascript">
  var num = ccall("add", "number", ["number", "number"], [1, 2]);
  document.getElementById("output").innerHTML = num;
</script>
</body>
</html>

Cela produira 3 vers le div. Vous pouvez également utiliser Module.cwrap pour récupérer la fonction. Module.cwrap (nom de la fonction, type de retour, [type d'argument]) Vous pouvez récupérer la fonction sous la forme de.

second2.html


 <html>
<body>
<div id="output"></div>
<script type="text/javascript" src="./second.js"></script>
<script type="text/javascript">
  //Extraire une fonction appelée add
  var add = Module.cwrap("add", "number", ["number", "number"]);
  //Utiliser la fonction extraite
  var num = add(1, 2);
  document.getElementById("output").innerHTML = num;
</script>
</body>
</html>

Encore une fois, 3 est envoyé au div.

Appeler JavaScript à partir du langage C

Inversement, lors de l'appel de JS à partir du code C,

python


mergeInto(LibraryManager.library, {
  //Définition de la méthode appelée depuis C
});

Est utilisé.

Par exemple

thirdlib.js


mergeInto(LibraryManager.library, {
    jsPower: function(x) {
        return x * x;
    }
});

Avec un fichier JavaScript appelé

third.c


#include <stdio.h>
#include <math.h>

int jsPower(int x); //Fonctions JavaScript

int 
pythagorean(x, y)
{
  //Calculer en appelant la fonction JavaScript jsPower
  return  sqrt(jsPower(x) + jsPower(y));
}

int
main(void)
{
  printf("%d\n", pythagorean(3,4));
  return 0;
}

Préparez un fichier de langage C appelé. Par conséquent, spécifiez le code JS avec l'option --js-library, compilez-le et exécutez-le.

python


$ emcc third.c --js-library thirdlib.js -o third.js
$ node thired.js
5

Le code JS est correctement appelé et calculé.

Appeler des fonctions C ++ à partir de JavaScript

À partir d'ici, EMSCRIPTEN_BINDINGS peut être utilisé en C ++, et si vous l'enregistrez ici, vous pouvez appeler la fonction avec Module.xxx.

firstcpp.cpp


#include "emscripten/bind.h"

using namespace emscripten;
int
add(int x, int y)
{
  return x + y;
}

EMSCRIPTEN_BINDINGS(my_module) {
  function("add", &add);
}

Comme, compilez comme suit (em ++ car c'est C ++)

python


$ em++ firstcpp.cpp -o firstcpp.js -std=c++0x --bind

Utilisation de la sortie de fichier comme

firstcpp.html


<html>
<body>
<div id="output"></div>
<script type="text/javascript" src="./firstcpp.js"></script>
<script type="text/javascript">
  var num = Module.add(1, 2);
  document.getElementById("output").innerHTML = num;
</script>
</body>
</html>

Si tel est le cas, 3 sera émis.

Autre

Je ferai également ce qui précède.

Recommended Posts

Convertir le langage C en JavaScript avec Emscripten
Convertissez Markdown en HTML avec flexmark-java
Convertir le tableau 2D de Swift en tableau 2D de C
Comment changer d'images miniatures avec JavaScript
Comment exécuter Blazor (C #) avec Docker
Conversion de JSON en TSV et TSV en JSON avec Ruby
Conversion du pointeur de chaîne de langage C en type Swift String
Convertissez une chaîne en un tableau caractère par caractère avec Swift
J'ai essayé de déplacer Hello World (+ α) écrit en langage C à partir de JavaScript [Web Assembly]
NLP4J [006-034c] 100 coups de traitement du langage avec NLP4J # 34 Essayez de résoudre plus intelligemment "A's B" (édition finale)
Comment intégrer des variables JavaScript dans HTML avec Thymeleaf
Générer du JavaScript avec Thymeleaf
Code du port C avec de nombreux typecasts vers Swift
Bouton Retour en haut réalisé uniquement avec Javascript (rails, haml)
Réécrire les affectations de langage C de l'université avec Node.js
Convertir un tableau bidimensionnel au format csv avec l'API Java 8 Stream