Last active
August 29, 2015 14:19
-
-
Save sayar/d8f64a80d3a410ba5cba to your computer and use it in GitHub Desktop.
FITC - What's New in ES6 for Web Devs - Sample code from my presentation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// app.js | |
import * as math from "math"; | |
alert("2π = " + math.add(math.pi, math.pi)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// Sample Code from FITC Presentation: "What's New in ES6 for Web Devs" | |
// Function Scoping Sample 1 | |
function scope1() { | |
var foo = 'FITC'; | |
console.log(foo); // Prints 'FITC' | |
if (true) { | |
var foo = 'BAR'; | |
console.log(foo); // Prints 'BAR' | |
} | |
console.log(foo); // Prints 'BAR' | |
} | |
// Function Scoping Sample 2 | |
function scope2() { | |
var foo; | |
foo = 'FITC'; | |
console.log(foo); // Prints 'FITC' | |
if(true) { | |
foo = 'BAR'; | |
console.log(foo); // Prints 'BAR' | |
} | |
console.log(foo); // Prints 'BAR' | |
} | |
// Function Scoping Sample 3 - Hoisting | |
function scope3() { | |
var foo = 'FITC'; | |
if(!bar) { | |
console.log(foo + ' ' + bar); | |
// Prints 'FITC undefined' | |
} | |
var bar = '2015'; | |
console.log(foo + ' ' + bar); | |
// Prints 'FITC 2015' | |
} | |
function scope4() { | |
var foo, bar; | |
foo = 'FITC'; | |
if(!bar) { | |
console.log(foo + ' ' + bar); | |
// Prints 'FITC undefined' | |
} | |
bar = '2015'; | |
console.log(foo + ' ' + bar); | |
// Prints 'FITC 2015' | |
} | |
// Function Scoping Sample 5 | |
function scope5() { | |
var foo; | |
foo = 'FITC'; | |
console.log(foo); // Prints 'FITC' | |
function foobar() { | |
var foo = 'BAR'; | |
console.log(foo); // Prints 'BAR' | |
} | |
foobar(); | |
console.log(foo); // Prints 'FITC' | |
} | |
// Function Scoping Sample 6 with let | |
function scope6() { | |
let foo = 'FITC'; | |
console.log(foo); // Prints 'FITC' | |
if (true) { | |
let foo = 'BAR'; | |
console.log(foo); // Prints 'BAR' | |
} | |
console.log(foo); // Prints 'FITC' | |
} | |
// Function Scoping Sample 7 with const | |
function scope7() { | |
const foo = 'FITC'; | |
console.log(foo); // Prints 'FITC' | |
if (true) { | |
let foo = 'BAR'; | |
console.log(foo); // Prints 'BAR' | |
} | |
// foo = 'BAR'; | |
// Above causes SyntaxError: Assignment to constant variable. | |
console.log(foo); // Prints 'FITC' | |
} | |
// Destructuring Examples | |
function scope8(){ | |
var [foo, bar, ABC] = ['bar', 'foo', 3]; | |
console.log(foo + ' ' + bar + ' ' + ABC); | |
// Prints 'bar foo 3' | |
var foo = 'bar', bar = 'foo', ABC = 3; | |
console.log(foo + ' ' + bar + ' ' + ABC); | |
// Prints 'bar foo 3' | |
var [foo, bar] = ['bar', 'foo']; | |
[foo, bar] = [bar, foo]; | |
console.log(foo + ' ' + bar); | |
// Prints 'foo bar' | |
// Object matching | |
// Simple example without assigning new names | |
var {x, y} = {x: "X", y: "Y"}; | |
console.log(x); // X | |
console.log(y); // Y | |
// getTalk() returns -> { speaker: { name: "Rami" }, title: "Future of JS"} | |
var { title: talk_title, speaker: { name: speaker_name }} = getTalk(); | |
console.log(talk_title); // "Future of JS" | |
console.log(speaker_name); // "Rami" | |
// Can be used in parameter position | |
function g({name: x}) { | |
console.log(x); | |
} | |
g({name: 5}) | |
// Fail-soft destructuring | |
var [a] = []; | |
a === undefined; | |
// Fail-soft destructuring with defaults | |
var [a = 1] = []; | |
a === 1; | |
} | |
function scope9(){ | |
class SkinnedMesh extends THREE.Mesh { | |
constructor(geometry, materials) { | |
super(geometry, materials); | |
this.idMatrix = SkinnedMesh.defaultMatrix(); | |
this.bones = []; | |
this.boneMatrices = []; | |
//... | |
} | |
update(camera) { | |
//... | |
super.update(); | |
} | |
get boneCount() { | |
return this.bones.length; | |
} | |
set matrixType(matrixType) { | |
this.idMatrix = SkinnedMesh[matrixType](); | |
} | |
static defaultMatrix() { | |
return new THREE.Matrix4(); | |
} | |
} | |
} | |
function scope10() { | |
var obj, iterator, pair; | |
obj = { foo: 'bar', conference: 'FITC' }; | |
iterator = Iterator(obj); | |
pair = it.next(); // ["foo", "bar"] | |
pair = it.next(); // ["conference", "FITC"] | |
pair = it.next(); // StopIteration exception thrown | |
var evangelists = ['@ramisayar', '@tommylee', | |
'@scruffyfurn']; | |
var iterator = Iterator(evangelists); | |
for (let [i, e] in iterator) { | |
console.log(i + ': ' + e); | |
// prints "0: @ramisayar" etc. | |
} | |
function *foo() { | |
var x = 2; | |
while(true){ | |
x = x * x; | |
yield x; | |
} | |
} | |
var answer = foo(); | |
answer.next(); // 4 | |
answer.next(); // 16 | |
function *foo() { | |
var x = 1, next = 1; | |
while(true) { | |
x = x * next; | |
next = yield x; | |
} | |
} | |
var answer = foo(); | |
answer.next(); // 1 | |
answer.send(2); // 2 | |
answer.send(2); // 4 | |
} | |
scope1(); | |
scope2(); | |
scope3(); | |
scope4(); | |
scope5(); | |
scope6(); | |
scope8(); | |
scope7(); | |
scope8(); | |
scope9(); | |
scope10(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var koa = require('koa'); | |
var app = koa(); | |
app.use(function *(){ | |
this.body = 'Hello World'; | |
}); | |
app.listen(3000); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// math.js | |
export var pi = 3.141593; | |
export function add(num1, num2) { | |
return num1 + num2; | |
} | |
export function circle_area(r) { | |
return pi * r * r; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
// otherApp.js | |
import {circle_area, pi} from "math"; | |
alert("Area of Circle with Radius of 5 = " + circle_area(5)); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment