Почему, что и как изменить игру ваших моделей javascript.

В чем смысл модели javascript? Если вы задаетесь этим вопросом, то вы пришли в нужное место. Модель javascript обычно используется как абстракция от вашего источника данных (бэкенд) к вашему логическому источнику (интерфейс).

Позвольте мне привести вам быстрый пример. Допустим, у нас есть сайт блога с общим классом BlogPost.

class BlogPost {
  constructor(blog) {
    this.id = blog.id;
    this.title = blog.title;
    this.content = blog.content;
    this.likes = blog.likes;
  }
}

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

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

export class BaseClass {
  constructor() {
  }
  static toList(items) {
    let final = [];
    items.foreach(item => {
      final.push(new this(item));
    })
    return final;
  }
}

Как видите, мы используем ключевое слово this для создания экземпляра списка элементов из нашего метода static to list. Итак, как мы можем использовать это? Прежде всего, нам нужно расширить наш класс BlogPost из нашего базового класса.

class BlogPost extends BaseClass

И затем мы можем использовать это, выполнив следующие действия:

const items = [
  {
    id: "0001",
    title: "Effective Javascript Model Design",
    content: "Lorem Ipsum"
  },
  {
    id: "0002",
    title: "Domain Driven Javascript",
    content: "Lorem Ipsum"
  }
]
const blogPosts = BlogPost.toList(items);

теперь это даст нам доступ к списку наших объектов BlogPost.

Но теперь начинается настоящее веселье. Допустим, вам нужно было добавить аналитику к нашим сообщениям в блоге, чтобы узнать, сколько людей просмотрело наш пост. Теперь достаточно просто добавить эту логику, но что, если нам нужно добавить ее в несколько мест? Именно тогда мы действительно можем начать использовать производные классы в полной мере. Итак, давайте создадим новый класс, который мы можем использовать для отслеживания событий.

export class Trackable extends BaseClass {
  constructor() {}
  trackEvent(eventType, eventDetail) {
    // DO SOME PROCESSING LOGIC FOR TRACKING EVENTS
  }
}

Теперь, когда у нас есть класс Trackable, мы можем изменить наш BlogPost, чтобы расширить его.

class BlogPost extends Trackable {
  constructor() {}
  viewPost() {
    this.trackEvent('view-post', this);
  }
}

Что, в свою очередь, позволяет нам получить доступ как к методу trackEvent, так и к функциям toList. Поэтому, если бы мы хотели включить метод для просмотра определенного поста, мы сразу же смогли бы добавить наши события отслеживания сверху.

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

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

Удачного моделирования!