Não alimente os trolls: JavaScript é bonito - FrontInSM 2015
-
Upload
rafael-specht-da-silva -
Category
Documents
-
view
57 -
download
0
Transcript of Não alimente os trolls: JavaScript é bonito - FrontInSM 2015
![Page 1: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/1.jpg)
Não alimente os trolls: Javascript é bonito!
@rafael_sps
![Page 2: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/2.jpg)
Quem?
Tecnólogo em Telecomunicações IFSul
Rafael Specht da Silva
![Page 3: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/3.jpg)
![Page 4: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/4.jpg)
![Page 5: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/5.jpg)
![Page 6: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/6.jpg)
Javascript
até que é bonito!
@rafael_sps
![Page 7: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/7.jpg)
Javascript é bonito legal!
@rafael_sps
![Page 8: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/8.jpg)
![Page 9: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/9.jpg)
![Page 10: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/10.jpg)
![Page 11: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/11.jpg)
![Page 12: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/12.jpg)
![Page 13: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/13.jpg)
![Page 14: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/14.jpg)
![Page 15: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/15.jpg)
![Page 16: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/16.jpg)
“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/
![Page 17: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/17.jpg)
Inconsistente
![Page 18: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/18.jpg)
typeof {} // ‘object’
typeof [] // ‘object’
![Page 19: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/19.jpg)
typeof null // ‘object’
typeof undefined // ‘undefined’
undefined == null // true
![Page 20: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/20.jpg)
+
![Page 21: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/21.jpg)
var n1 = 2;
var n2 = 3;
n1 + n2 // 5
var n1 = 2
var n2 = ‘3’
n1 + n2 // ‘23’
![Page 22: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/22.jpg)
![Page 23: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/23.jpg)
https://twitter.com/1Marc/status/486803289175232512
![Page 24: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/24.jpg)
== e ===
![Page 25: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/25.jpg)
0 == false // true
0 === false // false
1 == true // true
1 === true // false
![Page 26: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/26.jpg)
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
![Page 27: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/27.jpg)
“Se você trata null e undefined igualmente, é recompensado com comparações mais simples”
https://speakerdeck.com/getify/new-rules-for-javascript
![Page 28: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/28.jpg)
if (stateMatch !== null && stateMatch.length > 0) {
state = stateMatch[0].replace(/\//g, '');
}
if (stateMatch && stateMatch.length) {
state = stateMatch[0].replace(/\//g, '');
}
![Page 29: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/29.jpg)
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'
![Page 30: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/30.jpg)
var data = {name: 'Luke'}
var user = new User(data.name, data.surname)
user.getCompleteName(); // 'Luke undefined'
![Page 31: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/31.jpg)
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 '
![Page 32: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/32.jpg)
this
![Page 33: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/33.jpg)
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
}
}
![Page 34: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/34.jpg)
function setEvents () {
var that = this;
$('.hit').on('click', function () {
console.log(this);
$(this).toggleClass('odd');
that.setName($('.name').val());
});
}
![Page 35: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/35.jpg)
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
![Page 36: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/36.jpg)
![Page 37: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/37.jpg)
var Human = {
setName: function (name) {
console.log(this);
this.name = name;
},
sayHi: function () {
return 'Hi! My name is ' + this.name + '!';
}
}
![Page 38: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/38.jpg)
var Ninja = {
setName: Human.setName,
setStealhLevel: function (level) {
console.log(this)
this.stealthLevel = level;
}
}
![Page 39: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/39.jpg)
var Turtle = {
setHullLevel: function (level) {
console.log(this);
this.hullLevel = level;
}
}
var NinjaTurtle = {
setName: Ninja.setName,
setStealhLevel: Ninja.setStealhLevel,
setHullLevel: Turtle.setHullLevel
}
![Page 40: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/40.jpg)
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
![Page 41: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/41.jpg)
Objetos mantém referência
![Page 42: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/42.jpg)
var a = [1, 2, 3];
var b = a;
b.pop();
console.log(a); // [1, 2]
console.log(b); // [1, 2]
![Page 43: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/43.jpg)
MODAIShttps://github.com/rssilva/presentations/tree/master/front-in-sm-2015/objectsByReference
![Page 44: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/44.jpg)
É importante:- ter bom-humor!- criticar construtivamente- aprender os paradigmas
![Page 45: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/45.jpg)
Toda linguagem tem peculiaridades. Aprender a lidar com elas é parte do nosso trabalho.
![Page 46: Não alimente os trolls: JavaScript é bonito - FrontInSM 2015](https://reader033.fdocument.pub/reader033/viewer/2022052700/55c2b0bcbb61ebdd2b8b481a/html5/thumbnails/46.jpg)
Obrigado!github.com/rssilvatwitter.com/rafael_spsspeakerdeck.com/rssilva