Home / Questions / 57577
Accepted
Lorthas
Asked: 2020-03-24 14:26:17 +0800 CST 2020-03-24 14:26:17 +0800 CST

Static methods and variables in Javascript ES5 (without using "class") without instantiating objects?

  • 772

Good. She thought she understood it but I don't quite understand it. He wanted to more or less replicate a static Java variable or method, that without having to instantiate an object he could use static methods.

I have several problems:

If I do it like this:

const Obj = (function() {
     let _obj = function() {}           
     _obj.prototype.alertar = function(){
         alert("Hola mundo");
     }
     return _obj;
});

It is a method that is shared with all instances but you would have to instantiate the object to be able to use it as I have tested.

const o1 = new Obj();
o1.alertar();

If I do it another way:

const Obj = (function() {

    let _obj = function() {}
        _obj.alertar = function(){alert("Hola mundo");};
        return _obj;
})();

const o1 = new Obj();
Obj.alertar();
console.dir(Obj);

It would be the closest thing to Java, right? I don't need to create an instance and the method wouldn't be inherited to children, right?

Apart from being interested in a method or variable that cannot be overridden, without affecting other variables and methods, could I use Object.defineProperty() to make variables and methods static that cannot be overloaded without having to use Object.freeze( ), Object.seal() or Object.preventExtensions()?

I know Ecmascript6 is being used but I use the old syntax to create objects without "class" because it helps me better understand how the language works. In addition, according to what I read, the new syntax is nothing more than a mask that basically does the same thing as the old syntax and it does not seem that certain things can be done.

variables

2 Answers

  1. Best Answer

    I wanted to more or less replicate a Java static variable or method

    Don't try to program in one language as if it were another , instead learn how the new language works and follow suit. Why do you want to use JavaScript to make it look like Java? Just don't do it.

    The concept of static property or method in Java means that said property or method does not depend on an instance, but on the class itself . What is meant by this? Well, it's a bit complex, in Java there are so-called Class loaders which are responsible for loading the classes and registering them when the JVM is started. If you define a static property or method, this is also loaded, this does not happen with instance variables and methods, since only their signature is loaded.

    In JavaScript it does not exist in concept of classes

    In fact you are thinking that this is false since in ES6 it appeared class, but this does not work as new people think. Although you create "classes" with class you are creating functions with their respective prototype. This is just syntax, it has no impact.

    However, you can *emulate static variables and methods** by Object.defineProperty:

    function User () {
  
}

Object.defineProperty(User, 'age', {
  enumerable: true,
  configurable: true,
  writable: true,
  value: 23
});

Object.defineProperty(User, 'getInfo', {
  enumerable: true,
  configurable: true,
  writable: true,
  value: function () {
    return 'Hola, tengo ' + User.age + ' años';
  }
});

console.log(User.getInfo());

    As you can see, now ageand getInfoare attached to the User.

    It would be the closest thing to Java, right? I don't need to create an instance and the method wouldn't be inherited to children, right?

    What you do is called a Factory function and it is widely used to create objects that have private properties and to use aggregation instead of inheritance. But actually, there is not much difference, the difference is that using a constructor function ( new) you add a context ( this) to the instance, other than that, both are creating objects.

    function CreateBall (props) {
  let stub = { color, weight } = props;
  
  return {
    color: stub.color,
    weight: stub.weight,
    changeColor (color) {
      stub.color = color;
    },
    changeWeight (weight) {
      stub.weight = weight;
    },
    info () {
      console.log(stub.color, stub.weight);
    }
  };
}

const myBall = new CreateBall({
  color: 'blue',
  weight: 5
});

// encapsulamiento
myBall.color = 'red';
myBall.weight = 7;
myBall.info();

myBall.changeColor('red');
myBall.changeWeight(7);
myBall.info();

    Besides if I was interested in a method or variable that could not be overridden, without affecting other variables and methods, could I use it Object.definePropertyto make variables and methods static that could not be overloaded without having to use Object.freeze, Object.sealor Object.preventExtensions?

    The advantage of Object.definePropertyis that it gives you more flexibility: you can make it readonly, not make it enumerable, etc. On the other hand, Object.freeze it prevents you from adding new properties to an object, deleting or editing existing ones . It is as if you put a padlock on it; useful in cases where you don't want them to edit an object, for example, for security, etc.

    The method Object.sealdoes something similar: it prevents you from adding new properties and from changing the configuration of existing ones , but properties can be changed.

    The method Object.preventExtensions prevents new properties from being added as your own, but you can add properties directly to your prototype.

    • 2

  2. After Gustavo's answer, what is added is going to be inconsequential, but the following is a humble complement.

    Strictly in ES5, without let or const, a static method or property was considered to be one that was attached directly to the object and not to its prototype.

    var Miclase = function  (options) {
    this.options = options;
};

Miclase.prototype.getOptions = function () {
    return this.options; 
};

Miclase.metodoEstatico = function (a, b) {
    return a + b;
};

    The static method can be called without instantiating the class, but it does not have access to the context of the this. This is quite similar to the methods of a PHP class, although resembling PHP is not as well regarded at present.

    • 1