Передовий досвід, орієнтований на об'єктивність JavaScript [зачинено]


251

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

Добре, я використовую об'єкти для побудови lib, але є кілька способів визначення речей у JS, що передбачають важливі наслідки в області застосування, управлінні пам'яттю, простором імен тощо. EG:

  • вживання varчи ні;
  • визначення речей у файлі або в (function(){...})()стилі jquery;
  • вживання thisчи ні;
  • використання function myname()або myname = function();
  • визначення методів в тілі об’єкта або використання «прототипу»;
  • тощо.

То які насправді найкращі практики кодування OO в JS?

Тут дійсно очікуються академічні пояснення. Посилання на книги щиро вітаються, якщо вони мають справу з якістю та надійністю.

Редагувати:

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


2
Можливо, «за об’єктом орієнтований» слід замінити на «сучасний».
viam0Zah

43
Гммм, 79 відгуків, 82 фаворитів, 91 відгуків на відповідь ... все ж це було закрито як неконструктивне ... чому ??
Бретт Россьє

1
Я написав простий клас, що передає функції C ++ OOP в javascript з простим і природним синтаксисом. Дивіться моя відповідь тут: stackoverflow.com/a/18239463/1115652

14
Цей тип питань завжди закривається. Я розумію причини цього, але оскільки вони важливі питання, і вони завжди популярні (а оскільки я завжди знаходжу їх, коли у мене є подібне питання), мені цікаво, чи хтось може направити нас на належне місце для їх запитання?
KP MacGregor

2
@BrettRossier Яка користь від влади, якщо ти не володієш нею? ТАК це жива демонстрація того, як працює демократичний пекінський порядок. Напевно, деякі психологи розглядають це ...

Відповіді:


288

Використання `var` чи ні

Вам слід ввести будь-яку змінну з varтвердженням, інакше вона потрапить до глобальної сфери.

Варто зазначити, що в суворому режимі ( "use strict";) незадекларовані змінні задачі кидаютьReferenceError .

В даний час JavaScript не має області блоку. Школа Крокфорда вчить вас ставити заяви var на початку функції функції , тоді як Довідник стилю Доджо читає, що всі змінні повинні бути оголошені в найменшому обсязі . ( letЗаява та визначення, введені в JavaScript 1.7, не є частиною стандарту ECMAScript.)

Доброю практикою є зв'язування властивостей об'єктів, які регулярно використовуються, до локальних змінних, оскільки це швидше, ніж пошук по всьому ланцюгу областей. (Див. Розділ Оптимізація JavaScript для надзвичайної продуктивності та низького споживання пам’яті .)

Визначення речей у файлі чи у `(function () {...}) ()`

Якщо вам не потрібно дотягуватись до своїх об'єктів за межами коду, ви можете загортати весь код у вираз функції - - це називається шаблон модуля. Він має переваги щодо продуктивності, а також дозволяє мінімізувати та затемняти ваш код на високому рівні. Ви також можете переконатися, що він не забруднить глобальний простір імен. Функції загортання в JavaScript також дозволяють додати орієнтовану на аспекти поведінку. У Бен Черрі є поглиблена стаття про модель модуля .

Використання "цього" чи ні

Якщо ви використовуєте псевдокласичне успадкування в JavaScript, навряд чи уникнете використання this. Справа в смаку, який шаблон спадкування ви використовуєте. В інших випадках перегляньте статтю Пітера Мішо про віджети JavaScript без "цього" .

Використання `function myname ()` або `myname = function ();`

function myname()є оголошенням функції та myname = function();виразом функції, присвоєним змінній myname. Остання форма вказує на те, що функції є першокласними об'єктами, і ви можете робити з ними що завгодно, як зі змінною. Єдина відмінність між ними полягає в тому, що всі декларації функцій піднімаються до верхньої частини області, що може мати значення в певних випадках. Інакше вони рівні. function foo()є скороченою формою. Більш детальну інформацію про вантажопідйомні пристрої можна знайти в статті Оцінка та піднімання JavaScript .

Визначення методів в тілі об'єкта або використання "прототипу"

Тобі вирішувати. У JavaScript є чотири шаблони створення об'єктів: псевдокласична, прототипічна, функціональна та частини ( Crockford, 2008 ). У кожного є свої плюси і мінуси, перегляньте Крокфорд у своїх відео-переговорах або отримайте його книгу «Гарні частини», як вже запропонував Анон .

Каркаси

Я пропоную вам підібрати деякі рамки JavaScript, вивчити їх умовності та стиль та знайти ті практики та зразки, які найкраще підходять вам. Наприклад, інструментарій Dojo пропонує надійну основу для написання об'єктно-орієнтованого коду JavaScript, який навіть підтримує багатократне успадкування.

Візерунки

Нарешті, є блог, присвячений вивченню загальних моделей JavaScript та анти-шаблонів . Також ознайомтеся з питанням Чи існують стандарти кодування для JavaScript? у стеку переповнення.


1
"У JavaScript є чотири шаблони створення об'єктів: псевдокласична, прототипічна, функціональна та частини" - я дуже вдячний підсумком плюсів і мінусів.
BadHorsie

2
" letЗаява та визначення, введені в JavaScript 1.7, не є частиною стандарту ECMAScript." Тепер це частина ES6.
Michał Perłakowski

13

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

Використання вар

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

У об'єкті зробіть змінну приватною. Якщо ви хочете просто оголосити загальнодоступну змінну, використовуйте this.my_var = my_valueце.

Способи декларування

У JS - це численні способи декларування. Для програміста ОО найбільш природний і в той же час ефективний спосіб - використовувати наступний синтаксис:

Всередині тіла об'єкта

this.methodName = function(param) {

/* bla */

};

Є недолік: внутрішні функції не зможуть отримати доступ до "цього" через забавну сферу JS. Дуглас Крокфорд рекомендує обійти це обмеження, використовуючи звичайну локальну змінну під назвою "що". Так стає

function MyObject() {

    var that = this;

    this.myMethod = function() {

        jQuery.doSomethingCrazy(that.callbackMethod);

    };

};

Не покладайтеся на автоматичний кінець рядка

JS намагається автоматично додати ;в кінці рядка, якщо ви забудете його. Не покладайтеся на таку поведінку, оскільки ви отримаєте помилки, які можуть заплутатись налагодження.


8

Спершу слід прочитати про програмування на основі прототипу, щоб ви знали, з яким звіром ви маєте справу, а потім перегляньте посібник зі стилю JavaScript на MDC та JavaScript на сторінці MDC . Я також вважаю найкращим, щоб змусити якість коду інструментом, тобто. JavaScript Lint або інші варіанти.

Передовий досвід роботи з OO звучить більше, як ви хочете знайти шаблони, ніж концентруватися на якості коду, тому подивіться на пошук Google: шаблони javascript та jQuery .


5

Ви можете перевірити секрети JavaScript Ninja від John Resig (jQuery). "Ця книга призначена для того, щоб взяти проміжного розробника JavaScript і дати йому необхідні знання, щоб створити бібліотеку JavaScript з перехресним браузером, з першої точки".

Проект доступний через видавця: http://www.manning.com/resig/

Дуглас Крокфорд також має приємні статті JavaScript на своїй домашній сторінці: http://www.crockford.com/


5

Я часто відчуваю себе єдиним хлопцем тут, який використовує MooTools для мого javascript.

Він означає M y O bject O riented Tools, mootools.

Мені дуже подобається, що вони взяли на себе OOP в JavaScript. Ви можете використовувати їхню реалізацію класу разом із jquery, тому вам не доведеться кидати jquery (хоча mootools робить це все так само добре).

У будь-якому випадку, прочитайте перше посилання, і прочитайте, що ви думаєте, друге посилання - на документи mootools.

MooTools & Inheritance

Класи MooTools


Я не намагаюся зігнути мову, щоб вона відповідала тобі старовинному хабіту - це добре. Це так, як це люди в C, використовуючи # для заміни, це виглядає як fortran, або ще. Я думаю, вам слід спробувати вивчити, як працює мова (та її найкращі практики), і використовувати її так, щоб вас не заважати занадто сильно. Але насправді не змінювати її
e-satis

2
Я думаю, що об'єктна система MooTools є досить елегантною і справді допомагає мені організовувати / інкапсулювати код.
awesomo

0

Дякую, але я не шукаю основи. Я можу кодувати (брудно) JS, який можна керувати Або принаймні більшу частину часу :-) Мені потрібні вказівки, щоб написати той самий код, але правильно.
e-satis
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.