Crockford on JavaScript - Act III: Function the Ultimate

YUI Library · 182K views · 2011 · 1:13:29

Open on YouTube

Programming language designPython, Ruby & scripting languagesWeb developmentlecturedated

Why Stack Overflow recommends it

Stack Overflow users link it when answering questions about closures, `this`, prototypes and function patterns, and often tell JavaScript beginners to watch it to learn the language properly.

Recommended by 12 people across 12 different months, 2008 to 2020.

What it is

A 2011 lecture by Yahoo!'s JavaScript architect Douglas Crockford, part of his YUI Theater series, on functions in JavaScript. It covers closures, the `this` binding, `arguments`, currying, and his preferred alternatives to `new` and prototypes for object creation.

What people said

Strong rec Eineki · 2012-10 · Stack Overflow · on “Function returning a function to a variable. Why does it need the extra set of ()?”

I would have answered quite the same. I would suggest a Douglas Crockford video on function [this video] . It is lengthy but quite instructive, the best 60 minute a beginner would spend to learn javascript the right way.

Strong rec Marco Scabbiolo · 2016-07 · Stack Overflow · on “iife returned function not working correctly”

MyModule is staying inside the IIFE clousure so it wont be visible from code outside. Assign the result of the IIFE to a MyModule variable Also, you probably meant to assign the log function to the MyModule being constructed, and not its result ( undefined ) And finally, the fact that you declare a variable called something in the constructor does not assign it as a property of the object being constructed. If you wanted something to be private, you have to declare the alert method inside the clousure of the constructor: var MyModule = (function() { function MyModule() { var something = 'something'; this.log = log; // this.log = log(); this.alert = function() { alert(something); }; } //MyMod

Recommends tereško · 2012-04 · Stack Overflow · on “How to add a string to a variable;”

(function () { // to isolate it from rest of the code var handler = function (target) { var list = 'first'; return function () { list = list + target.value; alert(list); }; }, action = handler(document.getElementById('get_answer')); $(document.getElementById('form')).submit( action ); }()); This structure is called "closure", its one of the most important features in JavaScript language and you should learn how to use it. This lecture [this video] might help. And please stop using $.attr() for trivial things.

Recommends Joaquim Rendeiro · 2012-10 · Stack Overflow · on “JavaScript: X.prototype.x adds x to base class, too”

The prototype property returns an object as well, which is an instance of object but not the same instance, so they are not the same object and a comparison for equality naturally returns false. In more detail, Obj1, Obj2 and Obj3 are all functions and objects, and their prototypes are also objects. In C++ terms, think of the prototype property as a pointer to another object, not the class definition or the base class. In the case of Obj2, you'd declare a separate method like this: function Obj2() { this.prototype = new Obj1(); this.myOwnMethod = function (x) { ... } } I was trying to put to writing in my own words a good explanation of object orientation in Javascript, but I think that woul

Recommends GitaarLAB · 2013-04 · Stack Overflow · on “Proper Prototypal Inheritance”

There is no truly uniform 'best way' to do it. 'Good answers' from 2 years old are still relevant (if they are good that is and I personally would discard anything that tries to emulate a class), since javascript (EcmaScript) is quite old (over a decade). call is used to pass what this is. As to prototypal inheritance: I really liked 'crockford on javascript' [LINK] from the YUI Theater. You'd want to watch ' Act III: function the ultimate [this video] ' The simplest way to set the prototype is: objectIdentifier.prototype.methodIdentifier = function(args){ /* your code*/ } There are many different 'construct-patterns' and most of them have their use in a specific given situation. It is generally

Recommends David Fariña · 2013-04 · Stack Overflow · on “The logic of multiple travelling animations in javascript”

setInterval allows, like setTimeout, the use of parameters in the function BUT: setInterval(funcName(param1,param2...), 100); wont work. Youll get it to work like that: var func = function () { funcName(param1,param2..); } setInterval(func, 100); To understand that part of javascript, read through dougles crockfords explanation of functions, he tells about this very clear and deep. Link to a video of him [this video] EDIT: Sry i understood your question wrong... The problem why it wont work is, like you figured out the global vars. You could just make bug an object. His actions will then be methods, which can contain a function and so on. If you then initialize a new bug (you can do this a thousa

Recommends Mark Hildreth · 2013-06 · Stack Overflow · on “OOP in JS, how does this.init.apply work with OOP”

I too was confused by how all this OOP stuff in JavaScript worked. I would recommend watching Crockford on Javascript: Act 3 [this video] , as it was what helped a lot of this "click" for me.

Recommends Vad · 2016-08 · Stack Overflow · on “How to add a event listener in prototype in javascript?”

The function where you add .addEventListener , you need to bind that function to your this object, like this: this.nodes[i].addEventListener('click', function (e) { e.target.checked ? this.temp|=e.target.value:this.temp^=e.target.value; //this.temp can be accessed correctly. this.showCheckedNums(); }.bind(this)); Notice the .bind(this) I added. There are four ways how this is determined in JavaScript functions. See this lecture [this video] . A better way to do what you are trying to do would be like this: function onClick(e) { e.target.checked ? this.temp|=e.target.value:this.temp^=e.target.value; this.showCheckedNums(); }; var onClickBound = onClick.bind(this); this.nodes[i].addEventListener('c

Recommends vothaison · 2016-10 · Stack Overflow · on “are there any issues with attaching a property or function to a function object”

You can read Javascript: The Good Parts by Douglas Crockford. That book has everything you need to know about all the specialties of Javascript. Some features that might confuse you if you come from Java or C/C++. This is a talk about function: [this video] also by him.

Recommends Booster2ooo · 2017-05 · Stack Overflow · on “JavaScript best practice prototype”

I advice you to have a look at a talk of Douglas Crockford, Function The Ultimate ( [this video] ), it exposes various ways to work with objects creation?