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');

外部連結