Skip to content
  • Quizes
  • QStack
  • Blog
  • pinterest
  • instagram
  • twitter
  • linkedin
  • facebook
W3 Coding Schools
  • Home
  • HTML
    • HTML Introduction
    • HTML Editors
    • Fundamentals of HTML
    • Elements of HTML
    • HTML Attributes
    • HTML Headings
    • HTML Paragraphs
    • HTML Style Attribute
    • HTML Text Formatting
    • HTML Phrase Tags
    • HTML Comments
    • HTML with CSS
    • HTML Links
    • HTML Images
    • HTML Tables
    • HTML Lists
    • HTML Blocks
    • HTML Class Attribute
    • HTML Id Attribute
    • HTML Iframes
    • HTML JavaScript
    • HTML File Paths
    • HTML Head
    • Computer Code Elements
    • HTML Entities
    • HTML Charset
    • HTML URL Encode
    • HTML and XHTML
    • HTML Layouts
    • HTML Forms
    • HTML Form Elements
    • HTML Form Input Types
    • HTML Input Attributes
    • HTML5 Introduction
    • HTML5 New Elements
    • Semantic Elements
    • HTML5 Migration
    • Style Guide
    • HTML Canvas
  • CSS
    • CSS Introduction
    • CSS Syntax and CSS Comments
    • CSS Selectors
    • How to add CSS to a Webpage
    • CSS Color Basics
    • CSS Background Properties
    • CSS Border Properties
    • CSS Margin and Padding Properties
    • CSS Height and Width properties
    • CSS Box Model
    • CSS Outline Properties
    • CSS Fonts
    • CSS Text
    • How To Add Icons
    • CSS Links
    • CSS List-Style
    • CSS Tables
    • CSS Display Property
    • CSS Position Property
    • CSS Overflow Property
    • CSS max-width Property
    • CSS Float and Clear Properties
    • CSS Alignment
    • CSS inline-block
    • CSS Combinators
    • CSS Pseudo Classes
    • CSS Pseudo Elements
    • CSS Opacity
    • CSS Navigation Bar
    • CSS Dropdowns
    • CSS Image Gallery
    • CSS Image Sprites
    • CSS Attribute Selector
    • CSS Styling Forms
    • CSS Counters
    • CSS Units
    • CSS Specificity
    • CSS Website Layout
    • CSS Rounded Corners
    • CSS Border Image Property
    • CSS Multiple Backgrounds
    • CSS Gradient
    • CSS Shadow Effects
    • CSS Text Effects
    • CSS Web Fonts
    • CSS 2D Transforms
  • Bootstrap 4
    • Bootstrap 4 – Introduction
    • Bootstrap versions
    • Bootstrap 4 Layout
    • Bootstrap 3 Vs Bootstrap 4
    • Bootstrap 4 Grid System
    • Bootstrap 4 Typography
    • Bootstrap 4 Colors
    • Bootstrap 4 Images
    • Bootstrap 4 Tables
    • Bootstrap 4 Jumbotron
    • Bootstrap 4 Figures
    • Bootstrap 4 Alerts
    • Bootstrap 4 Buttons
    • Bootstrap 4 Button Group
    • Bootstrap 4 Badges
    • Bootstrap 4 Spinners
    • Bootstrap 4 Progress Bars
    • Bootstrap 4 Pagination
    • Bootstrap 4 Breadcrumbs
    • Bootstrap 4 List Groups
    • Bootstrap 4 Cards
  • jQuery
    • jQuery Introduction
    • jQuery Download
    • jQuery Selectors
    • jQuery Event Methods
    • jQuery Hide/Show Effects
    • jQuery Fading Effects
    • jQuery Sliding Effects
    • jQuery Animation
    • jQuery Stop and Callback
    • jQuery Get and Set Methods
    • jQuery Chaining
    • jQuery Add
    • jQuery Remove
    • jQuery CSS Classes
    • jQuery Style Properties
    • jQuery Dimensions
    • jQuery Traversing
    • jQuery Ancestors
    • jQuery Descendants
    • jQuery Siblings
  • Javascript
    • JS Introduction
    • JS Where to Put
    • JavaScript Syntax
    • JavaScript Comments
    • JavaScript Variables
    • JavaScript Data Types
    • JavaScript Operators
    • JavaScript Events
    • JavaScript Strings
    • JavaScript Numbers
  • php
    • PHP Introduction
    • Install PHP
    • PHP Syntax and Comments
    • PHP Variables
    • PHP Constants
    • PHP Echo and Print
    • PHP Data Types
    • PHP Strings
    • PHP Operators
    • PHP $ and $$ Variables
  • WordPress
    • WordPress Introduction
    • WordPress History
    • WordPress.com vs WordPress.org
    • How to Install WordPress
    • WordPress Dashboard
    • How to Create a WordPress Website
    • WordPress Posts
    • WordPress Pages
    • WordPress Posts vs Pages
    • WordPress Categories
  • SEO
    • SEO Introduction
    • SEO Tactics and Methods
    • SEO Relevant Filenames
    • SEO Domain Name
    • Website Design and SEO
    • SEO Keywords
    • Meta Tags Optimization
    • Title Tag Optimization
    • Anchor Text Optimization
    • Content Optimization
  • Android
    • Android Introduction
    • Android History and Versions
    • Android Architecture
    • Android Environment Setup
    • Android Application Components
    • Hello World Application
    • Android Activities
  • iOS
    • iOS Introduction
    • iOS Environment Setup
    • iOS Architecture

You Are Here

  • Home
  • Learn Javascript
  • JavaScript Numbers

Topics

  • JavaScript Numbers
  • JavaScript Strings
  • JavaScript Events
  • JavaScript Operators
  • JavaScript Data Types
  • JavaScript Variables
  • JavaScript Comments
  • JavaScript Syntax
  • JS Where to Put
  • JS Introduction

Oct Champs & Prizes

  • 1. Pooja Ladda
  • 2. Manjali Kuldharan
  • 3. Pranali Surawar
  • 4. Anjali Kulkarni
  • 5. Vishal Deshmukh

Recent Posts

  • HTML Media
  • jQuery Siblings
  • Bootstrap 4 Cards
  • jQuery Descendants
  • jQuery Ancestors

JavaScript Numbers

A Number is a primitive data type in JavaScript. Both integer and floating-point number formats are supported by JavaScript that can be represented in decimal, hexadecimal or octal notation. JavaScript does not treat integer and floating-point numbers differently, unlike other languages. Numbers in JavaScript are represented as floating-point numbers.

Example:

var a = 6; //integer number
var b = 2.47; //floating point number
Try it
The extra-large number can be represented in exponential notation in JavaScript.

Example:

var a = 156e5; //same as 15600
var b = 156e-5; //same as 0.00156
Try it
In JavaScript, numbers can also be represented in hexadecimal notation (base 16). These hexadecimal numbers are prefixed with 0x. They are commonly used to represent colors.

Example:

var a = 0xFF; // same as 255
var b = 0xb4; // same as 180
Try it

Representing Infinity:

Infinite means a number is too big to handle for JavaScript. JavaScript provides special keyword Infinity(∞) and -Infinity(-∞) to represent positive and negative infinity respectively.
For example, dividing to any number by 0 returns infinity as shown below:

Example:

var a = 10 / 0;
document.write(x + "<br>"); // Infinity
var b = -10 / 0;
document.write(y); // -Infinity
Try it
Note: Infinity is a special value and it represents the mathematical Infinity ∞, which is greater than any number. The typeof operator returns the number for an Infinity value.

Avoiding Precision Problems:

Sometimes while performing operations on floating-point numbers produce unexpected results, as shown below:

Example:

var a = 0.2 + 0.1;
document.getElementById("trial").innerHTML = a;
Try it
In the above example, the result is 0.30000000000000004 rather than the expected 0.3. This difference in the result is called representation error or roundoff error.
This error occurs because JavaScript and many other languages use binary (base 2) form to represent decimal (base 10) numbers internally. But, most decimal fractions can’t be represented exactly in binary form that’s why small differences occur.
To avoid such problem you can use the solution given below:

Example:

var a = (0.2 * 10 + 0.1 * 10) / 10;
document.getElementById("trial").innerHTML = a;
Try it
In JavaScript floating-point numbers are rounded to 17 digits which is enough accuracy in most cases. Also, JavaScript integers are accurate up to 15 digits, as shown in the following example:

Example:

var a = 999999999999999;
document.getElementById("trial1").innerHTML = a;
var b = 9999999999999999;
document.getElementById("trial2").innerHTML = b;
Try it

Performing Operations on Numbers:

JavaScript provides different methods and properties to perform operations on numeric values. As we know in JavaScript primitive data types can act like objects when you refer to them with the property access notation i.e dot notation.
In the following section, we will learn the most commonly used Javascript number methods.

Parsing Integers from Strings:

The parseInt() method is used to parse an integer from a string. If this method encounters a character that is not numeric in the specified base, it stops parsing and returns the integer value parsed up to that point. If the first character cannot be converted into a number, the parseInt() method will return NaN (not a number).

Example:

var a = parseInt("2.76") + "<br>";
var b = parseInt("30px") + "<br>";
var c = parseInt("10pt") + "<br>";
var d = parseInt("0xff", 16 ) + "<br>";
var e = parseInt("40 years") + "<br>";
var f = parseInt("Year 2060") + "<br>";
var g = parseInt("31 12 2019") + "<br>";
var h = a + b + c + d + e + f + g;
document.getElementById("trial").innerHTML = h;
Try it
Similarly, the parseFloat() method can be used to parse floating-point numbers from a string. This method works the same way as the parseInt() method, the only difference is that it retrieves both integers and numbers with decimals.

Example:

var a = parseFloat("2.76") + "<br>";
var b = parseFloat("30px") + "<br>";
var c = parseFloat("2.3em") + "<br>";
var d = parseFloat("136.7 lbs") + "<br>";
var e = parseFloat("weight 136.7 lbs") + "<br>";
var f = parseFloat("4.6 acres") + "<br>";
var h = a + b + c + d + e + f;
document.getElementById("trial").innerHTML = h;
Try it

Converting Numbers to Strings:

The toString() method is used to convert a number to its string equivalent. This method accepts an integer parameter optionally in the range 2 through 36 specifying the base to use for representing numeric values.
The following example shows the number to string conversion.

Example:

var a = 456;
document.getElementById("trial").innerHTML =
a.toString() + "<br>" +
(456).toString() + "<br>" +
(400 + 56).toString();
Try it

Formatting Numbers in Exponential Notation:

The toExponential() method is used to format or represent a number in exponential notation. The toExponential() method optionally accepts an integer parameter specifying the number of digits after the decimal point. Also, the returned value is a string, not a number.

Example:

var a = 12.3456;
document.getElementById("trial").innerHTML =
a.toExponential() + "<br>" +
a.toExponential(6) + "<br>" +
a.toExponential(4) + "<br>" +
a.toExponential(2);
Try it
Note: Exponential notation is used to represent the numbers that are either very large or very small in magnitude. For example, 12300000000 can be written as 123e+8 or 1.23e+10.

Formatting Numbers to Fixed Decimals:

The toFixed() method is used when you want to format a number with a fixed number of digits to the right of the decimal point. The value returned by toFixed() method is a string and it has exactly specified the number of digits after the decimal point. If the digits parameter is not specified then it is treated as 0.

Example:

var a = 6.789;
document.getElementById("trial").innerHTML =
a.toFixed(6) + "<br>" +
a.toFixed(4) + "<br>" +
a.toFixed(2) + "<br>" +
a.toFixed(0);
Try it

Formatting Numbers with Precision:

The toPrecision() method is used when you want the most appropriate form of a number. The toPrecision() method is used to return a string representing the number to the specified precision.

Example:

var a = 6.789;
document.getElementById("trial").innerHTML =
a.toPrecision() + "<br>" +
a.toPrecision(6) + "<br>" +
a.toPrecision(4) + "<br>" +
a.toPrecision(2);
Try it

Finding the Largest and Smallest Possible Numbers:

The Number.MAX_VALUE and Number.MIN_VALUE properties of the number object are used to represent the largest and smallest (closest to zero, not most negative) possible positive numbers that JavaScript can handle.

Example:

var a = Number.MIN_VALUE;
document.getElementById("trial1").innerHTML = a;
var b = Number.MAX_VALUE;
document.getElementById("trial2").innerHTML = b;
Try it

Finding Positive and Negative Infinity:

The Number.POSITIVE_INFINITY or Number.NEGATIVE_INFINITY method is used to represent a number that falls outside of the range of possible numbers.

Example:

var a = Number.POSITIVE_INFINITY;
document.getElementById("trial1").innerHTML = a;
var b = Number.NEGATIVE_INFINITY;
document.getElementById("trial2").innerHTML = b;
Try it

Post navigation

JavaScript Strings

Ask a Question Cancel reply

Your email address will not be published. Required fields are marked *

W3 CODING SCHOOLS © Copyright 2019-20
Privacy policy   Terms of use

We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.Ok