6. Prototype | Object-Oriented JavaScript

Sign In Start Free Trial

Book Overview & Buying
Table Of Contents

Object-Oriented JavaScript - Third Edition

By : Ved Antani, Stoyan STEFANOV

4.5 (6)

Object-Oriented JavaScript

4.5 (6)

By: Ved Antani, Stoyan STEFANOV

Overview of this book

JavaScript is an object-oriented programming language that is used for website development. Web pages developed today currently follow a paradigm that has three clearly distinguishable parts: content (HTML), presentation (CSS), and behavior (JavaScript). JavaScript is one important pillar in this paradigm, and is responsible for the running of the web pages. This book will take your JavaScript skills to a new level of sophistication and get you prepared for your journey through professional web development. Updated for ES6, this book covers everything you will need to unleash the power of object-oriented programming in JavaScript while building professional web applications. The book begins with the basics of object-oriented programming in JavaScript and then gradually progresses to cover functions, objects, and prototypes, and how these concepts can be used to make your programs cleaner, more maintainable, faster, and compatible with other programs/libraries. By the end of the book, you will have learned how to incorporate object-oriented programming in your web development workflow to build professional JavaScript applications.

Preface

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

1. Object-Oriented JavaScript

1. Object-Oriented JavaScript

A bit of history

ECMAScript 5

ECMAScript 6

Object-oriented programming

OOP summary

Setting up your training environment

Summary

2. Primitive Data Types, Arrays, Loops, and Conditions

2. Primitive Data Types, Arrays, Loops, and Conditions

Variables

Operators

Primitive data types

Primitive data types recap

Arrays

Conditions and loops

Comments

Exercises

Summary

3. Functions

3. Functions

What is a function?

Default parameters

Rest parameters

Spread operators

Scope of variables

Block scope

Functions are data

Closures

IIFE versus blocks

Arrow functions

Exercises

Summary

4. Objects

4. Objects

From arrays to objects

Object properties and attributes

ES6 object methods

Destructuring

Built-in objects

ES6 array methods

Lexical this in arrow functions

Exercises

Summary

5. ES6 Iterators and Generators

5. ES6 Iterators and Generators

For...of loop

Iterators and iterables

Generators

Collections

Summary

6. Prototype

6. Prototype

The prototype property

Using the prototype's methods and properties

Augmenting built-in objects

Exercises

Summary

7. Inheritance

7. Inheritance

Prototype chaining

Inheriting the prototype only

Uber - access to the parent from a child object

Isolating the inheritance part into a function

Copying properties

Heads-up when copying by reference

Objects inherit from objects

Deep copy

Using object() method

Using a mix of prototypal inheritance and copying properties

Multiple inheritance

Parasitic inheritance

Borrowing a constructor

Case study - drawing shapes

Exercises

Summary

8. Classes and Modules

8. Classes and Modules

Defining classes

Subclassing

Modules

Summary

9. Promises and Proxies

9. Promises and Proxies

Asynchronous programming model

JavaScript call stack

Promises

Summary

10. The Browser Environment

10. The Browser Environment

Including JavaScript in an HTML page

BOM and DOM - an overview

BOM

DOM

Events

XMLHttpRequest

Exercises

Summary

11. Coding and Design Patterns

11. Coding and Design Patterns

Coding patterns

Design patterns

Summary

12. Testing and Debugging

12. Testing and Debugging

Unit testing

JavaScript debugging

Summary

13. Reactive Programming and React

13. Reactive Programming and React

Reactive programming

React

Virtual DOM

Installing and running react

Summary

A. Reserved Words

A. Reserved Words

Keywords

ES6 reserved words

Previously reserved words

B. Built-in Functions

B. Built-in Functions

C. Built-in Objects

C. Built-in Objects

Object

ES6 addition to objects

Array

Function

Boolean

Number

String

Date

Math

RegExp

Error objects

JSON

D. Regular Expressions

D. Regular Expressions

E. Answers to Exercise Questions

E. Answers to Exercise Questions

Chapter 2, Primitive Data Types, Arrays, Loops, and Conditions

Chapter 3, Functions

Chapter 4, Objects

Chapter 5, Prototype

Chapter 6, Inheritance

Chapter 7, The Browser Environment

Augmenting built-in objects

The objects created by the built-in constructor functions, such as Array, String, and even Object and Function, can be augmented (or enhanced) through the use of prototypes. This means that you can, for example, add new methods to the Array prototype, and in this way you can make them available to all arrays. Let's see how to do this.

In PHP, there is a function called in_array(), which tells you whether a value exists in an array. In JavaScript, there is no inArray() method, although, in ES5, there's indexOf(), which you can use for the same purpose. So, let's implement it and add it to Array.prototype, as follows:

    Array.prototype.inArray = function (needle) { 
      for (var i = 0, len = this.length; i < len; i++) { 
        if (this[i] === needle) { 
          return true; 
        } 
      } 
      return false; 
    };

Now, all arrays have access to the new method. Let's test the following code:

    > var colors...

CONTINUE READING

83

Tech Concepts

36

Programming languages

73

Tech Tools

Unlimited access to the largest independent learning library in tech of over 8,000 expert-authored tech books and videos.

Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.

50+ new titles added per month and exclusive early access to books as they are being written.

Object-Oriented JavaScript

Search

Your notes and bookmarks