QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads JavaScript “…” Operator

JavaScript “…” Operator

This post is a part 5 of ECMAScript 6 Complete Tutorial post series.

ES6 introduced “…” operator which is also called as spread operator. When “…” operator is applied on an array it expands the array into multiple variables in syntax wise. And when its applied to an function argument it makes the function argument behave like array of arguments.

We can use spread operator to take indefinite number of arguments.

Here is an example code of how to use this operator

//args variable is an array holding the passed function arguments
function function_one(...args)
{  
    console.log(args);
    console.log(args.length);
}

function_one(1, 4);
function_one(1, 4, 7);
function_one(1, 4, 7, 0);


function function_two(a, b, ...args)
{
    console.log(args);
    console.log(args.length);
}

//"args" holds only 7 and 9
function_two(1, 5, 7, 9);

Before ES6 introduced “…” operator developers used Array.prototype.slice.call to retrieve the extra passed arguments.

Here is an example code:

//args variable is an array holding the function arguments
function function_one()
{  
    var args = Array.prototype.slice.call(arguments, function_one.length);

    console.log(args);
    console.log(args.length);
}

function_one(1, 4);
function_one(1, 4, 7);
function_one(1, 4, 7, 0);


function function_two(a, b)
{
    var args = Array.prototype.slice.call(arguments, function_two.length);

    console.log(args);
    console.log(args.length);
}

//"args" holds only 7 and 9
function_two(1, 5, 7, 9);

If we apply “…” to an array it expands it into multiple variables syntax wise. Here is an example code

function function_name(a, b)
{
    console.log(a+b);
}

var array = [1, 4];

function_name(...array); //is equal to function_name(1, 4)
Feb 14, 2015Narayan Prusty
Default Function Arguments Values in JavaScriptIntegrate Google Analytics in Intel XDK APP
Comments: 2
  1. thebigd
    5 years ago

    Hey Narayan, the next link in the series should be: http://qnimate.com/python-like-multiline-strings-in-javascript/ but it is pointing to integrating Google Analytics series :)

    ReplyCancel
  2. rajasekar
    5 years ago

    thanks for you …..wonderfull
    above three function are same but different way….keep it up bro

    ReplyCancel

Leave a Reply Cancel reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

7 years ago 2 Comments Web Development
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
Related Articles
  • JavaScript Function Return Multiple Values
  • Default Function Arguments Values in JavaScript
  • JavaScript “for of” Loop Tutorial
  • How to Store Arrays in HTML5 localStorage
  • Passing Arguments To JavaScript Files
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license