JavaScript-mancy
JavaScript-mancy
Mastering the Arcane Art of Writing Awesome JavaScript for C# Developers
About the Book
This book is a compendium that contains all the JavaScript-mancy books in one single volume. At this point in time, it includes JavaScript-mancy:Getting Started, JavaScript-mancy: OOP and drafts for the upcoming books on Functional Programming, Async, Patterns, Tooling and writing modern web apps with Angular.
Imagine... imagine you lived in a world were you could use JavaScript to change the universe around you, to tamper with the threads that compose reality as you know it and do anything that you can imagine. Well, welcome to the world of JavaScript-mancy, where wizards, also known as JavaScriptmancers, control the arcane winds of magic wielding JavaScript to and fro and command the very fabric of reality.
We, programmers, sadly do not live in such a world. But we do have a measure of magic in ourselves, we have the skills and power to create things out of nothingness. And even if we cannot throw fireballs or levitate (yet), we can definitely change/improve/enhance reality and the universe around us with our little creations. Ain't that freaking awesome?
Well, I hope this book inspires you to continue creating, and using this beautiful skill we share, this time, with JavaScript ;).
For many years JavaScript has been frowned upon and looked down on by many developers due to its quirky nature, obscure behaviors and many WTFs that populate its hairy APIs and operations.
Frown upon no more! For with modern design patterns, libraries, tools and the long awaited ECMAScript 6 (ES6, ES2015) writing JavaScript is now a pleasure.
Join me at the school of JavaScript-mancy as we travel along the modern landscape of writing JavaScript in 2015 and beyond, as we discover the organic evolution of this beautiful language and its thriving ecosystem, and delve in the latest features/spells/incantations of the JavaScript Arcana.
You my friend, can no longer ignore JavaScript. JavaScript is the most deployed language on earth, a beautiful and expressive language that supports many paradigms and which has a thriving community that continuously expands and improves its ecosystem with patterns, libraries, frameworks and tools. You don't want to miss this train.
But JavaScript, though forgiving and specially conceived to be easy to learn, can be either daunting for us that have a strongly-typed mindset and come from languages such as C# or Java or, more often, laughed at as a toy.
For you who consider it daunting and hate working with it worry not! I will show you the most common misconceptions and all the patterns you need to know to become as fluent in JavaScript as you are in C#.
For you who consider it a toy language, something associated not with real programming but with copy-paste coding or scripting to add flare to websites, I will show you all the different patterns and programming paradigms that JavaScript supports and which make it just as good and powerful as C#.
Let's get started!
About the Author
Bundles that include this book
About the Contributors
Technical Reviewer - Tome I: Getting Started with JavaScript-mancy
Andreas is a consultant, passionate programmer, double master and a lifelong learner.
Andreas enjoys all sorts of tech and has been developing software that runs on everything from ship engines to the cloud. He enjoys working in the full stack because it’s rewarding, exciting and challenging, all at the same time.
Technical Reviewer - Tome of OOP: Path of the Summoner
Artur is a passionate software developer who has built various web applications for small as well as enterprise companies.
Sometimes he recollects the good, old times when jQuery was in beta, just about to be released as 1.0 and nobody even knew what SPA stood for... Everyday he tries to get better with modern front- end development and software craftsmanship.
Currently he works as Senior Applications Developer at Oracle. When he gets home he plays around with side projects, open source or gets outside and does some running.
Technical Reviewer - Tome I: Getting Started with JavaScript-mancy
Independent software consultant and agile coach, Nathan is pas- sionate about development and a firm believer in agile principles. In his day job he is contractor helping clients to build and deliver working software.
Nathan has successfully bootstrapped agile teams in various com- panies and has given presentations on technology and agile at a number of events.
Reader Testimonials
Samuel Tremblay
SOFTWARE DEVELOPER AT NÉOSYNERGIX INC.
I started reading a sample of this book yesterday and I'm in love with your writing style. Even if I've written a lot of Javascript and I already know about javascript scoping and all these hidden behaviors, I will buy your book just to read it like one goes to see a good movie. Good job!
Andreas Bäcklund
SOFTWARE DEVELOPER AND IT CONSULTANT AT ACTIVE SOLUTION
I read it and it's awesome! Book tip for those who want to gain/refresh some JS skills :)
Andreas Wänqvist
SOFTWARE DEVELOPER AT SIMPLYGON
Doesn't matter if you are not in to #csharp or #javascript Just get it! :) Awesome work
Shawn Busuttil
JUNIOR FRONT END DEVELOPER AT REALM ENTERTAINMENT LTD
A book about JavaScript that is both well-written and at the same time written in style is hard to come by! Even if you are not a beginner in JS or a C# developer, this book is a total gem of the ES6 era.
Matt Ruby
PRINCIPAL SOFTWARE ENGINEER AT BLUESTEM BRANDS, INC. about the OOP tome of this book
This has been the best book I've read on OOP in JS. Most books that cover this subject use obtuse examples. Jaime's examples cover common cases and how to solve them while embracing javascript instead of fighting it. I've been using js for years and I've learned many new techniques from this book. I highly recommend it!
Kári Tristan Helgason
Software Engineer at Google and Technical Reviewer for the OOP tome of this book
This book will not only teach you things you didn't know about object-oriented programming in JavaScript, it will also keep you entertained while doing so! Even if you have no interest in object-oriented programming, and have years of experience with JavaScript, I can guarantee that you will learn new patterns and ways of thinking about a problem from this book. Jaime is fantastic at breaking down concepts and exploring them from different angles until they fall into place. I really enjoyed it.
Table of Contents
-
-
A Note About How I am Writing This Book
- The Process
- Chapter Writing Status
- About The Author
- About the Technical Reviewers
-
Prelude
- A Story About Why I Wrote This Book
- Why Should You Care About JavaScript?
- What is the Goal of This Book?
- Why JavaScript-mancy?
- Is This Book For You?
- How is The Book Organized?
- Understanding the Code Samples in This Book
- A Note About ECMAScript 5 and ECMAScript 6,7 within The Book
- A Note About the Use of Generalizations in This Book
- Do You Have Any Feedback? Found Any Error?
- A Final Word From the Author
-
A Note About How I am Writing This Book
-
Part I. Mastering the Arcane Art of JavaScript-mancy
- Introduction
- Once Upon a Time…
-
Tome I.I JavaScriptmancy: Getting Started
-
The Essential Ingredients Of JavaScript-Mancy
- An Introduction to JavaScript-Mancy
- JavaScript
- JavaScript Has Some Types
- Strings in JavaScript
- Functions in JavaScript
- OOP and Objects in JavaScript
- JavaScript Flow Control
- Logical Operators in JavaScript
- Exception Handling
- Regular Expressions
- But Beware, JavaScript Can Be Weird and Dangerous
- Concluding
-
The Basics Of JavaScript Functions
- The Basics Of Functions
- Functions are the Key
- Function Expressions
- Function Declarations
- Concluding: Prefer Function Declarations and Named Function Expressions
- Exercises
-
Useful Function Patterns: Default Arguments
- Have You Heard Of Defaults?
- Using Default Arguments in JavaScript Today
- Defaults with Objects
- Native Default Arguments with ECMAScript 6
- Concluding
- Exercises
-
More Useful Function Patterns: Arbitrary Arguments
- An Arbitrary Number of Arguments
- The Craziness Of Function Arguments in JavaScript
- Functions with Arbitrary Arguments Right Now!
- Array-Like Objects
- Native Arbitrary Arguments with ES6 Rest Parameters
- Concluding
- Exercises
-
More Useful Function Patterns: Function Overloading
- Have you Heard About The Marvels Of Overloading?
- The Problem with Function Overloading in JavaScript
- How Do We Do Function Overloading Then?
- Function Overloading by Inspecting Arguments
- Using an Options Object
- Relying on ES6 Defaults
- Taking Advantage of Polymorphic Functions
- Concluding
- Exercises
-
On the Art of Summoning Servants and Critters, Or Understanding The Basics of JavaScript Objects
- An Army of Objects
- Object Initializers (a.k.a. Object Literals)
- Creating Objects With Factories
- Data Privacy in JavaScript
- ES6 Improves Object Initializers
- ES6 Symbols and Data Privacy
- Concluding
- Exercises
-
Mysteries of the JavaScript Arcana: JavaScript Quirks and Gotchas Demystified
- A Couple of Tips About JavaScript Quirks and Gotchas
- A Quick Refresher of the JavaScript Arcana 101
- This, Your Most Dangerous Foe
- Global Scope by Default and Namespacing in JavaScript
- Type Coercion Madness
- Using JavaScript in Strict Mode
- Concluding
- Exercises
-
A Guide to Strings, Finding the Right Words and Proper Spell Intonation
- Find the Right Words You Must
- The Basic Of Strings
- New String Features in ES6
- String Cheatsheet
- Concluding
- Exercises
-
Upgrading Your Everyday JavaScript Magic With ECMAScript 6 - Destructuring
- Welcome to the Future! ECMAScript 6
- Destructure All The Things!
- Destructuring Objects
- Destructuring Arrays
- Destructuring Function Arguments
- Concluding
- Exercises
-
Upgrading Your Everyday JavaScript Magic With ECMAScript 6 - Arrow Functions
- Behold! The Arrow Function!
- Arrow Functions Arcana
- Arrow Functions And This Gotchas
- Arrow Functions Don’t Have Arguments Object
- Arrow Functions and the New and Super Operators
- Concluding
- Exercises
-
Upgrading Your Everyday JavaScript Magic With ECMAScript 6 - The Spread Operator
- Ready To Spread Your Wings?
- Use the Spread Operator to Seamlessly Concatenate Arrays
- Easily Use Apply With the Spread Operator
- Converting Array-likes and Collections Into Arrays
- Spread Lets You Combine New and Apply
- Concluding
- Exercises
-
The Essential Ingredients Of JavaScript-Mancy
-
Tome I.II JavaScriptmancy and Data Structures
-
JavaScript Arrays: The All-in-one Data Structure
- We’ll Just Need To Make Sense of All These Items
- JavaScript’s Array
- An Extremely Flexible Data Structure
- Sorting Arrays
- Safe Array Methods
- JavaScript Arrays and LINQ
- Other ES6 and ES7 Features
- Array Cheatsheet
- Concluding
- Exercises
-
Organizing Your Data With ES6 Maps
- Take a Look at These Maps
- JavaScript’s Map
- Iterating Over the Elements of a Map
- Creating a Map From an Iterable Collection
- Map Cheatsheet
- Concluding
- Exercises
-
Sets, For When There Can Only Be One
- You Are One of a Kind
- Working With Sets
- Iterating Sets
- Using Array Methods With Sets
- How Do Sets Understand Equality?
- Sets Cheatsheet
- Concluding
- Exercises
-
The Secrets Behind Collections: Enumerables, Iterables, Iterators and Generators
- Once Upon a Time There Were Enumerables
- ES6 Brings Real Iterables and Iterators
- A Better Way to Create Iterators: ES6 Generators
- Concluding
- Do Some Research
- Exercises
-
Weak Maps and Weak Sets
- Weak Maps and Sets
- Concluding
- Do Some Research
- Exercises
-
JavaScript Arrays: The All-in-one Data Structure
- Tome I. Epilogue
-
Tome II. JavaScriptmancy and OOP: The Path of The Summoner
-
Introduction to the Path of Summoning and Commanding Objects (aka OOP)
- Let me Tell You About OOP in JavaScript
- C# Classes in JavaScript
- OOP Beyond Classes
- Combining Classes with Object Composition
- The Path of the Object Summoner Step by Step
- Concluding
-
Summoning Fundamentals: Encapsulation and Information Hiding
- Let’s get Started With The Basics of OOP!
- Encapsulation: Creating Objects in JavaScript
- Object Initializers
- Constructor Functions and the New Operator
- Data Hiding in JavaScript
- Object Initializers vs Constructor Functions
- Object Factories vs Constructor Functions
- Concluding
- Exercises
-
Summoning Fundamentals: Prototypical Inheritance
- You Don’t Repeat Yourself. Inheritance!
- Classical Inheritance vs Prototypical Inheritance
- JavaScript Prototypical Inheritance
- Object Prototypes
- Object Prototypes with Object.Create or OLOO
- Defining Prototypes with Constructor Functions
- Creating Longer Prototype Chains
- What About Concatenative Protypical Inheritance?
- Object Initializers vs Object.create vs Constructor Functions
- Concluding
- Exercises
-
Summoning Fundamentals: Polymorphism
- Polymorphism Means Many Forms
- Polymorphism in C#
- Polymorphism in JavaScript
- Concluding
- Exercises
-
White Tower Summoning: Mimicking C# Classical Inheritance in JavaScript
- Ever Heard of Classical Inheritance?
- Emulating a C# Class in JavaScript
- Constructor Function + Prototype = Class
- Mimicking Classical Inheritance in JavaScript
- Simplifying Classical Inheritance in ES5
- Concluding
- Exercises
-
White Tower Summoning Enhanced: The Marvels of ES6 Classes
- Create These Units Faster with ES6 Classes!
- From ES5 “Classes” to ES6 Classes
- Prototypical Inheritance via Extends
- Overriding Methods in ES6 Classes
- Static Members and Methods
- ES6 Classes and Information Hiding
- ES6 Classes Behind the Curtain
- Concluding
- Exercises
-
Black Tower Summoning: Objects Interweaving Objects with Mixins
- The Problem With Classes and Classical Inheritance…
- Free Yourself From Classes With Object Composition and Mixins
- Limitations of Mixins as Objects
- Functional Mixins
- Combining Mixins with ES6 Classes
- Object.assign in Depth
- Object.assign Alternatives for ES5 JavaScript-mancers
- Concluding
- Exercises
-
Black Tower Summoning: Safer Object Composition with Traits
- An Improvement Over Mixins
- Traits
- Traits with traits.js
- Composing Traits
- What Happens When You Miss Required Properties?
- Resolving Name Conflicts
- Traits and Data Privacy
- High Integrity Objects With Immutable Traits
- Traits vs Mixins
- Concluding
- Exercises
-
Black Tower Summoning: Next Level Object Composition With Stamps
- I Call Them Stamps
- What are Stamps?
- Stamps OOP Embraces JavaScript
- Stamps By Example
- Stamp Composition
- Stamp Fluent API
- Concluding: Stamps vs Mixins vs Traits
- Exercises
-
Object Internals: The Secrets of Objects
- A Nifty Trick… Object Internals
-
All your Objects Are Belong to
Object - Defining Properties with Object.defineProperty
- Defining Multiple Properties with Object.defineProperties
- Beautiful Property Manipulation with ESnext Decorators
- Class And Method Decorators
- Create Objects With Object.create And Property Descriptors
- Metaprogramming
- Other Useful Object Methods
- Concluding
- Exercises
-
More Metaprogramming with Reflect, Proxies and Symbols
- How Good Are You at Reflection?
- ES6 Reflect
- Reflection? What is reflection?
- ES6 Proxies
- ES6 Symbols and Meta-programming
- Concluding
- Exercises
-
TypeScript
- You Shall Only Use Types!
- JavaScript + Types = Awesome Dev Productivity
- Any JavaScript is Valid TypeScript
- So, What Are The Advantages and Disadvantages of TypeScript?
- Setting up a Simple TypeScript project
- Cool TypeScript Features
- Type Annotations In TypeScript
- Working with TypeScript in Real World Applications
- Concluding
- Exercises
-
Introduction to the Path of Summoning and Commanding Objects (aka OOP)
- Tome II. Epilogue
-
Tome III. JavaScriptmancy and FP: The path of the Functional Programeer
-
Basics of Functional Programming in JavaScript
- Functional Programming and JavaScript
- What is Functional Programming?
- Why Should You Care About Functional Programming?
- Functions As First Class Citizens
- What are Higher-order Functions?
- Pure Functions
- Closures
- Immutability
- Concluding
- Do Some Research
- Exercises
-
Functional Programming: Using LINQ in JavaScript
- The Magic of LINQ
- Functional and Applicative Programming in JavaScript
- LINQ with Array Prototype Functions
- Array.Prototype LINQ-Like Methods CheatSheet
- LINQ Deferred Execution with ES6 Generators
- Filling in the Gaps with JavaScript Libraries
- Concluding
- Appendix. LINQ Query Syntax with ES.Next Comprenhensions
- Do Some Research!
- Exercises
- An Underscore Primer
-
Function Composition in JavaScript
- Functions Programming is All About Functions
- The Forgotten Art of The Function
- Partial Application
- Partial Application with Bind
- Currying
- Composition with Compose…
- ES.next Decorators
- Considerations When Composing Class Methods
- Partial Application
- Do Some Research
- Exercises
-
Object Oriented Programming Futures: Decorators
- ESNext Class and Property Decorators
- Concluding
- Do Some Research
- Exercises
-
Immutability in JavaScript
- Making Objects Immutable
-
Functional Programming In Real World Applications
- Functional Programming in the Real World
- Do Some Research
- Exercises
-
Basics of Functional Programming in JavaScript
-
Tome IV. Architecture and Patterns
-
Organizing Your JavaScript Code With Modules
- IIFE
-
CommonJS Modules
- Node.js and CommonJs modules
-
AMD Modules - Async Module Definition
- AMD basics
- ES6 Modules
-
Composing Applications With Modules
- Direct dependencies
-
Organizing Your JavaScript Code With Modules
-
Tome V. Async: The Path of the Time Traveller
-
The Basics of Asynchronous Programming in JavaScript
- Introduction
- Async With Promises
- Async with Async/Await
-
Async With Reactive Programming
- JavaScript and Async
- An Example Before You Go Crazy With All This Bla Bla Bla
- A Better Async Pattern: Observables and Asynchronous Data Streams
- A Super Simple Intro to Observables: Like an Array But Different
- The Power of a One Single Abstraction
- Side-Effects of Using Rx.js
- Want to Learn More?
- Concluding
-
Reactive Programming Part II
- That Light Bulb Moment
- Take a Look at This Introduction to Rx.js
- Building the Game Step by Step - Part I
- Concluding Part I
- The Web Speech API
- Using Annyang to Gather Player Input
- Why didn’t We Include userWords$ in the Original game$ Observable?
- Adding Scores
- Wait… There’s Something Weird Happening? Every time I say a word I get 200 points! Wat!??
- Cold and Hot Observables
- Concluding
- Would you Like to Learn More About The Web Speech API and Rx.js?
- A Quick Recap
- Time To Make Things More Exciting
- Adding Some Styling and Graphics
- Experimenting With the Web Speech Synthesis API
- Time To Do Some CleanUp!
- Concluding
- What Next?
-
The Basics of Asynchronous Programming in JavaScript
-
Part II. The Magic Realm of JavaScript
- A Short History Of JavaScript
-
Elevate your Front-end Development Workflow With Yeoman
- What is Yeoman?
- Setting Up Yeoman
- Creating Some Apps
- Summary
-
Automate Your Front-end Workflow With Gulp
- Getting Started With Gulp
- Running ES6 With Gulp
- What is Babel?
- Using Gulp and Babel to Transpile ES6
- Summary!
- Webpack
- Testing
-
Part III. Building a Modern JavaScript Application With Angular 2
- An Introduction to Modern Web Development
-
Your First Angular Component
- Why Should You Care About Angular?
- Is Angular Ready?
- The Code Samples
- Getting Started With Angular and TypeScript
- Index.html The Entry Point for Your App
- Bootstrapping Your App
- Wait… But What is an Angular Module? I Thought We Were Just Using ES6 Modules in Angular!
- But What is a Component?
- Your First Component, Listing Star Wars People Of Note!
- Concluding
-
Refactoring to Services
- The Code Samples
- Our People List Component Right Now
- What is an Angular Service?
- Creating The PeopleService
- Injecting Our People Service in The People List Component
- Registering Your Service With Angular
- You Can Also Register Services at the Module Level
- The Angular Cli Can Help You With Registering! Yey!
- Taking Advantage of Angular Component Lifecycle
- Enabling Dependency Injection in Your Service
- Want to Know More About Angular Dependency Injection?
- Concluding
-
Your Second Component and Angular Data Biding
- The Code Samples
- A Person Details Component
- Our People List Component Right Now
- Showing Person Details When Clicking on a Character
- What Are Angular Event Bindings?
- Extracting Person Details Into Its Own Component
- What are Angular Property Bindings?
- Want to Learn more about Angular Data Bindings?
- Concluding
-
Angular Routing
- The Code Samples
- Our Application So Far
- Enter Angular Routing
- Setting up the PeopleList Route
- An Aside: Not Using the CLI?
- Setting up the PersonDetails Route
- Creating Route Links
- Extracting Parameters From Routes
- Going Back to the People List
- Using The Angular CLI to Generate Your Routes
- Extracting Your Routes Into A Separate Module
- Want to Learn More About Angular Routing?
- Concluding
-
Angular Forms and Validation
- The Code Samples
- Our Application Up Until Now
- We Want to Save Our Own Data!
- First Things First! We Need to Add The Forms Module to Our App!
- Using a File Template Instead of an Inline Template
- A Basic Form in Angular
- ngModel and Angular Two-Way Data Binding
- A Review of Angular Data Bindings
- Adding Validation to Our Form
- Custom Validation FTW!
- Submitting Our Form
- Saving Information
- What’s With NgModel and NgForm?
- Bonus Exercise. Adding a Select Input in Angular
- Do You Want to Learn More About Forms?
- Concluding
- An Aside: Oh No! I Haven’t Had Time To Update To The New Forms API! Can I Update to RC5?
-
Consuming Real Data With Http
- The Code Samples
- Our Application Up Until Now
- Let’s Get Some Real Data For Our App!
- Enabling The Http Module In Your App
- Let’s Get Started Using The Http Module To Get Stuff From The Interwebs!
- Error Handling with Observables
- The Async Pipe
- Converting Observables to Promises
- Want to Learn More About Angular HTTP and RxJS?
- Concluding
- Styling Angular Components
- The Angular CLI in Depth
- Managing State in Angular Applications
- Angular And Rx.js
- Angular Animations
- Angular Testing
- Angular Material
-
References and Appendix
-
References
- Specifications
- Books
-
Appendix A. Setting Up Your Developing Environment For ES6
- Using ES6 with Node.js
- ES6 and Modern Browsers
- Real-World ES6 Development Environments
- Appendix B. Fantasy Glossary
-
References
- Notes
The Leanpub 60 Day 100% Happiness Guarantee
Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.
You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!
So, there's no reason not to click the Add to Cart button, is there?
See full terms...
Earn $8 on a $10 Purchase, and $16 on a $20 Purchase
We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.
(Yes, some authors have already earned much more than that on Leanpub.)
In fact, authors have earnedover $13 millionwriting, publishing and selling on Leanpub.
Learn more about writing on Leanpub
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them
