"El Javascript acabará con nosotros"
@reyam
var john = {
name : 'John',
greet : function() {
console.log('Hello, I am ' + this.name);
}
}
john.greet(); // Hello, I am John
var greeter = john.greet;
greeter(); // Hello, I am
var name = 'the window';
greeter(); // Hello, I am the window
var mary = {
name : 'Mary';
}
greeter.apply(mary); // Hello, I am Mary
button = document.getElementById('my-button');
button.addEventListener('click', john.greet);
// user clicks => Hello, I am undefined
The problem with JavaScript is not that it is a dynamically typed prototype based object-oriented language without classes. That is actually JavaScript’s strength. The problem is that it is a poorly designed language, filled with many hidden land mines awaiting the unsuspecting developer.
Jeff Walker - Code Ranger
c. 1995
c. 1998-1999
<TABLE>
<TR>
<TD><IMG SRC="blank.gif" WIDTH=300>
<TD><FONT SIZE=42>Hello welcome to this shit</FONT>
</TR>
<TR>
<TD BGCOLOR=RED><IMG SRC="/cgi/webcounter.cgi">
</TR>
</TABLE>
c. 2002-2003
c. 2006
c. 2010
c. 2011-2012
var o = {
f : function() { //... }
};
o.f();
o['f']();
eval("o.f()"); // DANGER!
"use strict";
mistypedVaraible = 17; // ReferenceError
var three = 3;
var triple = function(x) {
return x * three;
}
triple(5) // 15
three = 4;
triple(5) // 20
var three = 3;
var triple = (function() {
var three = 3;
return function(x) {
return x * three;
}
})();
triple(5) // 15
three = 4;
triple(5) // 15
undefined = 3; //WTF!
$ = {};
(function($, window, undefined) {
// $ is JQuery, window the window
// and undefined is still undefined
})(jQuery, window);
var door = {
closed : true,
isClosed : function() {
return this.closed;
},
//...
}
door.isClosed(); // true
door.closed = 'p0wned!';
door.isClosed(); // p0wned!
// Truth-y and False-y madness
door.isClosed() ? 'notSoP0wned' : 'p0wnedIndeed'; // notSoP0wned
var door = (function() {
var closed = true;
var isClosed = function() {
return closed;
}
return {
isClosed : isClosed;
}
})();
door.isClosed(); // true
door.closed = 'p0wned!';
door.isClosed(); // true. FTW
http://javascriptweblog.wordpress.com/2011/02/07/truth-equality-and-javascript/
function Dog(name) {
this.name = name;
}
Dog.prototype.greet = function() {
console.log("Hello, I'm " + this.name);
}
var lassie = new Dog('Lassie');
var trosky = new Dog('Trosky');
lassie.greet(); // Hello, I'm Lassie
trosky.greet(); // Hello, I'm Trosky
console.log(lassie.prototype) // undefined
console.log(lassie.__proto__) // Dog { greet: function }
Dog.prototype === lassie.__proto__ // true
lassie.run(); // ERROR!
Dog.prototype.run = function() {
console.log('Running like a dog');
};
lassie.run(); // Running like a dog
trosky.run = function() {
console.log('Trosky running');
}
trosky.run(); // Trosky running
class Dog
constructor : (@name) ->
greet : -> console.log "Hello, I'm #{@name}"
new Dog('Lassie').greet() # Hello, I'm Lassie
new Dog('Trosky').greet() # Hello, I'm Trosky
$('body').on('click', '[data-behaviour=clear-input]', function(e) {
var $el;
e.preventDefault();
$el = $(e.currentTarget);
return $el.siblings('input').val('');
});
var heading = document.createElement("h1");
var headingText = document.createTextNode("Big Head!");
heading.appendChild(headingText);
document.body.appendChild(heading);
$('.notice').css({ 'color': 'red' }); // NOP
$('.notice').addClass('alert'); // YEP
$.get('http://api.com/davidbarral', function(result) { ... });
$.get('http://api.com/davidbarral', function() {
$.get('http://api.com/asischao', function() {
$.get('http://api.com/trabe', function() {
console.log('All together right now!');
}
}
});
var done = 0;
function callback() {
done += 1;
if (done === 3) {
console.log('All together right now!');
}
};
$.get('http://api.com/davidbarral', callback);
$.get('http://api.com/asischao', callback);
$.get('http://api.com/trabe', callback);
var davidbarral = $.get('http://api.com/davidbarral');
var asischao = $.get('http://api.com/asischao');
var trabe = $.get('http://api.com/trabe');
$.when(davidbarral, asischao, trabe).done(function() {
console.log('Maaaambo!')
});
function myThing() {
var deferred = $.Deferred()
// ...
// resolve the deferred
// ...
return deferred.promise();
}
myThing().done(function() {
console.log('Done!');
})
describe('doubler', function() {
it('doubles a number', function() {
expect(doubler(5)).toEqual(10);
});
});
function doubler(x) {
return 2 * x;
}
Atwood's Law:
Any application that can be written in JavaScript, will eventually be written in JavaScript