Блог о языках, путешествиях и программировании

Javascript — язык со слабой типизацией, поэтому возникает много проблем с операторами сравнения из-за неявного приведения типов.

Совет. Использовать оператор строгого равенства === везде, где только можно.

Для явного приведения к одному из трех примитивных типов можно писать так:

Приведение к строке

'' + 5; // === '5'

Приведение к числу

+'5'; // === 5

Приведение к булеву типу

!!'';      // === false
!!'0';     // === true
!!'-1'     // === true
!!true;    // === true

 

 

Цель этого поста — сказать простыми словами о том, чем объекты и прототипы JavaScript отличаются от обычных для ООП классов и объектов, и почему модель JavaScript является более гибкой, чем классическая для ООП.

1. В JavaScript всё ведёт себя, как объект.
2. Абсолютно любая функция может вести себя как конструктор при помощи слова new. constr = new Func ();
3. Абсолютно любой (даже пустой) объект может выступать в роли прототипа.
4. Прототип имеется у каждого объекта. Например, для конструктора прототип по умолчанию — это пустой объект.
5. Прототип — это не что-то особенное, как, например, «класс» в других языках. Это просто обычный объект, без каких-то дополнительных свойств или методов.
6. Как ведет себя сущность в JavaScript делится между конструктором (любая функция, которая отвечает за создание и инициализацию сущности) и прототипом (задает поведение сущности)
7. Любое разделяемое между объектами поведение определяется их прототипом. Например, если требуется иметь много объектов с одним и тем же методом, его лучше определить на прототипе.
8. Ключевое слово this в методе, определенном на прототипе, но используемом на объекте с этим прототипом, ссылается на сам объект.
9. Свойства и методы, уникальные для объекта, определяются в конструкторе.
10. Любые свойства и методы прототипа доступны непосредственно в объектах, имеющих этот прототип.
11. Свойства и методы прототипа могут переопределяться в конструкторе или непосредственно на объекте.
12. Прототипная модель в JavaScript позволяет реализовать классическое наследование и поведение класс-объект в ООП, но также даёт делать более гибкие вещи.

 

Как известно, методы «класса» в JavaScript лучше всего определять на прототипе, а свойства — на конструкторе, потому что методы нежелательно дублировать, определяя заново в каждом объекте, а значения свойств должны быть уникальны для каждого объекта.

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

Концепция наследования через цепь прототипов

Можно реализовать наследование через цепочку прототипов. Объявляются два «класса», прототип «потомка» объявляется как новый объект, созданный вызовом конструктора «родителя». Вот так:

function SuperType(){
}

function SubType(){
}

SubType.prototype = new SuperType();

Такой подход создаёт только две проблемы:

1. Ссылочные значения делятся между всеми «потомками» «родителя».

2. Нельзя передать аргументы конструктору «родителя».

Способ, предложенный в книге JavaScript Allongé:

Берем суперкласс Superclass, объявляем для него пустой прокси-класс:

var SuperclassProxy = function () {
    this.constructor = Subclass;
}
SuperclassProxy.prototype = Superclass.prototype

Далее мы используем конструктор прототипа суперкласса в конструкторе класса-потомка. В качестве прототипа класса-потомка используем конструктор прокси-класса. Сам прокси-класс нужен, чтобы случайно не испортить что-нибудь в суперклассе при вызове его конструктора. Например, если в конструкторе выполняется подключение к БД, то не выполнять его при каждом наследовании.

var Subclass = function () {
    Superclass.prototype.constructor.call(this)
};

Subclass.prototype = new SuperclassProxy();

Далее мы делаем копию объекта (shallow copy) Superclass и дополняем ее методами и свойствами Subclass.

Решение, предложенное в книге Effective JavaScript:

Допустим, у нас есть SuperType, и мы пытаемся создать SubType на его основе.

function SubType(arg1, arg2, arg3) {
     SuperType.call ( this, arg1, arg2, arg3);
     // разные действия в собственно конструкторе SubType
}
SubType.prototype = Object.create(SuperType.prototype); // наследуем прототип

Здесь мы сначала вызываем конструктор SuperType, передавая туда все требуемые аргументы, а в качестве приёмника будет SubType.

Затем наследуем прототип SuperType.

 

Как известно, в JavaScript существуют примитивные типы, такие как число, строка или булев, и для них имеются соответствующие им объекты типа Number, String, Boolean, у которых есть методы для работы с этими типами, например, методы обработки строк… Если вы попытаетесь применить функцию к примитивному типу, например:

var str = "How are you doing today?";
var res = str.split(" ");

то в данном случае когда к обычной строке str мы применяем метод split, то JavaScript находит подходящий тип объекта, в данном случае это String, создает новый объект с помощью new String («How are you doing today?»); и применяет к нему функцию split.

При этом часто возникает проблема при сравнении двух значений, потому что str === new String (str) выдаст false. Также, если, к примеру, строка » в условии выдаст false, то new String (»)  уже выдаст true. К счастью, так же, как JavaScript автоматически создает объект из примитива, он способен и на обратное. Если мы вызовем конструктор для объекта, замещающего соответствующий примитивный тип, и передадим ему сам объект, то получим значение изначального примитивного типа.

То есть,

String(new String("How are you doing today?")) === "How are you doing today?"

выдаст true, поскольку левая часть выражения возвращает обычную строку.

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

var getPrimitive = function (sourceValue) {
    return sourceValue.constructor(sourceValue)
}

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

Например,

getPrimitive ("Привет"); // выдаст обычную строку "Привет"
getPrimitive (new String ("Привет")); // также обычную строку "Привет"

getPrimitive (new String ("Привет"))==="Привет"; выдаст true

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

Из википедии:

Мемоизация — сохранение результатов выполнения функций для предотвращения повторных вычислений. Это один из способов оптимизации, применяемый для увеличения скорости выполнения компьютерных программ. Перед вызовом функции проверяется, вызывалась ли функция ранее: если не вызывалась, функция вызывается и результат её выполнения сохраняется; если вызывалась, используется сохранённый результат.

Классическим примером для иллюстрации является функция, вычисляющая последовательность чисел Фибоначчи:

function fibonacci(n) {
  if (n === 0 || n === 1)
    return n;
  else
    return fibonacci(n - 1) + fibonacci(n - 2);
}

Для больших чисел n количество вызовов функции растёт очень быстро. Уже для n=50 это порядка 40 миллиардов вызовов.

Используя идею мемоизации, то есть кеширования промежуточного результата, можно добиться уменьшения количества вызовов для n=50 до всего лишь 99:

var fibonacci = (function() {
  var memo = {};

  function f(n) {
    var value;

    if (n in memo) {
      value = memo[n];
    } else {
      if (n === 0 || n === 1)
        value = n;
      else
        value = f(n - 1) + f(n - 2);

      memo[n] = value;
    }

    return value;
  }

  return f;
})();

Если функция имеет дело с несколькими аргументами, то нужно хранить в кеше их все. Вместо того,  чтобы каждый раз писать «мемоизированную» версию функции, можно использовать функцию-обёртку вроде такой:

function memoized (fn, keymaker) {
   var lookupTable = {},
   key;
   keymaker || (keymaker = function (args) {
      return JSON.stringify(args)
   });
   return function () {
      var key = keymaker.call(this, arguments);
      return lookupTable[key] || (
         lookupTable[key] = fn.apply(this, arguments)
      )
   }
}

Используется она очень просто:

var memoizedFibonacci = memoized( function (n) {
  if (n === 0 || n === 1)
    return n;
  else
    return memoizedFibonacci (n - 1) + memoizedFibonacci (n - 2);
});

memoizedFibonacci (50);

Мемоизация полезна, когда вы передаёте в функцию заранее известный набор аргументов и когда результат функции будет всегда одинаковым при одинаковых аргументах. Если же функция не даёт одинакового результата при тех же аргументах, то мемоизация будет бесполезна.

Код большинства примеров взят из статьи   Implementing Memoization in Javascript