JavaScript: Exponentiation Operator

◄Page 25►

Exponentiation Operator

Introduction

Apply the ECMAScript 2016 exponentiation operator (**) to calculate operations with a base and exponent.

The exponentiation operator raises one number to the power of another number. The exponentiation operator can replace method Math.pow() with slightly shorter, more concise JavaScript.

Examples demonstrate applying either ** or Math.pow(x,y), to calculate the same result. You may also read the source code and see the HTML markup.

Expressions

3 equals the base and 5 equals the exponent in the following expression.

You might also say raise three to the fifth power, in the following expression.

Examples

You can use the exponentiation operator with literal numbers as follows.

Consider applying the exponentiation operator with variables as follows.

var x = 3;
var y = 2;
var z = x ** y;

Tap a Box for Exponentiation **

var x = 3;
var y = 2;
var z = x ** y;

var x = 2;
var y = 5;
var z = x ** y;

Tap a Box for Math.pow()

The following examples accomplish the same calculation. Code's a little longer and syntax's a little older with Math.pow(base,exponent).

var x = 3;
var y = 2;
var z = Math.pow(x,y);

var x = 2;
var y = 5;
var z = Math.pow(x,y);

HTML Markup

The following markup applies to boxes above, which calculate exponentiation with the exponentiation operator, **.

<div 
class="box rd" 
onclick="fExp(2,5,'xy25')"
>
<div class="bld">2<sup>5</sup></div>
<pre>
var x = 2;
var y = 5;
var z = x ** y;
</pre>
<div id="xy25" class="bld">POWER</div>
</div>

The following markup applies to boxes above, which calculate exponentiation with Math.pow().

<div 
class="box gn" 
onclick="fPow(2,5,'xyp25')"
>
<div class="bld">2<sup>5</sup></div>
<pre>
var x = 2;
var y = 5;
var z = Math.pow(x,y);
</pre>
<div id="xyp25" class="bld">POWER</div>
</div>

JavaScript Source Code

The following short JavaScript file, exponent.js, calculates and displays exponentiation with the operator ** and the method Math.pow().

const S_EXP = " ** ";
const S_EQ  = " = ";
const S_POWER = " to the power of "

/***
 * Given the 
 * @param sId: String ID
 * of HTML element.
 * @return e: HTML element.
 */
function getElement(sId){
let e = document.getElementById(
sId
);
return e;
}

/***
 * Display result of
 * nBase ** nExp.
 * @param nBase: Base number
 * @param nExp:  Exponent number
 * @param sId :  String ID of
 * HTML element for display
 * of result.
 */
function fExp(nBase,nExp,sId){
let e = getElement(sId);
let z = nBase ** nExp;
e.innerHTML = nBase + S_POWER + nExp + S_EQ + z;
}

/***
 * Display result of
 * Math.pow(nBase,nExp).
 * @param nBase: Base number
 * @param nExp:  Exponent number
 * @param sId :  String ID of
 * HTML element for display
 * of result.
 */
function fPow(nBase,nExp,sId){
let e = getElement(sId);
let z = Math.pow(nBase,nExp);
e.innerHTML = nBase + S_POWER + nExp + S_EQ + z;
}

Summary

You learned to apply the ECMAScript 2016 exponentiation operator (**) for calculations with a base and exponent.

The exponentiation operator raises one number to the power of another number. The exponentiation operator can replace method Math.pow() with slightly shorter, more concise JavaScript.

Examples demonstrated applying either ** or Math.pow(x,y), to calculate the same result. You also read the source code and saw the HTML markup.

Learn JavaScript

JavaScript's the foundation of Web developer and Website design skills. This free and unique JavaScript tutorial includes some new or seldom used, but useful features.

Tags