The 'new' keyword - Object Creation in JavaScript P4 - FunFunFunction #50

💖 Support the show by becoming a Patreon

We explore the new keyword in JavaScript works when applied to functions. This is the old school way of faking classes in JavaScript, prior to the class keyword being introduced in ES6. (We are going to be looking at the JavaScript ES6 class keyword later in this series)

# Stuff mentioned in the video:

• Code from the episode

• Full series: Object creation in JavaScript

• Book: JavaScript the good parts

• Episode mentioned: Semicolons cannot save you

• Music in the video: Peacock by 7 minutes dead

# Hotspots
04:16 Why learn about new in JavaScript
07:58 What does new in JavaScript do
13:40 Apply in JavaScript
15:20 Arguments keyword in JavaScript
22:13 Summary

💛 Follow on Twitch and support by becoming a Subscriber
We record the show live Mondays 7 AM PT

💛 Fun Fun Forum

💛 mpj on Twitter

💛 CircleCI (Show sponsor)
Robust and sleek Docker-based Continuous Integration as a service. I used CircleCI prior to them becoming a sponsor and I love that their free tier is powerful enough for small personal projects, even if they are private. Use this link when you sign up to let them know you came from here:

💛 Quokka (Show sponsor)
Wonder how MPJ evaluates JavaScript inline his editor. Quokka is the answer - use this link when you buy to let them know you came from here:

💛 FUN FUN FUNCTION
Since 2015, Fun Fun Function (FFF) is one of the longest running weekly YouTube shows on programming 🏅 thanks to its consistency and quality reaching 200,000+ developers.

🤦‍♂️ The Failing Together concept is what makes FFF unique. Most coding content out there focus on step-by-step tutorials. We think tutorials are too far removed from what everyday development is like. Instead, FFF has created a completely new learning environment where we grow from failure, by solving problems while intensively interacting with a live audience.

Tutorials try to solve a problem. Failing Together makes you grow as a developer and coworker.

📹 Each show is recorded live on Twitch in a 2-hour livestream on Mondays. The host, assisted by the audience, is tasked to complete a programming challenge by an expert guest. Like in the real world, we often fail, and learn from it. This, of course, reflects what the audience identifies with, and is one of the most praised aspects of the show.

⏯ On Fridays, an edited version of the show is adapted for and published on YouTube.

Content Topics revolve around: JavaScript, Functional Programming, Software Architecture, Quality Processes, Developer Career and Health, Team Collaboration, Software Development, Project Management

[harshvardhanbhati]

This is my favorite fucking channel over the entire youtube. Keep up the good work man!

[Byamarro]

17:18
"If it was ES6 then we could use Array.from(arguments)"
Well, if it was ES6, we could simply use destructuring operator.

spawn(constructor, ...args){
//args is an array inside spawn's body
}
Also, you wouldn't need to slice first element, as the array would start from second argument.

Cheers!

[darrenking]

Great stuff. One thing that wasn't mentioned explicitly is that when you use "apply", as opposed to "bind", you need to pass in an array. I always remember it this way: when you see the "a" in "apply", remember it requires an "a" as in "array". :)

[briancarroll]

Great video mpj! I am feeling: 1) happy to finally understand this.. and 2) a little bit frustrated with JavaScript's craziness!

[jamin]

Jesus you are a tutor and a All I need is your videos. Please keep them coming

[adrienmentoroc]

seriously I keep coming back to check again all the basics with Javascript, the quality of each videos is very high. MPJ should open a school to create a skilled developer army. Keep going ! I learnt a lot thanks to you

[charlesnicoll]

Writing the code for new is brilliant!! Great for clear definition! (Verbal descriptions and graphical representations are confusing.

[SergeyBaranyuk]

"From scratch" videos is awesome! Thank you mpj! Keep doing these videos

[daggawagga]

I think it's amazing how you managed to make this clearer than most of the very popular tutorials on this subject (at least for me).

[fotios]

12:44 About the existence of the 'prototype' property... Well, in the book that you mentioned (JavaScript The Good Parts) on page 47, Crockford says that: "The new function object is given a prototype property whose value is an object containing a constructor property whose value is the new function object (this.prototype = {constructor: this};). The prototype object is the place where inherited traits are to be deposited. Every function gets a prototype object because the language does not provide a way of determining which functions are intended to be used as constructors. The constructor property is not useful. It is the prototype object that is important." So the answer is yes. Thanks for the nice videos, keep on the good work.

[MattKander]

So glad you're uploading regularly. This channel is an absolute goldmine of awesome content.

[ociemitchell]

Great explanation of new. One suggestion for your shell window is to use the up arrow instead of retyping the node command. You can save valuable keystrokes.

[The-cyber-imbiber]

Hard mode: writing custom object-functions.

Insane mode: getting Typescript to not blow up.

[autochton]

Minor niggle: Your implementation didn't check if the value returned from the constructor was an object - just that it was truthy. The new keyword will only replace the return value if the constructor returns an object, not any other type. :-)

[conoroflanagan]

These vids help clarify my reading Secrets of the Javascript Ninja, real js booster. cheers mpj ;)

[jnfsmile]

20:50 To create a closure, perhaps? Have "private" data?

[FabianKurata]

I am impressed by the quality of the videos, given the time, even the first video of the high order functions is super good for a first video.

[faisalmohammed]

"Spawn more Crockford overlords" got me to subscribe, lol. Great videos, easy to watch and informative. You're doing an awesome job!

[sudee]

A constructor function returning an object is actually pretty useful. Most of the built in constructors (String, Number, Boolean, Date, ...) do this and it allows you to do stuff like: arrayOfNumbers.map(Boolean), which can be super handy if you're writing functional style code.

[hakimproductive]

The title of the video underrates the content of the video.