Форум программистов, компьютерный форум, киберфорум
Наши страницы

JavaScript: API

Войти
Регистрация
Восстановить пароль
 
RuS_984
4 / 4 / 1
Регистрация: 15.12.2015
Сообщений: 103
Завершенные тесты: 4
#1

Как правильно написать многоуровневую функцию - JavaScript

21.08.2017, 11:38. Просмотров 163. Ответов 1
Метки нет (Все метки)

Не знаю правильно ли сформулировал вопрос. Я недавно занялся изучением JS.
Объясню на пальцах чего я хочу...
У меня есть страница на которой есть 2 боковые панели: правая и левая. Сначала я написал 4 метода для открытия и закрытия правой и левой панели (2 функции открытия и 2 - закрытия). Потом я захотел в некою единую конструкцию. Сделал 2 вырианта
1 Вариант (на базе JSON-объекта):
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var SideBar3 = {
  Left : {
      Open : function() {
       alert( "Left Open3");
      },
      Close : function() {
       alert( "Left Close3");
      }     
    },
  Right : {
      Open : function() {
       alert( "Right Open3");
      },
      Close : function() {
       alert( "Right Close3");
      }     
    }  
}
2 Вариант (на базе составной многоуровневой функции):
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
SideBar4 = new function()  {
  this.Left = new function()  {
      this.Open = function() {
       alert( "Left Open4");
      };
      this.Close = function() {
       alert( "Left Close4");
      };     
  };
  this.Right= new function()  {
      this.Open = function() {
       alert( "Right Open4");
      };
      this.Close = function() {
       alert( "Right Close4");
      };
    };
};
Использование соответственно (для примера):
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
<button onclick = "SideBar3.Left.Open()">Side Bar3 > Left > Open</button>
<button onclick = "SideBar3.Left.Close()">Side Bar3 > Left > Close</button>
 
<button onclick = "SideBar3.Right.Open()">Side Bar3 > Right > Open</button>
<button onclick = "SideBar3.Right.Close()">Side Bar3 > Right > Close</button>   
 
 
<button onclick = "SideBar4.Left.Open()">Side Bar4 > Left > Open</button>
<button onclick = "SideBar4.Left.Close()">Side Bar4 > Left > Close</button>
 
<button onclick = "SideBar4.Right.Open()">Side Bar4 > Right > Open</button>
<button onclick = "SideBar4.Right.Close()">Side Bar4 > Right > Close</butto

Вопрос к знатокам:
1. Правильной ли дорогой иду?
2. Можно ли (имеет ли смысл) так делать?
3. Как сделать красивей или правильней?
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
21.08.2017, 11:38
Здравствуйте! Я подобрал для вас темы с ответами на вопрос Как правильно написать многоуровневую функцию (JavaScript):

Как правильно поставить toFixed(3) в функцию onload - JavaScript
Привет всем. Ребят подскажите пожалуйста как правильно поставить toFixed(3) в данный скрипт. onload = function () { var f =...

Как правильно создать цикл или функцию - JavaScript
Добрый день! Подскажите пожалуйста, хочу сделать цикл или функцию что бы повторялось i-раз. Но не знаю к чему привязать i. ...

Как правильно вызвать функцию onclick? Странные тонкости или ошибки подключения модулей? - JavaScript
Проблема с подключением скриптов. Суть в том, что если функцию вызывать из подключаемого файла скрипта - функция срабатывает. Но если...

Как правильно написать валидацию для модели в Backbone - JavaScript
Привет. Я посмотрел вот этот коротенький урок. И сделал всё как там: var Person = Backbone.Model.extend({ // Наполним модель...

Подскажите как написать функцию для интервала - JavaScript
Есть вот такой блок по типу табов. Переключение по клику и появление нужного контента я сделал. $(document).ready(function(){ ...

Написать функцию, которая возвращает целое случайное число из диапазона, который передается параметрами в функцию. - JavaScript
&lt;html&gt; &lt;head&gt; &lt;title&gt;Случайные числа &lt;/title&gt; &lt;script type=&quot;text/javascript&quot;&gt; function RAND(min,max) { var...

1
msheal
29 / 29 / 18
Регистрация: 05.03.2015
Сообщений: 149
26.08.2017, 22:54 #2
Я бы полностью разделил эти 2 компонента для возможного будущего переиспользования. Получилось бы нечто такое:

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var SidebarLeft = (function () { 
    var my = {}, 
        privateVariable = 1; 
 
    function privateMethod() { 
        // ... 
    } 
 
    my.moduleProperty = 1; 
    my.moduleMethod = function () { 
        // ... 
    }; 
 
    return my; 
}());
Таким образом мы явно экспортируем нужные методы анонимной функции и решаем проблему с неймспейсом. В итоге получается полноценный (почти) модуль. В вашем случае, это выглядело бы как-то так:

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
var SidebarLeft = (function () { 
    var my = {};
 
    my.Open= function () { 
        // ... 
    }; 
    my.Close = function () { 
        // ... 
    }; 
 
    return my; 
}());
0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
26.08.2017, 22:54
Привет! Вот еще темы с ответами:

Правильно реализовать функцию - JavaScript
Помогите при запуске выводит 0 значение поля 'а11'.Что в функции get прописано не так? &lt;style type=&quot;text/css&quot;&gt; #a12:checked ~...

Правильно создать функцию - JavaScript
Привет всем, помогите разобраться. хочу создать функцию, что бы обращаться к ней таким образом $('div.add_class').addClass('open'); ...

Написать функцию - JavaScript
напишите функцию,аргументом которой является число a и функция f, а результатом функция, возвращающая первый раз f(a), второй раз f(f(a)) и...

Как правильно написать функцию? - C++
Привет :) Начал изучение функций в С++. Написал первую, и тут же начались проблемы. Вот код. Помогите пожалуйста #include...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Рейтинг@Mail.ru