Как передать объект / шаблон в качестве параметра в Javascript/jQuery

Я пытаюсь сделать первый шаг в jQuery. Я пытаюсь добиться следующего, хотя я не уверен в терминологии, поэтому постараюсь объяснить на примере с использованием своего рода синтаксиса C#/pseudocode.

Скажем, я хочу (анонимный) объект в качестве параметра, который выглядит примерно так:

elemParameter {
    elemId,
    arg1,
    optionalArg2
}

и я хочу передать массив / коллекцию этих объектов в мою функцию

$(document).ready(function() {
    $.myFunction(
        new { Id = "div1", Color = "blue", Animal = "dog" },
        new { Id = "div3", Color = "green" },
        new { Id = "div4", Color = "orange", Animal = "horse" }
    );
}

и затем в моей функции мне нужно получить доступ к каждому объекту коллекции, что-то вроде:

(function($) {
    $.myFunction(var elemParams) {
        foreach (param in elemParams) {
            $('#' + param.Id).onclick = function() {
                this.css('background-color', param.Color);
                alert(param.Animal ?? 'no animal specified');
            }
        }
    }
}

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

Источник

2 ответа

Решение

Ваш синтаксис совсем немного, он будет выглядеть примерно так:

$(function() {
  function myFunction() {
    $.each(arguments, function(i, arg) {
      $('#' + arg.Id).click(function() {
        $(this).css('background-color', arg.Color);
        alert(arg.Animal || 'no animal specified');
      });
    });
  }
  myFunction({ Id: "div1", Color: "blue", Animal: "dog" },
             { Id: "div3", Color: "green" },
             { Id: "div4", Color: "orange", Animal: "horse" });​
});

Вы можете попробовать демо здесь, стиль синтаксиса называется литеральной нотацией JavaScript, это то, что вы ищете, ища больше информации об этом:)

В качестве альтернативы вы можете передать объекты в виде массива, если вам нужны другие аргументы в дополнение к ним, вместо использования arguments непосредственно.

Источник

Вы ищете "буквенное обозначение объекта". Это выглядит так:

{
    propertyName: propertyValue,
    propertyName2: propertyValue2
}

Вы не используете new ключевое слово с ними, они просто литеральные конструкции, такие как строки ("foo") или числа (42). Точно так же у вас есть литералы массива:

["one", "two", "three"]

Вот ваш пример обновлен:

$(document).ready(function() {
    $.myFunction(
        // <== Start an array literal with [
        [
            // <== Colons rather than equal signs
            { Id: "div1", Color: "blue", Animal: "dog" },
            { Id: "div3", Color: "green" },
            { Id: "div4", Color: "orange", Animal: "horse" }
        // End the array literal with ]
        ]
    );
}

Обратите внимание, что важно не иметь запятую в литерале объекта или массива, например

["one", "two", "three", ]
                      ^--- Don't do that
{foo: "bar", x: 27, }
                  ^------- Or that

Вопрос о том, были ли они действительными, был неясен (теперь это ясно по состоянию на последнее 5-е издание), и IE (по крайней мере) задыхается от них.

Не по теме, но обычно имена свойств в коде JavaScript находятся в camelCase и начинаются со строчной буквы (например, animal скорее, чем Animal). Это чисто стиль, однако.

Источник
Другие вопросы по тегам