CodeFest 2014. Пугачев С. — Язык TypeScript или JavaScript на стероидах

1,210 views
1,100 views

Published on

Published in: Internet, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,210
On SlideShare
0
From Embeds
0
Number of Embeds
284
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

CodeFest 2014. Пугачев С. — Язык TypeScript или JavaScript на стероидах

  1. 1. TypeScript или JavaScript на стероидах author: { name: "Сергей Пугачёв", twitter: "@spugachev", company: "Microsoft Россия" };
  2. 2. Сегодня я бы хотел рассказать о 3 продуктах Microsoft…
  3. 3. Douglas Adams (автор «Автор автостопом по галактике») I've come up with a set of rules that describe our reactions to technologies: 1. Anything that is in the world when you’re born is normal and ordinary and is just a natural part of the way the world works. 2. Anything that's invented between when you’re fifteen and thirty-five is new and exciting and revolutionary and you can probably get a career in it. 3. Anything invented after you're thirty-five is against the natural order of things.
  4. 4. TypeScript Начинается с JavaScript Весь JavaScript код является TypeScript кодом Все JavaScript библиотеки работают с TypeScript Опциональная статическая типизация, классы, модули Хорошо подходит для масштабных приложений Нет Runtime издержек. Статическая типизация исчезает в Runtime Заканчивается на JavaScript Компилируется в JavaScript Запускается в любом браузере и любой ОС
  5. 5. TypeScript Начинается с JavaScript Весь JavaScript код является TypeScript кодом Все JavaScript библиотеки работают с TypeScript Опциональная статическая типизация, классы, модули Хорошо подходит для масштабных приложений Нет Runtime издержек. Статическая типизация исчезает в Runtime Заканчивается на JavaScript Компилируется в JavaScript Запускается в любом браузере и любой ОС
  6. 6. Демонстрация: TypeScript
  7. 7. 2. Подходы к решению всех проблем
  8. 8. 1. Что не так с JavaScript?
  9. 9. “Никто больше не пишет на JavaScript. Все пишут на jQuery.” Скотт Хансельман
  10. 10. 1 10 100 1000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 Sunspiderrunsperminute(logscale) Internet Explorer производительность JavaScript
  11. 11. Закон Этвуда: всё, что может быть написано на JavaScript, будет написано на JavaScript.
  12. 12. Web page title http://www.url.com
  13. 13. "JavaScript – это ассемблер Web’а"
  14. 14. C/C++ LLVM байткод JavaScript
  15. 15. Гибкость Производительность “Think C++”“Think Script” Простые сайты Сложные приложения, игры var r = 3 * "10"; // r == 300 var a = new Array(); a.push(10); var p = {x: 0, y: 0}; p.z = 5; p["some text"] = 1; p[1] = 2; eval("var s = p[1] * a[0]"); // s == 20 var r = 3 * parseInt("10"); var a = new Array(100); a[0] = 10; var p = new Point(0, 0, 0); p.z = 5;
  16. 16. Демонстрация: Emscripten
  17. 17. Что мы выяснили 1. JavaScript – ассемблер Web’а 2. JavaScript сам по себе мощный язык, на котором можно писать производительные приложения 3. JavaScript «не идеален» для создания больших проектов
  18. 18. 2. Подходы к решению всех проблем
  19. 19. • Компилировать язык в JavaScript • Создать новую виртуальную машину вместо JS 2 подхода
  20. 20. var Greeter = (function () { function Greeter(greeting) { this.greeting = greeting; } Greeter.prototype.greet = function () { return "<h1>" + this.greeting + "</h1>"; }; return Greeter; } )(); var greeter = new Greeter("Hello, world!"); var str = greeter.greet(); document.body.innerHTML = str; class Greeter { greeting: string; constructor(greeting: string) { this.greeting = greeting; } greet() { return "<h1>"+this.greeting+"</h1>"; } } var greeter = new Greeter("Hello, world!"); var str = greeter.greet(); document.body.innerHTML = str; TypeScript
  21. 21. var Greeter = (function () { function Greeter(greeting) { this.greeting = greeting; } Greeter.prototype.greet = function () { return "<h1>" + this.greeting + "</h1>"; }; return Greeter; } )(); var greeter = new Greeter("Hello, world!"); var str = greeter.greet(); document.body.innerHTML = str; class Greeter constructor: (@greeting) -> @greet -> return "<h1>" + this.greeting + "</h1>"; greeter = new Greeter("Hello, world!"); str = greeter.greet() document.body.innerHTML = str CoffeeScript
  22. 22. 3. Язык TypeScript
  23. 23. Типы function toNumber(numberString: string, ...theArgs: number[]): number { var num: number = parseFloat(numberString); return num; }
  24. 24. Перегрузка function numberStringSwap(value: number, radix?: number): string; function numberStringSwap(value: string): number; function numberStringSwap(value: any, radix: number = 10): any { if (typeof value === 'string') { return parseInt(value, radix); } else if (typeof value === 'number') { return String(value); } }
  25. 25. Типы var point: { x: number; y: number; }; point = { x: 0, y: 0 }; // OK point = { x: 0, y: 0, z: 0 }; // OK point = { x: 'zero', y: 0 }; // Error point = { x: 0 }; // Error
  26. 26. Интерфейсы interface IPoint { x: number; y: number; } interface IPoint3D extends IPoint { z: number; } var point: IPoint; var point2: IPoint3D;
  27. 27. Интерфейсы interface IPoint { x: number; y: number; z?: number; toGeo(): IPoint; }
  28. 28. Generics interface IArray<T> { map<TU>(callback: (value: T, index: number, array: IArray<T>) => TU, thisArg?: any): Array<TU>; } var arrayOfStrings: IArray<string> = ['a', 'b', 'c']; var arrayOfCharCodes: IArray<number> = arrayOfStrings.map( (value: string): number => value.charCodeAt(0));
  29. 29. Классы class Stateful extends Proxy { constructor(kwArgs: Object) { super(kwArgs); } get(key: string): any { var getter: string = '_' + key + 'Getter'; return this[getter] ? this[getter]() : super.get(key); } }
  30. 30. Enums enum Style { NONE = 0, BOLD = 1, ITALIC = 2, UNDERLINE = 4, EMPHASIS = Style.BOLD | Style.ITALIC, HYPERLINK = Style.BOLD | Style.UNDERLINE }
  31. 31. Модули module Shapes { export class Rectangle { constructor( public height: number, public width: number) { } } }
  32. 32. Сергей Пугачёв @spugachev

×