Домашняя » кодирование » Полное руководство для геттеров и сеттеров в JavaScript

    Полное руководство для геттеров и сеттеров в JavaScript

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

    В этом посте мы увидим, что такое методы получения и как создавать и использовать их в JavaScript.

    Геттеры-сеттеры и инкапсуляция

    Идея геттеров и сеттеров всегда упоминается в сочетании с инкапсуляцией. Инкапсуляция может быть понимать двумя способами.

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

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

    Создать геттеры и сеттеры

    1. С методами

    Так как геттеры и сеттеры в основном функции что получить / изменить значение, есть более чем один способ создавать и использовать их. Первый способ:

     var obj = foo: 'это значение foo', getFoo: function () return this.foo; , setFoo: function (val) this.foo = val;  console.log (obj.getFoo ()); // "это значение foo" obj.setFoo ('hello'); console.log (obj.getFoo ()); // "Привет"

    Это самый простой способ создавать геттеры и сеттеры. Там есть свойство Foo и есть два метода: getFoo а также setFoo в вернуть и присвоить значение к этой собственности.

    2. С ключевыми словами

    Еще “официальный” и надежный способ создания геттеров и сеттеров с помощью получить а также задавать ключевые слова.

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

     var obj = fooVal: 'это значение foo', get foo () return this.fooVal; , установите foo (val) this.fooVal = val;  console.log (obj.foo); // "это значение foo" obj.foo = 'hello'; console.log (obj.foo); // "Привет" 

    Обратите внимание, что данные могут быть только хранится под именем свойства (fooVal) это разные из названия методов getter-setter (Foo) потому что свойство содержит геттер-сеттер не может содержать данные также.

    Какой путь лучше?

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

    Однако, если вы выберете первый способ кодирования методов получения и установки, вам придется вызывать методы установки и получения используя синтаксис вызова функции потому что они являются типичными функциями (ничего особенного, как те, которые созданы с использованием получить а также задавать ключевые слова).

    Кроме того, есть вероятность, что вы можете случайно оказаться присвоение некоторого другого значения к свойствам, которые содержали эти методы getter-setter и потерять их полностью! Что-то, о чем вам не нужно беспокоиться в последующем методе.

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

    Защита от перезаписи

    Если по какой-то причине вы предпочитаете первый метод, задайте свойства, содержащие методы getter-setter только для чтения создавая их с помощью Object.defineProperties. Свойства, созданные с помощью Object.defineProperties, Object.defineProperty а также Reflect.defineProperty автоматически настраивать в Доступно для записи: ложь что значит только для чтения:

     / * Предотвращение перезаписи * / var obj = foo: 'это значение foo'; Object.defineProperties (obj, 'getFoo': value: function () return this.foo;, 'setFoo': value: function (val) this.foo = val;); obj.getFoo = 66; // getFoo не будет перезаписан! console.log (obj.getFoo ()); // "это значение foo" 

    Операции внутри геттеров и сеттеров

    После того, как вы познакомились с геттерами и сеттерами, вы можете пойти дальше и выполнять операции с данными перед изменением или возвратом.

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

     var obj = n: 67, get id () return 'Идентификатор:' + this.n; , установите id (val) if (typeof val === 'number') this.n = val;  console.log (obj.id); // "Идентификатор: 67" obj.id = 893; console.log (obj.id); // "Идентификатор: 893" obj.id = 'hello'; console.log (obj.id); // "Идентификатор: 893" 

    Защитите данные с помощью геттеров и сеттеров

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

    Незащищенные данные

    Настройка методов получения и установки не означает, что данные могут быть доступны и изменены только этими методами. В следующем примере это изменилось напрямую не касаясь методов получения и установки:

     var obj = fooVal: 'это значение foo', get foo () return this.fooVal; , установите foo (val) this.fooVal = val;  obj.fooVal = 'привет'; console.log (obj.foo); // "Привет" 

    Мы не использовали сеттер, но напрямую изменил данные (fooVal). Данные, которые мы изначально устанавливаем внутри OBJ ушел сейчас! Чтобы этого не произошло (случайно), вы нужна защита для ваших данных. Вы можете добавить это ограничение объема где ваши данные доступны. Вы можете сделать это либо блокировать область видимости или же определение функции.

    1. Блок определения объема

    Одним из способов является использовать область видимости блока внутри которого данные будут определены с использованием позволять ключевое слово, которое ограничивает сферу его применения в этот блок.

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

     / * БЛОК ОБЛАСТИ, оставьте фигурные скобки в покое! * / let fooVal = 'это значение foo'; var obj = get foo () return fooVal; , установите foo (val) fooVal = val fooVal = 'hello'; // не будет влиять на fooVal внутри блока console.log (obj.foo); // "это значение foo"

    Изменение / создание fooValвне блока не повлияет fooVal указано внутри геттеров сеттеров.

    2. Функция определения объема

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

     function myobj () var fooVal = 'это значение foo'; return get foo () return fooVal; , установите foo (val) fooVal = val fooVal = 'hello'; // не повлияет на наш оригинальный fooVal var obj = myobj (); console.log (obj.foo); // "это значение foo"

    Объект (с Foo () getter-setter внутри него) возвращается myobj () функция сохранено в OBJ, а потом OBJ используется для вызвать геттер и сеттер.

    3. Защита данных без определения объема

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

    Если данные имеют не так легко воспроизвести имя переменной / свойства, есть вероятность, что никто (даже мы) не перезапишем его, присвоив какое-то значение этой переменной / имени свойства.

     var obj = s89274934764: 'это значение foo', get foo () return this.s89274934764; , установите foo (val) this.s89274934764 = val;  console.log (obj.foo); // "это значение foo" 

    Видите ли, это один из способов решения проблемы. Хотя выбранное мной имя не очень хорошее, вы также можете использовать случайные значения или символы создать имена свойств, как это было предложено Дериком Бэйли в этом сообщении в блоге. Основная цель состоит в том, чтобы держать данные скрытыми из другого кода и разрешить паре getter-setter получить / обновить его.

    Когда вы должны использовать геттеры и сеттеры?

    Теперь возникает большой вопрос: начинаете ли вы назначать геттеры и сеттеры? ко всем вашим данным сейчас?

    Если вы сокрытие данных, тогда есть другого выбора нет.

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