10 синтаксических различий между Haxe и Javascript

  • 4 ноября, 15:42
  • 4292
  • 2

Haxe — это высокоуровневый мультиплатформенный язык программирования с открытым исходным кодом, а также компилятор, с помощью которого можно создавать приложения и генерировать исходный код для разных платформ, сохраняя единую кодовую базу.

Код, написанный на языке Haxe, может быть транслирован в код ActionScript 3, JavaScript, Java, C#, C++, Python, Lua, PHP, Apache CGI, а также в приложение Node.js

Создатель Haxe постарался сделать язык максимально простым, даже если вы можете делать с ним действительно сложные вещи. Давайте сравним некоторые элементы синтаксиса с Javascript

1. Конструктор класса

// Javascript
class MyAwesomeClass {
  constructor() {
    // Stuff to initialize
  }
}

// Haxe
class MyAwesomeClass {
  public function new() {
    // Stuff to initialize
  }
}

2. Все переменные являются переменными (ну почти)

Javascript становится немного запутанным при создании переменных, особенно в классах. Иногда вы используете this, иногда можете использовать var, let или в const в зависимости от того, хотите ли вы переменную с постоянной областью или нет. В Haxe вам нужно запомнить только одно ключевое слово var.

// Javascript
class MyAwesomeClass {
   outsideMethod;

  constructor() {
    this.outsideMethod = 10;
  }

   myAwesomeMethod() {
    const constantInsideMethod = 15;
    let insideMethod = 10;
  }
}

// Haxe
class MyAwesomeClass {
  var outsideMethod:Int;

  public function new() {
    outsideMethod = 10;
  }

  function myAwesomeMethod() {
    final constantInsideMethod:Int = 15;
    var insideMethod:Int = 10;
  }
}

3. Переопределение унаследованного метода

Переопределение унаследованного метода - это то, что я никогда не делал в javascript, но довольно часто делаю в Haxe, так что я не уверен, будет ли работать пример js.

// Javascript
class MySecondAwesomeClass extends MyAwesomeClass {
  myAwesomeMethod() {
    var newVariable = 200;
    super.myAwesomeMethod();
  }
}

// Haxe
class MySecondAwesomeClass extends MyAwesomeClass {
  override myAwesomeMethod() {
    var newVariable:Int = 200;
  }
}

4. Пакет вместо экспорта

// Javascript

export default class MySecondAwesomeClass extends MyAwesomeClass {
  myAwesomeMethod() {
    var newVariable = 200;
    super.myAwesomeMethod();
  }
}

// Haxe

package; // This should be the first line in the file

class MySecondAwesomeClass extends MyAwesomeClass {
  override myAwesomeMethod() {
    var newVariable:Int = 200;
  }
}

5. Различные методы массива

Есть много методов по умолчанию, которые отличаются в Haxe и Javascript, но методы массива, на мой взгляд, используются очень часто, поэтому хорошо знать разницу в Haxe.

// Typescript
class MyThirdAwesomeClass {
  testArrayMap():Array<number> {
    var myArray:Array<number> = [0, 1, 2];

    return myArray.map(function(number:number, index:number) {
      return number + index;
    });
  }
}

// Haxe

// the mapi method won't work without adding using Lambda outside of this class
class MyThirdAwesomeClass {
  function testArrayMap():Array<Int> {
    var myArray:Array<Int> = [0, 1, 2];

    return myArray.mapi(function(Index:Int, Number:Int) {
      return Number + Index;
    });
  }
}

6. Использование ключевого слова

Это то, что я имел в виду: ключевое слово using в предыдущем примере. Для этого есть только пример Haxe, потому что в Javascript вы не можете это сделать.

// Haxe
using Lambda;

class MyThirdAwesomeClass {
  function testArrayMap():Array<Int> {
    var myArray:Array<Int> = [0, 1, 2];

    return myArray.mapi(function(Index:Int, Number:Int) {
      return Number + Index;
    });
  }
}

Немного сложно объяснить, если вы не использовали его раньше, но, по сути, если вы создали статический метод в одном классе и хотите использовать его в другом, есть два способа:

import Lambda;

// usage
Lambda.mapi(myArray, ...)

Или так:

using Lambda

// usage
myArray.mapi(...)

Если вы импортируете с помощью статического метода using, он может быть применен непосредственно к переменной.

7. Цикл

Есть довольно крутой способ делать приращения для циклов с помощью синтаксиса распространения в javascript.

// Javascript
for (let i = 0; i < 10; i++) {
  console.log(i);
}

// Haxe
for (i in 0...9) {
  trace(i);
}

Есть также классная маленькая стенография, которую ты можешь сделать с Haxe

// Haxe
for (i in 0...9) trace(i);

8. Стрелочные функции

Они были должным образом введены в Haxe 4 (так же, как и final ключевое слово), поэтому вы не увидите их во многих онлайн-примерах.

// Javascript
() => console.log("Arrow function in Javascript");

// Haxe
() -> trace("Arrow function in Haxe");

9. Деструктуризация

Я действительно люблю эту функцию в Javascript и делаю это когда могу, к сожалению, в Haxe нет простого способа сделать это.

// Javascript
const obj = { id: 1, name: 'Fizz'};
const {id, name} = obj;
console.log(id);
console.log(name);

// Haxe
final obj = { id: 1, name: 'Fizz'};
var newId;
var newName;

switch obj {
  case { id: newId, name: newName }:
    trace(newId);
    trace(newName);
}

10. Оператор spread  

Это то, что я люблю использовать в Javascripts, и у него опять нет эквивалента в Haxe 4.

// Javascript
const arr1 = [0, 1, 2];
arr1 = [...arr1, 3, 4, 5];
console.log(arr1);

//Haxe
final arr1 = [0, 1, 2];
final arr2 = [3, 4, 5];
final newArr = arr1.concat(arr2);
trace(newArr);

Итак, как вы можете видеть, существует множество сходств между синтаксисом Haxe и Javascript (также Haxe и Actionscript и Java / C #). Но есть несколько вещей, которые могут сбить вас с толку, если вы перешли на Haxe  из JS.

По материалам: Richard Oliver Bray

Источник


2 комментария
Сортировка:
Добавить комментарий
richardbray89@gmail.com
richardbray89@gmail.com 2019, 5 ноября, 12:08
1

Nice article but it looks like a lot of the code was taken form my original post, could you please give me credit.
https://dev.to/richardbray/10-syntax-differences-between-haxe-and-javascript-1838