Javascript status 2016

Javascript, ES6/7,
Coﬀeescript, Typescript
and sh**t

Javascript - What the hell is it?

Ofﬁcial release 1.0 at 1995 in Netscape Navigator
Developed by Brendan Eich
Javascript core called ECMAScript
Javascript - What the hell is it?

Object inheritance
instead of class inheritance
Javascript is prototype-based

Javascript supports object-
oriented, imperative, and
functional programming
styles

x = 9;
x = "Hello";
Javascript is dynamic

x = 9;
y = "Hello";
z = {"Number": 5};
Javascript is untyped

No need to compile!!!
Javascript is interpreted

if (typeof obj === 'object') {
alert(obj.prop);
}
if (typeof obj === 'object' && obj !==
null) {
alert(obj.prop);
}
It’s a crazy language

1 == 1; //true
'foo' == 'foo'; //true
[1,2,3] == [1,2,3]; //false
new Array(3) == ",,"; //true
new Array(3) === ",,"; //false

{} + {}; //NaN
[] + []; //""
[] + {}; //[object Object]
[] + {} === {} + []; //false

Technical Committee for ES development
Active from 2008
Released ES5 on 2009
Released ES6 on December 2015
Plan to release ES7 on 2016
Plan to release next versions once in a year
TC39

class Person {
constructor(name, age) {
this.name = name,
this.age = age
}
about() {
log(this.name, this.age);
}
};
Classes

var jack = new Person('jack', 22);
jack.about();
//=> jack 22
Classes

class Son extends Person {
constructor(name, age) {
super(name, age);
this.son = true;
}
};
Classes

var jack = new Son('jack', 22);
jack.about(); //=> jack 22
jack.son; //=> true
Classes

var nums = [1,2,3];
nums.map(function(x) {
return x * 2;
};
nums.map((x) => x * 2);
Maps

var [a, b] = [1, 2];
var [a, ,b] = [1, 2, 3];
var {a, b} = {a: 2, b: 3};
var {a, b} = {b: 3};
Destructuring

var f = `My awesome
multiline string`;
var name = 'jack';
var age = 22;
var s = `${name} is ${age} years old`;
Template strings

function getInfo(print: false) {
if (print) {
console.log(this.name, this.age);
}
else {
return `${this.name} ${this.age}`;
}
}
Function arguments

function length (...nums) {
console.log(nums.length);
}
length(1,2,3); // 3
Function arguments

Global scope
Function scope
Block scope
Scope

foo = 2; //Global scope
var fad = 2; //Global scope
function() {
bar = 3; //Global scope
var baz = 4; //Function scope
}
Scope

function() {
if (x) {
var foo = 3; //Function scope
}
}
Scope

foo = 2; //Global scope
function() {
if (x) {
let y = 2; //Block scope
}
}
Scope

//app.js
var foo = 2;
var baz = 3;
export {foo, bar};
///////////////////////
//foo.js
import {foo} from 'app'
console.log(foo); // 2
Modules

//app.js
export var foo = 2;
///////////////////////
//foo.js
import {foo} from 'app'
console.log(foo); // 2
Modules

//app.js
export default function foo(){
return 2;
};
///////////////////////////
//foo.js
import foo from 'app'
console.log(foo()); // 2
Modules

//app.js
export var foo = 2;
export var baz = 3;
///////////////////////
//foo.js
import stuff from 'app'
stuff.foo // 2
stuff.baz // 3
Modules

You can just start using it, or…

Type annotations
Public / Private
Compile-time type checking
Type interface
Interfaces
Enums
Mixins
Generics
Optional properties
Tuple types
Typescript

If you come from Java or C#
If you believe in compile-time type checking
If you have problems with type-related bugs
If you use Microsoft Visual Studio
If you have a really large project that should
scale and need conventions
When should you use it?

I’m not really gonna talk about it…
http://coffeescript.org/
Coﬀeescript

Web - client side: Must Javascript
Web - server side: Javascript, Python, Ruby
Browser extension: Must Javascript
Iphone app: Swift
Android app: Java
Windows app: C#, Java
Linux app: C++, Python
OS X app: Swift
So which skills do I need?

Web - client side: React.js, Angular, …
Web - server side: Node,js, Express.js, Meteor,…
Browser extension: Jquery, …
Iphone app: React native, PhoneGap, …
Android app: React native, PhoneGap, …
Windows app: Electron, AppJS, …
Linux app: Electron, AppJS, …
OS X app: Electron, AppJS, …
So which frameworks to use?

http://nodeframework.com/
So which frameworks to use?

JS is the fastest scripting language on the
server side
Browsers war brought us super optimised
interpreters/compilers
With regular expressions, V8 is even faster
than C and C++
Another reason - performance

WebStorm
Sublime Text
Atom
Komodo
Aptana
Cloud 9
Codeanywhere
Codenvy
Koding
Orionhub
IDEs

Boris Dinkevich Nir Kaufman
Benjamin GruenbaumShai Reznik

http://www.meetup.com/JavaScript-Israel/

ES7 content: https://tc39.github.io/ecma262/
http://caniuse.com/
http://www.clock.co.uk/blog/javascript-
frameworks-in-2016
Useful links

Javascript status 2016

Related slideshows

More Related Content

Javascript status 2016