DEV Community

Cover image for The '...' operator and common uses - Ellipsis or the yada yada yada operator
Kairus Noah Tecson
Kairus Noah Tecson

Posted on • Updated on

The '...' operator and common uses - Ellipsis or the yada yada yada operator

Yada yada yada meme

You may have encountered this '…' syntax in some code or in a Youtube tutorial and just don't know how this small three dot syntax is important in executing the code properly.

Missing one dot and there does the red line beneath it…

That three dot you might be encountering is an Ellipsis operator. Other name for it is the 'triple dot' operator or the 'yada yada yada' operator. You might see this a lot even in different programming languages.

You might even question if this is just some naming convention or some placeholder. Might be true, but this operator comes in a lot more different functionalities which might depend on the programming language and the context it has been used.

But today we will be showing and explain some common uses of this operator for you to use in your coding arsenal.

1. Rest Parameter

In Javascript, the ellipsis can be used to represent a rest parameter, which allows a function to accept an arbitrary number of arguments as an array. As an example

function myFunction(...args) {
  console.log(args); // Output: [1, 2, 3, 4, 5]
}

myFunction(1, 2, 3, 4, 5);
Enter fullscreen mode Exit fullscreen mode

This take on the argument (1, 2, 3, 4, 5) and store it inside the args parameter which is declared as an array. In short, you're stating that the parameter is an array with the use of the ellipsis operator. Even if you passed in an argument of one element, the result will still be inside an array.

2. Spread Syntax

This is applied again in Javascript but in different context. The ellipsis operator can be used to spread elements of an array/object into a new array/object. For example.

const arr = [1,2,3] 
const newObject = [...arr, 2, 4]
console.log(newObject)   
// output = [1, 2, 3, 2, 4]
Enter fullscreen mode Exit fullscreen mode

Note that you can only store this the result of the ellipsis operator inside another object/array.

const arr = [1,2,3]
const string = ...arr
Enter fullscreen mode Exit fullscreen mode

If you store this spread array other than object/array, this will result to an error.

const arr = [1,2,3]
const string = [...arr]
Enter fullscreen mode Exit fullscreen mode

This is the correct way for this which will result as an object type.

console.log(typeof(string)) -> object

3. Variadic Templates

Let's go outside and Javascript and go for more low level language, C++. The ellipsis in C++ can be used to define a variadic template. This variadic template, which is a feature in C++, allows a function/class to accept a arbitrary number of arguments of different types. For example:

template<typename... Args>

void print(Args... args) {
    ((cout << args << " "), ...);
}
void main() {
    print(1, 2, "hello world", true)
    // return -> 1 2 hello world 1
    // true = 1
}
Enter fullscreen mode Exit fullscreen mode

This is like in the number 1, Rest Parameters, which is in Javascript but in more complex way because it can take different data types as an argument and can be output one by one using again the ellipsis operator with the syntax of ((args), ...);
This makes C++ a more lot flexible through having dynamic size of memory being allocated.

4. Placeholder for unused parameters

Lastly in Python, the ellipsis can be used as a placeholder for unused function or method parameters. For example:

def sample(a, b, x):
    print(a + b)
sample(1, 2, ...)
Enter fullscreen mode Exit fullscreen mode

This can be placed as an argument for any parameter only if it is not used within the function. This can be useful if you don't have certain value to put for the parameter and you just wanted to execute and test out the function.

Conclusion

There can be a lot more different functionalities of ellipsis mostly in other programming languages. This is just for some most common uses of the operator in commonly used programming languages. But there you go, you can now use this operator in your arsenal. This is incredibly useful in terms of handling database query responses.

Top comments (0)