Viaje al centro de la locura con Javascript
1 like318 views
The document humorously explores the various quirks and eccentricities of JavaScript, presenting it as a friend that is both troublesome and endearing. It covers issues like global variables, type handling, and the behavior of 'this', while offering a mix of technical insights and comedic references. The author advises using strict mode and suggests learning other languages or frameworks to improve programming practices.
![SORT SORTS (SORT OF)SORT SORTS (SORT OF)
¿What is the content of var l a�er execution of this code?
var l = [1, 2, 20, 10];
l.sort();
[1, 2, 10, 20]1.
[1, 10, 2, 20] ☑2.
La lista de Schindler (Schindler's List, 1993)
23 de 27](https://image.slidesharecdn.com/presentacion-160803085749/85/Viaje-al-centro-de-la-locura-con-Javascript-23-320.jpg)
Viaje al centro de la locura con Javascript
- 1. 1 de 27
- 2. A JOURNEY TO THEA JOURNEY TO THE DEEPS OF INSANITYDEEPS OF INSANITY WITH JAVASCRIPTWITH JAVASCRIPT By Juan Ignacio Rodríguez de LeónBy Juan Ignacio Rodríguez de León at twitterat twitter@jileon@jileon 2 de 27
- 3. DISCLAIMERDISCLAIMER Javascript is a mix of many good ideas and a few (really) bad ones Spanish technical jargon for this is truño or truñaco We are gonna have a laugh with some of the bad parts But beware! The good parts are really good JavaScript is like that friend of you, embarrasing, not so clever, give you a lot of troubles, but hey! he is your friend 3 de 27
- 4. WHERE THERE IS SMOKE ...WHERE THERE IS SMOKE ... Sombras de sospecha (Shadow of Doubt, 1998) 4 de 27
- 5. THE PARADOXTHE PARADOX The fact is the bad parts where usually included in order to make the language more "friendly" A trouble-less, easygoing environment for the rookie developer... La cena de los idiotas (Le dîner de cons, 1998) 5 de 27
- 6. THEY WANTED TO BUILDTHEY WANTED TO BUILD SOMETHING LIKE THISSOMETHING LIKE THIS Blancanieves y los siete enanitos (Snow White and the Seven Dwarfs, 1937) 6 de 27
- 7. GOT THISGOT THIS Terminator (The Terminator, 1984) 7 de 27
- 8. THERE IS NO INTEGER TYPETHERE IS NO INTEGER TYPE All numbers are stored as IEEE 754 floating point What the hell were they thinking? var a=0; for (var i=0; i<10; i++) { a += 0.1; } console.log(a === 10); ¿Quién engañó a Roger Rabbit? (Who Framed Roger Rabbit, 1988) 8 de 27
- 9. ¿WHAT WOULD BE THE ANSWER?¿WHAT WOULD BE THE ANSWER? if (99999999999999999 === 100000000000000000) { console.log(‘WTF!’); } else { console.log(‘Everything ok’); } Everything ok1. WTF! ☑2. Resacón en Las Vegas (The Hangover, 2009) 9 de 27
- 10. GLOBAL VARIABLES EVERYWHEREGLOBAL VARIABLES EVERYWHERE The right way of declaring a variable is using the reserved word var. If you forgot to use it, the compiler... give an error, compilation stops1. give a warning, compilation continues2. create the variable on the appropiate scope3. goes bananas, throws down the drain any rest of common sense and creates a fucking global variable ☑ 4. Viaje a la perdición (Road to Perdition, 2002) 10 de 27
- 11. You make a typo, the compiler creates a variable THINK OF ITTHINK OF IT fucking GLOBAL Solo ante el peligro (High Noon, 1952) 11 de 27
- 12. FIND THE DIFFERENCEFIND THE DIFFERENCE var f = function() { return { 'ok': true }; } var f = function() { return { 'ok': true }; } El show de Truman (The Truman Show, 1998) 12 de 27
- 13. SEMICOLONSSEMICOLONS Semicolons are “optional” in some cases JavaScript inserts semicolons wherever he believes appropiate There is no warnings, there is no error. Embrace danger. Who wants to live forever? Just a litle question: ¿What must do a sufficiently advanced civilization with the guy who took this desicion? Con faldas y a lo loco (Some Like It Hot, 1959) 13 de 27
- 14. EXTERMINATE!EXTERMINATE! Doctor Who (Doctor Who, 1963-1989, 2005~) 14 de 27
- 15. WHAT IS THE OUTPUT OF THISWHAT IS THE OUTPUT OF THIS CODE?CODE? function() { var foo = 1; var bar = 2; alert(foo + " " + bar); } 1 2 El Señor de los anillos: Las dos torres (The Lord of the Rings: The Two Towers, 2002) 15 de 27
- 16. WHAT IF I CHANGE THE ORDER?WHAT IF I CHANGE THE ORDER? function() { var foo = 1; alert(foo + " " + bar); var bar = 2; } Raises an "Undefined variable" Exception1. Works the same2. Do an alert with the message “1 undefined” ☑3. ¿Victor o Victoria? (Victor Victoria, 1982) 16 de 27
- 17. HOISTINGHOISTING The compiler does a trick named hoisting Declarations of functions are moved to the begining of the scope Declarations of variables (but no the initialization) are "hoisted" too No error, no warning. Things are "simpler" this way Las dos caras de la verdad (Primal Fear, 1996) 17 de 27
- 18. function() { var foo = 1; alert(foo + " " + bar); var bar = 2; } ⇩ function() { var bar; var foo = 1; alert(foo + " " + bar); bar = 2; } La venganza de la Pantera Rosa (Revenge of the Pink Panther, 1978) 18 de 27
- 19. YES BITCHES!YES BITCHES! The compiler REWRITES your source code Escuadrón Suicida (Suicide squad, 2016) 19 de 27
- 20. What's the meaning of thisWhat's the meaning of this In C++, Java, Python, etc. "this" (or "self", in some cases) means the current instance of the class. In JavaScript, this is: The global object (In a browser, windows)1. One object calling this function as a method2. The context passed to the function if it's called with call or apply 3. The recently created object, when the function is called with new 4. Mentiras arriesgadas (True Lies, 1994) 20 de 27
- 21. EN JAVASCRIPT, THIS IS:EN JAVASCRIPT, THIS IS: The global object (In a browser, windows) ☑1. One object calling this function as a method ☑2. The context passed to the function if it's called with call or apply ☑ 3. The recently created object, when the function is called with new ☑ 4. Una verdad incómoda (An Inconvenient Truth, 2006) 21 de 27
- 22. ALL OF THEN!ALL OF THEN! In other words, you have no control on the content of this. It depends not of you, but the one who is calling your function. Absolutly fucking reasonable Deadpool (Deadpool, 2016) 22 de 27
- 23. SORT SORTS (SORT OF)SORT SORTS (SORT OF) ¿What is the content of var l a�er execution of this code? var l = [1, 2, 20, 10]; l.sort(); [1, 2, 10, 20]1. [1, 10, 2, 20] ☑2. La lista de Schindler (Schindler's List, 1993) 23 de 27
- 24. No further questions Your honorNo further questions Your honor Lists are ordered as if were text,Lists are ordered as if were text, regardless of their contentregardless of their content Agárralo como puedas (Naked Gun, 1988) 24 de 27
- 25. THAT'S ALL FOLKSTHAT'S ALL FOLKS Just to finish, the icing on the cake: In JavaScript you can comment lines or text blocks The syntax used for the text blocks was borrowed from PL/1; the /* and */ marks Open question: Was this a good or bad option for JavaScript? Hint: This marks are very unlikely in PL/1 Coherence (Coherence, 2013) 25 de 27
- 26. RECOMENDATIONSRECOMENDATIONS Use the "strict" mode Use jslint (http://www.jslint.com/) Learn CoffeScript (http://coffeescript.org/) or TypeScript (http://www.typescriptlang.org/> or similar Use frameworks and/or libraries: jQuery, Angular, Meteor, Aurelia... there are a lot of then Be careful out there Star Trek: Más allá (Star Trek Beyond, 2016) 26 de 27
- 27. THANK YOU FORTHANK YOU FOR COMINGCOMING Questions?Questions? 27 de 27