1

Тема: наслідування в JS

JS востаннє я бачила овер два роки назад і то чисто "пацани, хто зробив цю штуку? скиньте хто-небудь код, позяаа" після того я ні разу з ним не стикалась, а тут прийшлось
завдання полягає ось в чому:
Написати клас Fantasy, який наслідує клас Book. Класс Book містить метод BookName (name можна передавати в  конструктор). Клас Fantasy містить метод Present (повертає рядок “The fantasy book *bookname* is present”.
і для прикладу ці методи можуть використовуватись отак (псевдокод, я полягаю):

$fan_book = new Fantasy(‘The Lord of the Rings’);
$fan_book->BookName() === ‘The Lord of the Rings’ // true
$fan_book->Present() === ‘The fantasy book *The Lord of the Rings* is present’ // true

і от я перечитала кілька статтей, встигла тричі заплутатись, разів 5 переписати код, і от вийшло в кінцевому варіанті:

function Fantasy (name) 
  {
    this.name = name;      
  }

Fantasy.prototype = Object.create(Book.prototype);

    Fantasy.prototype.Present=funtion()
      {
         alert ('The fantasy book *' + this.BookName + '* is present’);
       } 

не знаю правильно це чи ні, бо я навіть не знаю як його перевірити (здається, тоді ще давно я в eclipse запускала, хоча не впевнена)
розумію, що варіантів може бути декілька - мені б якийсь поштовх, щоб я вже точно шарила як це робиться

Психологічні бесіди з додатковою послугою промивання мізків. Недорого.
Не дизайню. Взагалі ні разу. У назві розділу "Дизайн та графіка" є слово "графіка" - ось тут трохи шарю. І не більше. Так, часто питають.
Продам гараж

2 Востаннє редагувалося taras_kotilok (05.08.2014 19:59:38)

Re: наслідування в JS

Є класна книжка - "Стоян Стефанов. Javascript. Шаблони". Там описано багато хороших практик Javascript. А також різні способи наслідування. На жаль українською такі книжки не перекладають. тільки англійська і російська. Може російською буде зрозуміліше.
http://vk.com/doc10903696_195353516?has … 71e3631562

А найпростіший код може бути таким:

function Book(book) {
  this.book = book;
  this.bookName = function() {
      return this.book;
  }
}

function Fantasy(book) {
  this.book = book;
  this.present = function() {
      return "The fantasy book *" + this.book + "* is present";
  }
}

Fantasy.prototype = new Book();

var obj = new Fantasy('AwesomeBook');

alert( obj.present() );

alert( obj.bookName() );
Подякували: Cyan1

3

Re: наслідування в JS

чорт, в мене був такий варіант, просто я не знала як туди прив'язати наслідування
тим паче я не знала, що це можна вказати вже після опису класу

UPD: а там точно у present підставиться результат з bookName, бо я не бачу логіки як вони зв'язані
і чи є помилки в конкретно моєму варіанті?

Психологічні бесіди з додатковою послугою промивання мізків. Недорого.
Не дизайню. Взагалі ні разу. У назві розділу "Дизайн та графіка" є слово "графіка" - ось тут трохи шарю. І не більше. Так, часто питають.
Продам гараж

4

Re: наслідування в JS

А юзати Coffeescript і морочити голову цим шлаком дуже погано?

5

Re: наслідування в JS

мені саме JavaScript потрібен

Психологічні бесіди з додатковою послугою промивання мізків. Недорого.
Не дизайню. Взагалі ні разу. У назві розділу "Дизайн та графіка" є слово "графіка" - ось тут трохи шарю. І не більше. Так, часто питають.
Продам гараж

6

Re: наслідування в JS

є ще така http://addyosmani.com/resources/essenti … erns/book/
багато толкових речей розписано

(function(){
  console.log("called anonymously");
})()
Подякували: Cyan1

7

Re: наслідування в JS

Ну ось таке набагато приємніше читати

class Book

  constructor: (@name) ->

  BookName: ->
    @name


class Fantasy extends Book

  Present: ->
    "The fantasy book *#{@name}* is present"


name = "The Lord of the Rings"

fan_book = new Fantasy(name)
alert fan_book.BookName() is name 

alert fan_book.Present() is "The fantasy book *The Lord of the Rings* is present"

генерить воно ось таке

var Book, Fantasy, fan_book, name,
  __hasProp = {}.hasOwnProperty,
  __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };

Book = (function() {
  function Book(name) {
    this.name = name;
  }

  Book.prototype.BookName = function() {
    return this.name;
  };

  return Book;

})();

Fantasy = (function(_super) {
  __extends(Fantasy, _super);

  function Fantasy() {
    return Fantasy.__super__.constructor.apply(this, arguments);
  }

  Fantasy.prototype.Present = function() {
    return "The fantasy book *" + this.name + "* is present";
  };

  return Fantasy;

})(Book);

name = "The Lord of the Rings";

fan_book = new Fantasy(name);

alert(fan_book.BookName() === name);
alert(fan_book.Present() === "The fantasy book *The Lord of the Rings* is present");

8

Re: наслідування в JS

Singularity, що в фразі "мені саме JavaScript потрібен" вам не зрозуміло
muhasjo, виглядає краще, ніж те, що кинув taras_kotilok, там хоча б коду побільше, але про наслідування я щось не знайшла - мабуть, так шукаю

Психологічні бесіди з додатковою послугою промивання мізків. Недорого.
Не дизайню. Взагалі ні разу. У назві розділу "Дизайн та графіка" є слово "графіка" - ось тут трохи шарю. І не більше. Так, часто питають.
Продам гараж

9

Re: наслідування в JS

Cyan написала:

Singularity, що в фразі "мені саме JavaScript потрібен" вам не зрозуміло
muhasjo, виглядає краще, ніж те, що кинув taras_kotilok, там хоча б коду побільше, але про наслідування я щось не знайшла - мабуть, так шукаю

Ну наслідування в JS це зовсім не те наслідування, що і в PHP чи С++, тут все зовсім по іншому. В основному робиться через prototype, і варіантів реалізацій може бути декілька(один з них Ви вже описали).

В цій книжці що я кинув, якраз є хороші приклади, не зовсім наслідування, але як правильно писати на JS. Які паттерни використовувати і всяке таке.

А як на мене JS зі своїми closures, дуже круто виглядає, але не без недоліків.

(function(){
  console.log("called anonymously");
})()
Подякували: Cyan1

10

Re: наслідування в JS

muhasjo написав:

В цій книжці що я кинув, якраз є хороші приклади, не зовсім наслідування, але як правильно писати на JS. Які паттерни використовувати і всяке таке.

а, ну гаразд
просто подумала, що ви кинули, щоб я знайшла відповідь на своє питання, але якщо так то нехай


muhasjo написав:

Ну наслідування в JS це зовсім не те наслідування, що і в PHP чи С++, тут все зовсім по іншому. В основному робиться через prototype, і варіантів реалізацій може бути декілька(один з них Ви вже описали).

я вже цілий день про це наслідування читаю і щось не можу вшарити до кінця, тому не зовсім впевнена, що все роблю правильно
я зустрічала кілька варіантів і ніби кажуть, що з прототипами воно надійніше, тому я так і зробила

Психологічні бесіди з додатковою послугою промивання мізків. Недорого.
Не дизайню. Взагалі ні разу. У назві розділу "Дизайн та графіка" є слово "графіка" - ось тут трохи шарю. І не більше. Так, часто питають.
Продам гараж

11

Re: наслідування в JS

Cyan написала:

Я зустрічала кілька варіантів і ніби кажуть, що з прототипами воно надійніше, тому я так і зробила.

про ООП в JS ще тут добре розписано(ну так на хлопський розум) http://javascript.ru/tutorial/object/inheritance.

але найкращий варіант, то це взяти любу бібліотеку на гітхабі і вникати в робочий код, адже не одне наслідування в JS, там ще всяких інших ніштяків багато.

(function(){
  console.log("called anonymously");
})()
Подякували: Cyan1

12

Re: наслідування в JS

CoffeeScript дійсно дуже полегшує життя, особливо, коли намагаєшся працювати у классичному ОО-стилі. Я дуже сильно відчув різницю коли працював над проектом: Бекенд - Rest API на Node.js + фронтенд на Ember.js. На фронтенді різниця була не дуже помітною, бо у Ембері є свій синтаксис для того, щоб код виглядав більш схожим на класичне ООП, але працювати з бекендом було одне задоволення.