Как в js заменить множество this.varible=variable в конструкторе объектов?

Question

[Степан Турченко]

Например если есть множество классов таких как

class User {
  constructor(id, name, comments, avatar) {
    this.id = id;
    //this.name.....
  }
}

Как заменить эту длинную конструкцию из this.x=x;.
Тем более если имеется до 20 классов.

Comments

[Kovalsky]

А что конкретно вы хотите, сэкономить символы? Можете например кидать в конструктор объект с данными вместо кучи аргументов, потом из этого объекта данные раскладывать в свойства экземпляра. А можно просто сохранять в экземпляре весь объект.

[Денис Дерепко]

https://developer.mozilla.org/ru/docs/Web/JavaScri... ?

[RAX7]

class User {
  constructor(props) {
    Object.assign(this, props);
  }
}
const user = new User({ id: 42, name: 'John', comments: 1, avatar: 'cat.jpg' });

[Alex]

RAX7, Object.assign весьма мало надежен как по мне.

• Вы легко можете не положить что-то.
  
• Вы можете положить лишнюю информацию
  
• Клиентский код может переопределить поведение методов класса
  

[RAX7]

Alex,

class User {
  constructor(props) {
    const { id = 0, name = 'noname', comments = 0, avatar = 'default.jpg' } = props;
    Object.assign(this, { id, name, comments, avatar });
  }
}
const user = new User({ id: 42, name: 'John', comments: 1, avatar: 'cat.jpg'});

такой вариант избавит от первых 2х недостатков, хотя от этого запись только длиннее получается ¯\_(ツ)_/¯

Answer 1

[Дима Паутов]

class User{
	constructor(data) {
		Object.assign(this, data)
	}
}

new User({ 
id: 1, 
name: 'Вася', 
comments: [], 
avatar: null 
})

Но делать так не нужно, ваш класс сразу же становится не читаемым и сложно понимаемым. Т.к. явно не видно тех свойств, которые в нём могут быть и которые там явно должны быть. В итоге придётся по всей кодовой базе искать возможные передаваемые параметры.

А так же, в конструктор запишутся все свойства, которые будут переданы, даже те, которые вы не собираетесь использовать.

P.S. Да хоть у вас 100500 классов, зато зайдя в каждый сразу становится понятно, с какими входными данными он работает. Через пару тройку недель вы сами забудете, какие параметры нужно в каждый из классов передавать, ну и другие разрабы вас по головке за такое сокращение не погладят

Answer 2

[Alex]

Вот несколько вариантов:

class User {
  constructor( id, name, comments, avatar ) {
    Object.assign(this, { id, name, comments, avatar });
  }
}
const user = new User(42, 'John', 1, 'cat.jpg');

Чуть более читаемо

class User {
  constructor({ id, name, comments, avatar } ) {
    Object.assign(this, { id, name, comments, avatar });
  }
}
const user = new User({ id: 42, name: 'John', comments: 1, avatar: 'cat.jpg'});

Но изначальный вариант, только без огромного числа аргументов, на мой взгляд лучше.

class User {
  constructor({id, name, comments}) {
    this.id = id
    this.name = name
    this.comments = comments
  }
}

1. Он более наглядный для разработчика.
   
2. Он проще для рефакторинга и отладки.
   
3. Он намного понятнее для вашей IDE. Не каждая IDE умеет корректно обрабатывать Object.assign чтобы выдавать вам контекстные подсказки.
   

Answer 3

[Мира Рузвельт]

https://learn.javascript.ru/rest-parameters-spread...

class User {
  constructor(...args) {
    args.forEach(elem => this[elem] = elem)
  }

  get(blabla) {
    return this[blabla];
  }
}

let a;
let b;
let c;

let obj; {
  a = 0;
  b = "+";
  c = "gvfbd";
  obj = new User(a, b, c);
}

console.log(obj[a])
console.log(obj.get(a))

Answer 4

[casoer]

Я знаю 2 вариант
1. Оооооооооочень костыльно, но можешь хранить аргументы в каком-то объекте и серез call/aply вызывать методы(не рекомендую делать, это очень сильный говнокод)
2. Используй Typescript
Другие извесные мне методы занимают ещё больше времени для написания

Comments

[Alex]

А чем использование Typescript тут поможет?

[casoer]

Alex,
class User { constructor(public id, public name, pulbic comments, public avatar) {} }
При компиляции в js этот код превратится в
"use strict";
class User {
constructor(id, name, comments, avatar) {
this.id = id;
this.name = name;
this.comments = comments;
this.avatar = avatar;
}
}