ЯШ: Можно ли сделать часть переменной зависимой от параметра функции?

Question

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

var post1title = "example title 1";
var post1text = "example text 1";
var post2title = "example title 2";
var post2text = "example text 2";

function update() {
    setText("titleBox", post1title);
    setText("bodyBox", post1text);

Моя цель - сделать так, чтобы функция update () имела параметр, который позволяет тексту в текстовом поле быть, например, post1title или post2title.

Я бы хотел сделать нечто похожее на то, что вы делаете со строками, когда задействованы переменные, как показано здесь:

console.log("User has set the variable post1title to: " + post1title);
// prints "User has set the variable post1title to: example title 1" to the debug console

Не похоже, что вы можете делать то же самое при вызовепеременные, хотя.Я попытался сделать то же самое, что вы сделали бы со строками (где «n» - это число 1-2):

var post1title = "example title 1";
var post1text = "example text 1";
var post2title = "example title 2";
var post2text = "example text 2";

function update(n) {
    setText("titleBox", post + n + title);
    setText("bodyBox", post + n + text);

Это, очевидно, читается как сложение трех переменных вместе.Возможно ли что-то подобное?

Answer 1

Может быть лучше преобразовать ваши переменные в объект.Эта структура имитирует лучшее для реальных данных, полученных, например, из базы данных.И я использую литералы шаблона внутри console.log для более простого объединения строк и переменных

var posts = {  	
     "title": {
        "1": "example title 1",
       "2": "example title 2",
      },
    
      "text": {
        "1": "example text 1",
        "2": "example text 2",
      }    
}

function update(part, n) {
  /* setText("titleBox", post1title);
  setText("bodyBox", post1text); */
  console.log(`User has set the variable post${n}${part} to: ${posts[part][n]} `); 
}

update('title', '1')
update('title', '2')
update('text', '1')
update('text', '2')

Answer 2

Это, по меньшей мере, анти-паттерн, но если вы действительно хотите сделать это (а вы нет, но, увы):

function update(n) {
  setText("titleBox", eval("post" + n + "title"));
  ...

---

... и It имеет более высокую производительность, чем при использовании конструктора Function () .Тем не менее, eval() это плохая практика.

Answer 3

Вы можете сохранить значения как свойства простого объекта или Map и использовать вычисленные имена свойств или скобки для получения соответствующего значения.

Также можно настроить порядок ожидаемых параметров.

const o = {
  post1title: "example title 1",
  post1text: "example text 1",
  post2title: "example title 2",
  post2text: "example text 2"
}

function update(p, t, n) {
  console.log(o[p + n + t])
}

update('post', 'title', 1);

Answer 4

Вы можете использовать объект с символом скобки , чтобы сделать что-то похожее на это.Таким образом, ваш объект будет содержать ключи, которые указывают на связанные с ними значения.

См. Пример ниже:

var options = {
  post1title: "example title 1",
  post1text: "example text 1",
  post2title: "example title 2",
  post2text: "example text 2"
}

function update(n) {
  setText("titleBox", options["post"+ n + "title"]);
  setText("bodyBox", options["post" + n + "text"]);
}

function setText(id, txt) {
  document.getElementById(id).textContent = txt;
}

update(1)

<h2 id="titleBox"></h2>
<p id="bodyBox" ></p>

Или альтернативный способ - использовать функцию конструктора, например так:

var post1title = "example title 1";
var post1text = "example text 1";
var post2title = "example title 2";
var post2text = "example text 2";

function update(n) {
  setText("titleBox", Function("return post"+ n + "title")());
  setText("bodyBox", Function("return post"+ n + "text")());
}

function setText(id, txt) {
  document.getElementById(id).textContent = txt;
}

update(1);

<h2 id="titleBox"></h2>
<p id="bodyBox" ></p>