não alimente os trolls: javascript é bonito - frontinsm 2015

Post on 06-Aug-2015

57 Views

Category:

Documents

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

Não alimente os trolls: Javascript é bonito!

@rafael_sps

Quem?

Tecnólogo em Telecomunicações IFSul

Rafael Specht da Silva

Javascript

até que é bonito!

@rafael_sps

Javascript é bonito legal!

@rafael_sps

“Se JavaScript não fosse tão feia, um livro chamado ‘JavaScript: The Good Parts’ não seria o best-seller da linguagem na Amazon”http://simpleprogrammer.com/2013/05/06/why-javascript-is-doomed/

Inconsistente

typeof {} // ‘object’

typeof [] // ‘object’

typeof null // ‘object’

typeof undefined // ‘undefined’

undefined == null // true

+

var n1 = 2;

var n2 = 3;

n1 + n2 // 5

var n1 = 2

var n2 = ‘3’

n1 + n2 // ‘23’

https://twitter.com/1Marc/status/486803289175232512

== e ===

0 == false // true

0 === false // false

1 == true // true

1 === true // false

var url1 = 'http://localhost/rs/santa-maria'

var url2 = 'http://localhost/'

var getState = function (url) {

var stateMatch = url.match(/\/[a-z]{2}\//gi);

var state = null;

if (stateMatch !== null && stateMatch.length > 0) {

state = stateMatch[0].replace(/\//g, '');

}

return state;

}

getState(url1); // ‘rs’

getState(url2); // null

“Se você trata null e undefined igualmente, é recompensado com comparações mais simples”

https://speakerdeck.com/getify/new-rules-for-javascript

if (stateMatch !== null && stateMatch.length > 0) {

state = stateMatch[0].replace(/\//g, '');

}

if (stateMatch && stateMatch.length) {

state = stateMatch[0].replace(/\//g, '');

}

var data = {name: 'Luke', surname: 'Skywalker'}

var User = function (name, surname) {

this.name = name;

this.surname = surname;

this.getCompleteName = function () {

return this.name + ' ' + this.surname;

}

}

var user = new User(data.name, data.surname)

user.getCompleteName(); // 'Luke Skywalker'

var data = {name: 'Luke'}

var user = new User(data.name, data.surname)

user.getCompleteName(); // 'Luke undefined'

var data = {name: 'Luke'}

var User = function (name, surname) {

this.name = name;

this.surname = surname || '';

this.getCompleteName = function () {

return this.name + ' ' + this.surname;

}

}

var user = new User(data.name, data.surname)

user.getCompleteName(); // 'Luke '

this

var UserView = function () {

function setName (name) {

this.name = name;

}

function setEvents () {

var that = this;

$('.hit').on('click', function () {

console.log(this); // <button class="hit">Hit me!</button>

$(this).toggleClass('odd');

that.setName($('.name').val());

});

}

return {

setEvents: setEvents,

setName: setName

}

}

function setEvents () {

var that = this;

$('.hit').on('click', function () {

console.log(this);

$(this).toggleClass('odd');

that.setName($('.name').val());

});

}

function setEvents () {

var button = $('.hit');

function handler () {

console.log(this);

button.toggleClass('odd');

this.setName($('.name').val());

}

button.on('click', handler.bind(this));

}https://github.com/rssilva/presentations/blob/master/front-in-sm-2015/thisWorld/ex1.html

var Human = {

setName: function (name) {

console.log(this);

this.name = name;

},

sayHi: function () {

return 'Hi! My name is ' + this.name + '!';

}

}

var Ninja = {

setName: Human.setName,

setStealhLevel: function (level) {

console.log(this)

this.stealthLevel = level;

}

}

var Turtle = {

setHullLevel: function (level) {

console.log(this);

this.hullLevel = level;

}

}

var NinjaTurtle = {

setName: Ninja.setName,

setStealhLevel: Ninja.setStealhLevel,

setHullLevel: Turtle.setHullLevel

}

var raphael = Object.create(NinjaTurtle, {});

raphael.setName('Raphael');

raphael.setStealhLevel(50);

raphael.setHullLevel(100);

console.log(raphael);

console.log(raphael.sayHi);

https://github.com/rssilva/presentations/blob/master/front-in-sm-2015/thisWorld/ex2.html

Objetos mantém referência

var a = [1, 2, 3];

var b = a;

b.pop();

console.log(a); // [1, 2]

console.log(b); // [1, 2]

MODAIShttps://github.com/rssilva/presentations/tree/master/front-in-sm-2015/objectsByReference

É importante:- ter bom-humor!- criticar construtivamente- aprender os paradigmas

Toda linguagem tem peculiaridades. Aprender a lidar com elas é parte do nosso trabalho.

Obrigado!github.com/rssilvatwitter.com/rafael_spsspeakerdeck.com/rssilva

top related