JavaScript отправить предупреждение, чтобы подсказать и отредактировать массив?

Question

//global variable
var memArray  =[];

//object    
function member(id, password){

  this.id          = id; 
  this.pwd         = password
  }
  var memObj1=new member("m001","123");
  memArray.push(memObj1);

Как отправить предупреждение, чтобы подсказать и отредактировать каждый объект pu sh в memArray?

Answer 1

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

var memArray = [];


//object    
function member(id, password) {

  this.id = id;
  this.pwd = password
}
var memObj1 = new member("m001", "123");
var memObj2 = new member("m002", "123");
var memObj3 = new member("m031", "123");
memArray.push(memObj1);
memArray.push(memObj2);
memArray.push(memObj3);
memArray.forEach((val, ind) => {
  memArray[ind] = JSON.parse(window.prompt("want to edit values?", JSON.stringify(memArray[ind])));
});

console.log(memArray)

Answer 2

Ответ Павана хорош, но чтобы сделать это тестируемым в автоматических тестах:

// I would name these fields in your API 
// by making the constructor take an object.
// Capitalise the name to signal that it can be newed    
function Member({id, password}) {
  this.id = id;
  this.pwd = password
}

// Name the array for what it is
const members = [ 
  new Member({id: "m001", password: "123"}),
  new Member({id: "m002", password: "123"}),
  new Member({id: "m031", password: "123"})
]

const editInBrowserFn = member => JSON.parse(window.prompt("want to edit values?", JSON.stringify(member)));

const updateMembers = editFn => array => array.map(editFn)

// To get an update
const updatedMembers = updateMembers(editInBrowserFn)(members)

console.log(updatedMembers)

// You can now test it by making an testing editFn that doesn't need user interaction

const testEditFn = m => new Member({id: m.id, password: 'test'})

const testMembers = updateMembers(testEditFn)(members)
console.log(testMembers)

Подробную информацию об этом подходе см. В этой статье .

Чтобы сделать это таким образом, вам потребуется вытащите это из глобальной области видимости. Это хорошая дисциплина для развития. В качестве первого шага вы можете сделать объект в глобальной области видимости, содержащий последний список членов:

const Members = (() => {
   let _members = []
   return {
      setMembers: members => _members = [...members],
      getMembers: () => [..._members]
   }
})()

Теперь способ обновления членов выглядит следующим образом:

const updateFn = updateMembers(editInBrowser)

function updatePasswords() {
   const members = Members.getMembers()
   Members.setMembers(updateFn(members))
}

Ничто не может теперь случайно удалите или измените массив членов, чтобы исключить площадь поверхности ошибки.

Так устроен React setState. Он вдохновлен идеями функционального программирования и неизменностью.

Возможно, вы захотите обновить только один элемент, поэтому:

const Members = (() => {
   let _members = []
   return {
      setMembers: members => _members = [...members],
      getMembers: () => [..._members],
      updateMember: updated => 
         this.members = _members.map(m =>
            m.id === updated.id ? updated : m)
   }
})()

Теперь все ваши изменения массива находятся в одном месте, и Вы только должны сделать это без ошибок там. В противном случае ваше глобальное состояние будет открыто, и вам придется исправлять ошибки везде, где это связано. Без этого все ваши вызывающие функции несут ответственность за правильное управление глобальным состоянием приложения. Комплекс.

Кристаллизуйте сложность в одном месте.

Я написал статью и полную реализацию магазина (в 40 строках кода) здесь .

Answer 3

Насколько я понимаю, оповещения - это всего лишь модели в браузере, которые предоставляют информативную обратную связь конкретному пользователю о его действиях. Поэтому я думаю, что для редактирования объектов в memArray необходимо использовать либо диалоговую модель, либо форму.