Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds
Object-Oriented JavaScript
Object-Oriented JavaScript

Object-Oriented JavaScript:

eBook
₱580 ₱1796.99
Paperback
₱2245.99
Subscription
Free Trial

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing
Table of content icon View table of contents Preview book icon Preview Book

Object-Oriented JavaScript

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

Before diving into the object-oriented features of JavaScript, let's first take a look at some of the basics. This chapter walks you through:

  • The primitive data types in JavaScript, such as strings and numbers

  • Arrays

  • Common operators, such as +, -, delete, and typeof

  • Flow control statements, such as loops and if-else conditions

Variables


Variables are used to store data. When writing programs, it is convenient to use variables instead of the actual data, as it's much easier to write pi instead of 3.141592653589793 especially when it happens several times inside your program. The data stored in a variable can be changed after it was initially assigned, hence the name "variable". Variables are also useful for storing data that is unknown to the programmer when the code is written, such as the result of later operations.

There are two steps required in order to use a variable. You need to:

  • Declare the variable

  • Initialize it, that is, give it a value

In order to declare a variable, you use the var statement, like this:

var a; 
var thisIsAVariable; 
var _and_this_too; 
var mix12three;

For the names of the variables, you can use any combination of letters, numbers, and the underscore character. However, you can't start with a number, which means that this is invalid:

var 2three4five;

To initialize a variable means to give...

Operators


Operators take one or two values (or variables), perform an operation, and return a value. Let's check out a simple example of using an operator, just to clarify the terminology.

>>> 1 + 2

3

In this code:

  • + is the operator

  • The operation is addition

  • The input values are 1 and 2 (the input values are also called operands)

  • The result value is 3

Instead of using the values 1 and 2 directly in the operation, you can use variables. You can also use a variable to store the result of the operation, as the following example demonstrates:

>>> var a = 1; 
>>> var b = 2; 
>>> a + 1 

2

>>> b + 2 

4

>>> a + b 

3

>>> var c = a + b; 
>>> c 

3

The following table lists the basic arithmetic operators:

Operator symbol

Operation

Example

+

Addition

>>> 1 + 2

3

-

Substraction

>>> 99.99 – 11

88.99

*

Multiplication

>>> 2 * 3
 6

/

Division...

Primitive Data Types


Any value that you use is of a certain type. In JavaScript, there are the following primitive data types:

  1. Number—this includes floating point numbers as well as integers, for example 1, 100, 3.14.

  2. String—any number of characters, for example "a", "one", "one 2 three".

  3. Boolean—can be either true or false.

  4. Undefined—when you try to access a variable that doesn't exist, you get the special value undefined. The same will happen when you have declared a variable, but not given it a value yet. JavaScript will initialize it behind the scenes, with the value undefined.

  5. Null—this is another special data type that can have only one value, the null value. It means no value, an empty value, nothing. The difference with undefined is that if a variable has a value null, it is still defined, it only happens that its value is nothing. You'll see some examples shortly.

Any value that doesn't belong to one of the five primitive types listed above is an object. Even null is considered an...

Primitive Data Types Recap


Let's quickly summarize what has been discussed so far:

  • There are five primitive data types in JavaScript:

    • number

    • string

    • boolean

    • undefined

    • null

  • Everything that is not a primitive is an object

  • The number data type can store positive and negative integers or floats, hexadecimal numbers, octal numbers, exponents, and the special numbers NaN, Infinity, and –Infinity

  • The string data type contains characters in quotes

  • The only values of the boolean data type are true and false

  • The only value of the null data type is the value null

  • The only value of the undefined data type is the value undefined

  • All values become true when converted to a boolean, with the exception of the six falsy values:

    • ""

    • null

    • undefined

    • 0

    • NaN

    • false

Arrays


Now that you know the basic primitive data types in JavaScript, it's time to move to a more interesting data structure—the array.

To declare a variable that contains an empty array, you use square brackets with nothing between them:

>>> var a = [];
>>> typeof a; 

"object"

typeof returns "object", but don't worry about this for the time being, we'll get to that when we take a closer look at objects.

To define an array that has three elements, you do this:

>>> var a = [1,2,3];

When you simply type the name of the array in the Firebug console, it prints the contents of the array:

>>> a 

[1, 2, 3]

So what is an array exactly? It's simply a list of values. Instead of using one variable to store one value, you can use one array variable to store any number of values as elements of the array. Now the question is how to access each of these stored values?

The elements contained in an array are indexed with consecutive numbers starting from zero...

Conditions and Loops


Conditions provide a simple but powerful way to control the flow of execution through a piece of code. Loops allow you to perform repeating operations with less code. Let's take a look at:

  • if conditions,

  • switch statements,

  • while, do-while, for, and for-in loops.

Code Blocks

Let's start by clarifying what a block of code is, as blocks are used extensively when constructing conditions and loops.

A block of code consists of zero or more expressions enclosed in curly brackets.

{
  var a = 1; 
  var b = 3;
}

You can nest blocks within each other indefinitely:

{
  var a = 1; 
  var b = 3;
  var c, d;
  {
    c = a + b;
    {
      d = a - b;
    }
  }
}

Tip

Best Practice Tips

  • Use end-of-line semicolons. Although the semicolon is optional when you have one expression per line, it's good to develop the habit of using them. For best readability, the individual expressions inside a block should be placed one per line and separated by semi-colons.

  • Indent any code placed within curly...

Comments


One last thing for this chapter: comments. Inside your JavaScript code you can put comments. These are ignored by the JavaScript engine and don't have any effect on how the program works. But they can be invaluable when you revisit your code after a few months, or transfer the code to someone else for maintenance.

Two types of comments are allowed:

  • Single line comments—start with // and end at the end of the line

  • Multi-line comments—start with /* and end with */ on the same line or any subsequent line. Note that any code in between the comment start and the comment end will be ignored.

Some examples:

// beginning of line
var a = 1; // anywhere on the line
/* multi-line comment on a single line */	
/* 
    comment
    that spans
    several lines
 */

There are even utilities, such as JSDoc, that can parse your code and extract meaningful documentation based on your comments.

Summary


In this chapter, you learned a lot about the basic building blocks of a JavaScript program. Now you know the primitive data types:

  • number

  • string

  • boolean

  • undefined

  • null

You also know quite a few operators:

  • Arithmetic operators: +, -, *, /, and %.

  • Increment operators: ++ and --.

  • Assignment operators: =, +=, -=, *=, /=, and %=.

  • Special operators: typeof and delete.

  • Logical operators: &&, ||, and !.

  • Comparison operators: ==, ===, !=, !==, <, >, >=, and <=.

Then you learned how to use arrays to store and access data, and finally you saw different ways to control the flow of your program—using conditions (if-else or switch) and loops (while, do-while, for, for-in).

This is quite a bit of information and it is recommended that you now go through the exercises below, then give yourself a well-deserved pat on the back before diving into the next chapter. More fun is coming up!

Exercises


  1. What is the result of executing each of these lines in the console? Why?

    • var a; typeof a;

    • var s = '1s'; s++;

    • !!"false"

    • !!undefined

    • typeof -Infinity

    • 10 % "0"

    • undefined == null

    • false === ""

    • typeof "2E+2"

    • a = 3e+3; a++;

  2. What is the value of v after the following?

    >>> var v = v || 10;

    Experiment by first setting v to 100, 0, null, or unset it (delete v).

  3. Write a script that prints out the multiplication table. Hint: use a loop nested inside another loop.

Left arrow icon Right arrow icon

What you will learn

  • Learn to think in JavaScript, the language of the web browser The basics of object-oriented programming, and how they apply to JavaScript Set up and use your training environment (Firebug) Master data types, operators, and flow control statements Understand functions: usage patterns, variable scope, and built-in functions Closures demystified Create and use objects Understand and use prototypes Reuse code with common patterns for inheritance Understand and work with the BOM (Browser Object Model) The DOM (Document Object Model) â€- accessing, modifying, adding, and deleting nodes Build responsive web pages with AJAX JSON (JavaScript Object Notation) Listen and respond to browser events Apply design patterns to solve common problems Adopt coding patterns that unleash the unique power of the language Make your programs cleaner, faster, and compatible with other programs and libraries Achieve missing object-oriented features in JavaScript such as private properties and methods

Product Details

Country selected
Publication date, Length, Edition, Language, ISBN-13
Publication date : Jul 23, 2008
Length: 356 pages
Edition :
Language : English
ISBN-13 : 9781847194145
Category :
Languages :

What do you get with a Packt Subscription?

Free for first 7 days. $19.99 p/m after that. Cancel any time!
Product feature icon Unlimited ad-free access to the largest independent learning library in tech. Access this title and thousands more!
Product feature icon 50+ new titles added per month, including many first-to-market concepts and exclusive early access to books as they are being written.
Product feature icon Innovative learning tools, including AI book assistants, code context explainers, and text-to-speech.
Product feature icon Thousands of reference materials covering every tech concept you need to stay up to date.
Subscribe now
View plans & pricing

Product Details

Publication date : Jul 23, 2008
Length: 356 pages
Edition :
Language : English
ISBN-13 : 9781847194145
Category :
Languages :

Packt Subscriptions

See our plans and pricing
Modal Close icon
$19.99 billed monthly
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Simple pricing, no contract
$199.99 billed annually
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just ₱260 each
Feature tick icon Exclusive print discounts
$279.99 billed in 18 months
Feature tick icon Unlimited access to Packt's library of 7,000+ practical books and videos
Feature tick icon Constantly refreshed with 50+ new titles a month
Feature tick icon Exclusive Early access to books as they're written
Feature tick icon Solve problems while you work with advanced search and reference features
Feature tick icon Offline reading on the mobile app
Feature tick icon Choose a DRM-free eBook or Video every month to keep
Feature tick icon PLUS own as many other DRM-free eBooks or Videos as you like for just ₱260 each
Feature tick icon Exclusive print discounts

Frequently bought together


Stars icon
Total 6,175.97
Object-Oriented JavaScript
₱2245.99
Responsive Web Design with HTML5 and CSS3
₱2245.99
JavaScript and JSON Essentials
₱1683.99
Total 6,175.97 Stars icon

Table of Contents

8 Chapters
Introduction Chevron down icon Chevron up icon
Primitive Data Types, Arrays, Loops, and Conditions Chevron down icon Chevron up icon
Functions Chevron down icon Chevron up icon
Objects Chevron down icon Chevron up icon
Prototype Chevron down icon Chevron up icon
Inheritance Chevron down icon Chevron up icon
The Browser Environment Chevron down icon Chevron up icon
Coding and Design Patterns Chevron down icon Chevron up icon

Customer reviews

Top Reviews
Rating distribution
Full star icon Full star icon Full star icon Full star icon Half star icon 4.5
(48 Ratings)
5 star 66.7%
4 star 22.9%
3 star 4.2%
2 star 4.2%
1 star 2.1%
Filter icon Filter
Top Reviews

Filter reviews by




Nicolas Mussat Dec 05, 2009
Full star icon Full star icon Full star icon Full star icon Full star icon 5
A very great book to get insights on Javascript, common design patterns.Well written, loaded with examples, clear, a very useful book.
Amazon Verified review Amazon
Jash Jun 05, 2013
Full star icon Full star icon Full star icon Full star icon Full star icon 5
This is my first review in the 7 years that I have been buying stuff on Amazon. Yes, I'm that lazy. So the fact that I dragged my lazy ass to the review section should tell you something.We recently started using node.js at work for some server side scripting. Since I had no experience in Javascript, I figured I should pick up a book and get up to speed on it. I tried pretty much all popular Javascript books, but none come anywhere close to this for explaining concepts of the Javascript language in a clear, concise and lucid manner. To save you the trouble, here's my experience with the popular/top rated JS books:1. Professional Javascript for web developers - comprehensive, but not as clear or well structured. The author is obviously very knowledgeable, but a good book is much more than a brain dump. TMI!2. Javascript the good parts - useful for those who already know the language.3. Eloquent Javascript - more about programming style than Javascript.4. Pretty much every other book - primary focus is browser, rather than Javascript. Good if that's the scope of your work, but not if you want a solid understanding of the language itself.I have only 2 small complaints:1. I'd like to see a chapter on error handling2. and a chapter on event driven (asynchronous) programmingOther than that, this thing is dang near perfectMy recommendation would be to read the following books in the specified order:1. Object Oriented Javascript2. Javascript the good parts (optional - this will mostly be a refresher after OOJ)3. Eloquent JavascriptPS: I'm not getting paid to say any of this. It really is one of the better technical books I've read in a while.
Amazon Verified review Amazon
Tom Feb 18, 2013
Full star icon Full star icon Full star icon Full star icon Full star icon 5
This book is a very comprehensive guide to understand how Javascript apply concepts like OOP, but not only that, it also shows how the industry leading frameworks apply inheritance through the use of prototypes. It is suitable for beginners and for advanced Javascript programmers; beginners will learn the language foundations and progress to tricky topics, and advanced developers will improve their skills to build better structures with the right techniques. It is a compulsory acquisition as it can be used as a quick reference for classical inheritance in Javascript.
Amazon Verified review Amazon
David Neece Aug 15, 2009
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Great choice for developers learning oop concepts on the client. Its well written and contains just what is needed to kick-off client side coding. I'd recommend it for new to intermediate js developers. However, intermediate developers have probably written similar code, or at least read it elsewhere. Every shop should own a copy!
Amazon Verified review Amazon
Edgar martinez Aug 23, 2011
Full star icon Full star icon Full star icon Full star icon Full star icon 5
Really liked this book. It is probably not the perfect book for someone already very familiar with JavaScript but this is a book worth having for sure. Again if you are an expert with OOP and wonder if this will test your metal, its probably not for you. It is a great introduction to JavaScript and OOP with JavaScript. I would say that every Web developer should have this book around no matter what.
Amazon Verified review Amazon
Get free access to Packt library with over 7500+ books and video courses for 7 days!
Start Free Trial

FAQs

What is included in a Packt subscription? Chevron down icon Chevron up icon

A subscription provides you with full access to view all Packt and licnesed content online, this includes exclusive access to Early Access titles. Depending on the tier chosen you can also earn credits and discounts to use for owning content

How can I cancel my subscription? Chevron down icon Chevron up icon

To cancel your subscription with us simply go to the account page - found in the top right of the page or at https://subscription.packtpub.com/my-account/subscription - From here you will see the ‘cancel subscription’ button in the grey box with your subscription information in.

What are credits? Chevron down icon Chevron up icon

Credits can be earned from reading 40 section of any title within the payment cycle - a month starting from the day of subscription payment. You also earn a Credit every month if you subscribe to our annual or 18 month plans. Credits can be used to buy books DRM free, the same way that you would pay for a book. Your credits can be found in the subscription homepage - subscription.packtpub.com - clicking on ‘the my’ library dropdown and selecting ‘credits’.

What happens if an Early Access Course is cancelled? Chevron down icon Chevron up icon

Projects are rarely cancelled, but sometimes it's unavoidable. If an Early Access course is cancelled or excessively delayed, you can exchange your purchase for another course. For further details, please contact us here.

Where can I send feedback about an Early Access title? Chevron down icon Chevron up icon

If you have any feedback about the product you're reading, or Early Access in general, then please fill out a contact form here and we'll make sure the feedback gets to the right team. 

Can I download the code files for Early Access titles? Chevron down icon Chevron up icon

We try to ensure that all books in Early Access have code available to use, download, and fork on GitHub. This helps us be more agile in the development of the book, and helps keep the often changing code base of new versions and new technologies as up to date as possible. Unfortunately, however, there will be rare cases when it is not possible for us to have downloadable code samples available until publication.

When we publish the book, the code files will also be available to download from the Packt website.

How accurate is the publication date? Chevron down icon Chevron up icon

The publication date is as accurate as we can be at any point in the project. Unfortunately, delays can happen. Often those delays are out of our control, such as changes to the technology code base or delays in the tech release. We do our best to give you an accurate estimate of the publication date at any given time, and as more chapters are delivered, the more accurate the delivery date will become.

How will I know when new chapters are ready? Chevron down icon Chevron up icon

We'll let you know every time there has been an update to a course that you've bought in Early Access. You'll get an email to let you know there has been a new chapter, or a change to a previous chapter. The new chapters are automatically added to your account, so you can also check back there any time you're ready and download or read them online.

I am a Packt subscriber, do I get Early Access? Chevron down icon Chevron up icon

Yes, all Early Access content is fully available through your subscription. You will need to have a paid for or active trial subscription in order to access all titles.

How is Early Access delivered? Chevron down icon Chevron up icon

Early Access is currently only available as a PDF or through our online reader. As we make changes or add new chapters, the files in your Packt account will be updated so you can download them again or view them online immediately.

How do I buy Early Access content? Chevron down icon Chevron up icon

Early Access is a way of us getting our content to you quicker, but the method of buying the Early Access course is still the same. Just find the course you want to buy, go through the check-out steps, and you’ll get a confirmation email from us with information and a link to the relevant Early Access courses.

What is Early Access? Chevron down icon Chevron up icon

Keeping up to date with the latest technology is difficult; new versions, new frameworks, new techniques. This feature gives you a head-start to our content, as it's being created. With Early Access you'll receive each chapter as it's written, and get regular updates throughout the product's development, as well as the final course as soon as it's ready.We created Early Access as a means of giving you the information you need, as soon as it's available. As we go through the process of developing a course, 99% of it can be ready but we can't publish until that last 1% falls in to place. Early Access helps to unlock the potential of our content early, to help you start your learning when you need it most. You not only get access to every chapter as it's delivered, edited, and updated, but you'll also get the finalized, DRM-free product to download in any format you want when it's published. As a member of Packt, you'll also be eligible for our exclusive offers, including a free course every day, and discounts on new and popular titles.

Modal Close icon
Modal Close icon