não alimente os trolls: javascript é bonito - frontinsm 2015
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