Transcrypt

Transcrypt 是一个将相当广泛的 Python 子集预编译为紧凑,可读的 Javascript 的工具。它具有以下特点:

  • 允许使用纯 Python 语法进行多重继承的经典 OO 编程,由 CPython 的本机解析器解析
  • 与高质量的面向 Web 的 JavaScript 库无缝集成,而不是面向桌面的 Python 库
  • 基于分层 URL 的模块系统,允许通过 PyPi 进行模块分发
  • Python 源代码和生成的 JavaScript 代码之间的简单关系,便于调试
  • 多级源映射和带源引用的目标代码的可选注释
  • 压缩下载,KB 而不是 MB
  • 优化的 JavaScript 代码,使用 memoization(调用缓存)可选地绕过原型查找链
  • 可以在本地打开和关闭运算符重载,以便于读取数值数学

代码大小和速度

经验表明,650 kB 的 Python 源代码大致翻译成相同数量的 JavaScript 源代码。速度与手写 JavaScript 的速度相匹配,如果打开呼叫记忆,它可以超越它。

与 HTML 集成

<script src="__javascript__/hello.js"></script>
<h2>Hello demo</h2>

<p>
<div id = "greet">...</div>
<button onclick="hello.solarSystem.greet ()">Click me repeatedly!</button>

<p>
<div id = "explain">...</div>
<button onclick="hello.solarSystem.explain ()">And click me repeatedly too!</button>

与 JavaScript 和 DOM 集成

from itertools import chain

class SolarSystem:
    planets = [list (chain (planet, (index + 1,))) for index, planet in enumerate ((
        ('Mercury', 'hot', 2240),
        ('Venus', 'sulphurous', 6052),
        ('Earth', 'fertile', 6378),
        ('Mars', 'reddish', 3397),
        ('Jupiter', 'stormy', 71492),
        ('Saturn', 'ringed', 60268),
        ('Uranus', 'cold', 25559),
        ('Neptune', 'very cold', 24766) 
    ))]
    
    lines = (
        '{} is a {} planet',
        'The radius of {} is {} km',
        '{} is planet nr. {} counting from the sun'
    )
    
    def __init__ (self):
        self.lineIndex = 0
    
    def greet (self):
        self.planet = self.planets [int (Math.random () * len (self.planets))]
        document.getElementById ('greet') .innerHTML = 'Hello {}'.format (self.planet [0])
        self.explain ()
        
    def explain (self):
        document.getElementById ('explain').innerHTML = (
            self.lines [self.lineIndex] .format (self.planet [0], self.planet [self.lineIndex + 1])
        )
        self.lineIndex = (self.lineIndex + 1) % 3
         solarSystem = SolarSystem ()

与其他 JavaScript 库集成

Transcrypt 可以与任何 JavaScript 库结合使用,无需特殊措施或语法。在文档中给出了 ao react.js,riot.js,fabric.js 和 node.js 的示例。

Python 和 JavaScript 代码之间的关系

Python

class A:
    def __init__ (self, x):
        self.x = x

    def show (self, label):
        print ('A.show', label, self.x)
    
class B:
    def __init__ (self, y):
        alert ('In B constructor')
        self.y = y
        
    def show (self, label):
        print ('B.show', label, self.y)
        
class C (A, B):
    def __init__ (self, x, y):
        alert ('In C constructor')
        A.__init__ (self, x)
        B.__init__ (self, y)
        self.show ('constructor')
        
    def show (self, label):
        B.show (self, label)
        print ('C.show', label, self.x, self.y)
    
a = A (1001)
a.show ('america')

b = B (2002)
b.show ('russia')

c = C (3003, 4004)
c.show ('netherlands')

show2 = c.show
show2 ('copy')

JavaScript

var A = __class__ ('A', [object], {
    get __init__ () {return __get__ (this, function (self, x) {
        self.x = x;
    });},
    get show () {return __get__ (this, function (self, label) {
        print ('A.show', label, self.x);
    });}
});
var B = __class__ ('B', [object], {
    get __init__ () {return __get__ (this, function (self, y) {
        alert ('In B constructor');
        self.y = y;
    });},
    get show () {return __get__ (this, function (self, label) {
        print ('B.show', label, self.y);
    });}
});
var C = __class__ ('C', [A, B], {
    get __init__ () {return __get__ (this, function (self, x, y) {
        alert ('In C constructor');
        A.__init__ (self, x);
        B.__init__ (self, y);
        self.show ('constructor');
    });},
    get show () {return __get__ (this, function (self, label) {
        B.show (self, label);
        print ('C.show', label, self.x, self.y);
    });}
});
var a = A (1001);
a.show ('america');
var b = B (2002);
b.show ('russia');
var c = C (3003, 4004);
c.show ('netherlands');
var show2 = c.show;
show2 ('copy');

外部链接