ecmascript 6 - Difference between Static function declaration and the normal function declaration in Javascript? - Stack Overflo

admin管理员组

文章数量:1303374

There are many ways one can declare a function in javascript. One of the ways is declaring a class and a static function inside is as showed below.

class className {
 static fucntionName() {
 }
}

another way of is declaring is through the tradition javascript style as showed below.

function functionName() {
}

I would like to know the advantages/disadvantages of using either of the cases. Is there any specific use cases for the static methods, why declare a class(we know that in javascript there is no need to instantiate the class in order to access the static function). Why not just use the traditional way (the second case in the above example) of function declaration in all/any use case?

I would like to understand this is in detail.

There are many ways one can declare a function in javascript. One of the ways is declaring a class and a static function inside is as showed below.

class className {
 static fucntionName() {
 }
}

another way of is declaring is through the tradition javascript style as showed below.

function functionName() {
}

I would like to know the advantages/disadvantages of using either of the cases. Is there any specific use cases for the static methods, why declare a class(we know that in javascript there is no need to instantiate the class in order to access the static function). Why not just use the traditional way (the second case in the above example) of function declaration in all/any use case?

I would like to understand this is in detail.

• javascript
• ecmascript-6
• frontend
• static-methods
• es6-class

Share Improve this question Follow edited Nov 18, 2020 at 12:57 Rahul asked Aug 9, 2017 at 14:57 RahulRahul 73222 gold badges99 silver badges2626 bronze badges 5

• 1 Static method calls are made directly on the class and are not callable on instances of the class. Static methods are often used to create utility functions. On the other hand, the export statement is used to export functions, objects or primitives from a given file (or module). These two statements serve different purposes and are not synonymous. When a function is part of a class in OO programming it is referred to as a method: learn more about static methods in js – Tom O. Commented Aug 9, 2017 at 15:02
• Having a class only with static methods is not the right application of classes. – Felix Kling Commented Aug 9, 2017 at 19:23
• @FelixKling I do not see a problem in that. And is also pretty much good practise according to many sources. – Rahul Commented Aug 10, 2017 at 9:18
• No, it makes no sense at all. Can you link to some of these sources? If you just need a collection of functions, create an object with those functions, or now with modules, export the functions from the module. Don't abuse classes as bags for functions. – Felix Kling Commented Aug 10, 2017 at 16:51
• Have look at the example code on the static documentation (developer.mozilla/en-US/docs/Web/JavaScript/Reference/…) . Its shows classes with just static functions. I just meant in this way. – Rahul Commented Aug 11, 2017 at 9:53

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

A static method is callable from the class itself, as you already know.

A non-static method is callable from an instance of the class, so you basically have to create an object before being able to access that method.

For example, for a addNumbers(var a, var b) which does return a+b, is it really necessary to waste memory instantiating an object of the class just to add those 2 numbers? No, you just need the result and that's the whole point of having static.

Using the first style allows you to group methods in a particular class (think of something like namespaces). Maybe you can define classes like Math and String, which both have the add method but implemented in a different way. Calling add() by itself would be confusing, but Math.add() and String.add() are not.

The export style, on the other way, does a pletely different thing. It allows you to use functions from another module.

Think about this:

first_module.js

function cube(var x) {
    return x * x * x;
}

second_module.js

import { cube } from 'first_module'; // <-- ERROR
alert( cube(3) ); // <-- Undefined function

But, if you declare first_module this way:

export function cube(var x) {
    return x * x * x;
}

Then second_module will work fine.

I would like to know the advantages/disadvantages of using either of the cases.

apples and oranges. A class doesn't have to be exported and a module doesn't have to be a class. They are not the same thing, although the exported module can be a class.

Is there any specific use cases for the static methods

When you want a class to provide some functionality, but this aint' something that is specific to a single instance of that class. Like var c = Point.interpolate(a, b, .5);
The static interpolate function doesn't belong to any of the points it's operating on. It's more appropriate to define this function static on the class that provides this functionality (interpolating points).

we know that in javascript there is no need to instantiate the class in order to access the static function

That's the very definition of a static function that you don't have to instantiate the class to call it. That's not something JS specific.

Why not just use the traditional way (the second case in the above example) of function declaration in all/any use case

Because as I started, a class and a module ain't necessarily the same thing. And it is nicer/cleaner to write

class Foo{
    ...
    static fn(){...}
}

than

class Foo {
    ...
}

Foo.fn = function(){...};

Although in the end, both is just little more than

function Foo(){...}
Foo.fn = function(){};
// + Foo.prototype stuff

But the class syntax is cleaner. Simpler to read and to understand, even if you're just scanning over this piece of code.

What is a static function?

Declaring a static function within a class creates a class level function that is not callable by instances of that function. An example of this is the Object.assign function. Static functions are often used to build functions that operate on instances of the type on which it is defined.

A static method can only be called within the class and is useful for utility functions, like say, massaging the parameter variables that are ing in, or setting up constants, (or Object.assign mentioned previous) when that must be done every time, before passing on to an instantiation of the class, to avoid unnecessary use of memory as a previous mentator noted.

Once everything is cleaned up, you can export the rest of your function for instantiation elsewhere in your code, where arguments will be cleaned up/constants set, again and again each time you use the class, and your instantiation can focus on the dynamic stuff.

本文标签：