Создать объект на основе массива?

Question

[Богдан]

Здравствуйте. Есть массив, нужно его значения сделать ключами и добавить в значения другой обьект. Вот работающий пример, может здесь можно как-то оптимальне все написать? Спасибо

const arr = [1,2,3];
const objVal = { current: 0, deffault: 1 };

const result = { };
arr.forEach( v => Object.assign(result, { [v]: objVal } ) );

console.log(result);
// { '1': { current: 0, deffault: 1 },
//  '2': { current: 0, deffault: 1 },
//  '3': { current: 0, deffault: 1 } }

Answer 1

[Сергей Соколов]

Суть также, без цикла не обойтись:

const arr = [1,2,3];
const objVal = { current: 0, deffault: 1 };

const result = arr.reduce((p,c) => {p[c] = objVal; return p;}, {});
// {"1":{"current":0,"deffault":1},"2":{"current":0,"deffault":1},"3":{"current":0,"deffault":1}}

Comments

[Богдан]

Немножно отрефакторил его

const result = arr.reduce( ( p, c ) => Object.assign( p, { [c]: { current: 0, default: 1 } } ), { } );

Answer 2

[dummyman]

Конечно, можно написать оптимальнее.
Есть одно негласное правило JS:

Определяй структуру объекта в конструкторе и никогда не меняй после!

Еще хуже добавлять объекту свойства в цикле.

Так будет точно правильнее

function AObj(arr){
    arr.forEach( v => Object.assign(this, { [v]: objVal } ) );
}
var aObj = new AObj([1,2,3]);

Comments

[Богдан]

Сенкс, не знал о таком приеме. Вот уже сразу его отрефакторил, под свой стиль минимализма )))

const objVal = { current: 0, deffault: 1 };
const arrKey = [1,2,3];

const aObj = new function(arr, obj) {
  arr.forEach( v => Object.assign(this, { [v]: obj } ) );
}(arrKey, objVal);

А хотел спросить, у менять вот есть такой код, как тут лучше всего реализовать. У меня объект objMenuRequirementProducts должен создаваться при загрузки страницы, которую я определяю по главном элементе. Если я его объявлю в событие onLoad, я потеряю глобальный контекст на эту переменную и использование ее в других модулях?

let objMenuRequirementProducts = undefined;

$( document ).on( 'turbolinks:load', ( ) => {
  const elemMenuRequirementProducts = $( '#menu_requirement_products_new' );

  if ( elemMenuRequirementProducts.length ) {
    objMenuRequirementProducts = new MenuRequirementProducts( elemMenuRequirementProducts );
  }
} );

[dummyman]

Богдан:

я потеряю глобальный контекст на эту переменную и использование ее в других модулях?

Вообще, не потеряете. Во-первых, локально в функции вы ее (переменную objMenuRequirementProducts) не перегрузили. Во-вторых контекст (он же this) в обоих местах будет window, так как array function (=>) сохраняет контекст того места где она определена.

Вот мне только непонятно что означает new в коде new function(arr, obj) { /*...*/ }

[Богдан]

У бек реализованный на Ruby и при Ajax который возвращает скрипт, и скрипт не видит переменную которая внутри события document - > load
вот сообственно сам скрипт

function( ) {
  objMenuRequirementProducts.colPr.empty( );
} ).call( this );

а вот и ошибка

VM149:2 Uncaught ReferenceError: objMenuRequirementProducts is not defined

*****

new function() { … } - Так делают, когда хотят создать единственный объект данного типа. Вот собственно сама статья на learn.javascript.ru

[dummyman]

Богдан: Ну все зависит от определения.
Попробуйте сделать, например, так.
В функции обращаться ко всем внешним данным через this.
function(){ this.objMenuRequirementProducts ... }
Глобальные переменные определите свойством window.
window.objMenuRequirementProducts={};
А вызывайте функцию через метод .call(window).
fn.call(window);

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

Вот попробовал прислать аяксом "return window"

var w = new Function(body);
w(); // => возвращает объект window

[dummyman]

Богдан:
Повторил с глобальным объектом
var test={t:123}

var t = new Function(body); // body="return test.t"
t(); //=> 123

[Богдан]

а Вы объект тест оберните в функцию и все не так уже будет весело

function fakeLoad() {
  var test = {t:123};
  console.log('onload %s', test.t);
}(this);

var t = new Function("return test.t");
t(); //=> 123

[dummyman]

Богдан: дык логично же, вы объявляете локальную переменную, она будет работать только внутри фунции.