0

Basically this is the function

function some() {
    console.log('some');
}

that i want to set inside this object

class MyClass {
  constructor(name) {
    this.name = name;
  }
  some() {
      }
}

How can I attach it without repeating the code inside the function?

coder
  • 25
  • 4
  • `some() { }` -> `some = some` but it's probably better to add it to the prototype: `MyClass.prototype.some = some;` – VLAZ May 17 '21 at 08:23

3 Answers3

1

Basically, you can do it in three ways;

the first way is by using class constructor and passing function in the constructor call

function some() {
    console.log('some');
}


class MyClass {
  constructor(name, some) {
    this.name = name;
    this.some = some
  }
  
}
const myClass = new MyClass("name",some);
myClass.some();

second way is by simply using equal operator

function some() {
    console.log('some');
}


class MyClass {
  constructor(name,some)  {
    this.name = name;
  }
  some = some
  
}


const myClass =  new MyClass("some");
myClass.some();

Third way is by using prototype

function some() {
    console.log('something');
}


class MyClass {
  constructor(name,some) {
    this.name = name;
  }
  
}

MyClass.prototype.some = some;

const myClass =  new MyClass("some");
myClass.some();
0
  1. The some method is passed as a parameter to the constructor
function some() {
    console.log('some');
}

class MyClass {
  constructor(name, some) {
    this.name = name;
    this.some = some
  }
}
  1. Build a Common class
class Common {
  some() {
    console.log('some');
  }
}

class MyClass extends Common {
  constructor(name) {
    this.name = name;
  }
}

Yu Miao
  • 322
  • 1
  • 6
0

Execute the function

The most basic way of re-using the function as a method is to just define a method and execute the function. You can do

some() {
    some()
}

However, here is a better way:

function some() {
  console.log('some');
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
  some() {
    return some.call(this, ...arguments);
    //alternatively:
    //return some.apply(this, arguments);
  }
}

const x = new MyClass("foo");
x.some();

This will ensure that you don not need to change the call if the some() function is changed to accept parameters or to use this or to return a value, etc. Changes to the function will not result in changes to the method.

function some(someParameter1, someParameter2) {
  console.log('some', someParameter1, someParameter2);
  return this.name + " says: " + someParameter1 + " " + someParameter2 + "!";
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
  some() {
    return some.call(this, ...arguments);
    //alternatively
    //return some.apply(this, arguments);
  }
}

const x = new MyClass("foo");
console.log(x.some("hello", "world"));

The .call() and .apply() calls are equivalent here. See:
What is the difference between call and apply?

Attach as instance property

Instead of defining a method that calls a function, you can directly attach the function as a method. Then it is going to be equivalent to defining the same property on each instance:

function some() {
  console.log('some');
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
  some = some
}

const x = new MyClass("foo");
x.some();

Or:

function some() {
  console.log('some');
}

class MyClass {
  constructor(name) {
    this.name = name;
    this.some = some
  }
}

const x = new MyClass("foo");
x.some();

It still works if the function some() is changed without requiring and alteration to MyClass:

function some(someParameter1, someParameter2) {
  console.log('some', someParameter1, someParameter2);
  return this.name + " says: " + someParameter1 + " " + someParameter2 + "!";
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
  some = some
}

const x = new MyClass("foo");
console.log(x.some("hello", "world"));

Or:

function some(someParameter1, someParameter2) {
  console.log('some', someParameter1, someParameter2);
  return this.name + " says: " + someParameter1 + " " + someParameter2 + "!";
}

class MyClass {
  constructor(name) {
    this.name = name;
    this.some = some
  }
}

const x = new MyClass("foo");
console.log(x.some("hello", "world"));

Again, whether you attach it in the constructor or the body, you get the same behaviour. See:
JavaScript class property inside vs outside constructor

Attach to prototype

This is essentially the same as the above. But instead of each instance having the property, it is added to the prototype, so all instances share it, instead of each instance having a separate property.

MyClass.prototype.some = some;

See:
Use of 'prototype' vs. 'this' in JavaScript?

This works almost as if the function is actually defines using method syntax because in both cases the method is defined on the prototype:

class MyClass {
  some() {
    console.log('some');
  }
}

console.log(MyClass.prototype.hasOwnProperty("some"));

The prototype approach is probably be the most idiomatic in JavaScript:

function some() {
  console.log('some');
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
}

MyClass.prototype.some = some;

const x = new MyClass("foo");
x.some();

The function some() can still vary independently of the class:

function some(someParameter1, someParameter2) {
  console.log('some', someParameter1, someParameter2);
  return this.name + " says: " + someParameter1 + " " + someParameter2 + "!";
}

class MyClass {
  constructor(name) {
    this.name = name;
  }
}

MyClass.prototype.some = some;

const x = new MyClass("foo");
console.log(x.some("hello", "world"));
VLAZ
  • 18,437
  • 8
  • 35
  • 54