Возврат Javascript с двоеточием

Я изучаю JavaScript и обнаружил структуру ниже:

var Test = (function () {

  function func1() {
      //do something.....
  }

  function func2() {
      //do something.....
  }

  function func3() {
      //do something.....
  }

  return {
      func1: func1,
      func2: func2,
      func3: func3
  };

})();

Мне интересно, что делает блок возврата. Является ли это очень часто используемой структурой JavaScript? Пожалуйста, дайте мне знать, где я могу получить дополнительную информацию об этом.

Ответ 1

Это раскрывающий шаблон модуля.

Возвращаемый объект содержит ссылки на функции, определенные внутри IIFE. Таким образом, функции, определенные внутри, являются частными для анонимной функции.

Но если вы хотите использовать внутренние функции снаружи, вы можете использовать возвращенный объект.

Значение Test будет

var Test = {
    func1: func1,
    func2: func2,
    func3: func3
};

И вы можете вызвать func1 извне как

Test.func1();

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

Образцовый шаблон модуля вдохновлен шаблоном модуля. При отображении шаблона модуля в объекте возвращается только ссылка на частные переменные/методы.

Основная идея шаблона - избегать злых глобальных переменных. Это похоже на IIFE, за исключением того, что вместо функции возвращается объект. Переменные/методы, определенные внутри IIFE, являются частными для функции. Чтобы получить доступ к любой переменной/методу внутри IIFE, его необходимо добавить в возвращаемый объект, а затем к нему можно получить доступ из-за пределов IIFE. Этот шаблон использует преимущества замыканий, поэтому переменные/методы, определенные внутри IIFE, доступны даже после возвращения объекта.

Из книги Addy Osmani Изучение шаблонов проектирования Javascript

Схема раскрывающегося модуля возникла, поскольку Хейлманн был расстроен тем фактом, что ему пришлось повторить имя основного объекта, когда мы хотели вызвать один общедоступный метод из другого или получить доступ к общедоступным переменным. Он также не любил требования к шаблонам модуля для того, чтобы переключиться на объектную литературу для того, что он хотел обнародовать.

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

<сильные > Преимущества:

Герметизация. Код внутри IIFE инкапсулирован из внешнего мира
Чистый, организованный и многоразовый код
Конфиденциальность. Это позволяет создавать частные переменные/методы. Частные переменные/методы не могут быть затронуты из-за пределов IIFE.

Недостатки:

Если частная функция относится к публичной функции, эта публичная функция не может быть переопределена

Дальнейшее чтение:

ИЗМЕНИТЬ

От comment от @Mike

Следует отметить, что он является общим для создания объекта (например, var me = {};), а затем объявляет на него публичные члены (me.func1 = function() { /* ... */ };), возвращая этот объект в конец (return me;). Это позволяет избежать повторения, которое мы видим в операторе return кода OP (где повторяется все общедоступные вещи).

Ответ 2

Это буквальный объект в операторе return. Это похоже на создание объекта, а затем его возвращение:

var obj = {
    func1: func1,
    func2: func2,
    func3: func3
};
return obj;

Литеральный синтаксис объекта создает объект и задает его свойства, как:

var obj = new Object();
obj.func1 = func1;
obj.func2 = func2;
obj.func3 = func3;
return obj;

Цель возврата объекта - показать функции внутри функции для кода снаружи, создав область видимости для частных переменных, которую могут использовать функции.

Если не использовать частные переменные, код выполняет то же самое, что:

var Test = {
  func1: function() {
      //do something.....
  },
  func2: function() {
      //do something.....
  },
  func3: function() {
      //do something.....
  }
};

Частные переменные объявляются внутри области видимости функции и доступны только внутри нее. Пример:

var Test = (function () {

  var name;

  function setName(str) {
    name = str;
  }

  function getName() {
    return name;
  }

  return {
      setName: setName,
      getName: getName
  };

})();

Test.setName("John Doe");
var name = Test.getName();

Ответ 3

Это работает как класс на других языках программирования. Таким образом, вы можете получить доступ к общедоступному элементу func1 с помощью Test.func1 и вызвать его как обычную функцию с помощью Test.func1().