Даведнік па JavaScript

Карысныя спасылкі

Блог і рэсурсы на JavaScript.com: JavaScript.com

JSbooks, збор спасылак на вольныя кнігі па JavaScript: jsbooks.revolunet.com

You Don't Know JS, шэраг вольных кнігаў па JavaScript: https://github.com/getify/You-Dont-Know-JS

Комплексная дакумэнтацыя

JavaScript на MDN: https://developer.mozilla.org/en/JavaScript

AJAX на MDN: https://developer.mozilla.org/en/Ajax

«Learn JavaScript» на MDN: https://developer.mozilla.org/en-US/learn/javascript

Даведнікі і кнігі

Даведнік на MDN: https://developer.mozilla.org/en/JavaScript/Guide

«JavaScript Garden»: http://bonsaiden.github.com/JavaScript-Garden

Інтэрактыўныя шпаргалкі на OverAPI: http://overapi.com/javascript/ і http://overapi.com/jquery/

«Learning JavaScript Design Patterns»: http://addyosmani.com/resources/essentialjsdesignpatterns/book

«Eloquent JavaScript»: http://eloquentjavascript.net/

JavaScript: The Definitive Guide. Activate Your Web Pages (шостае выданьне вядомай папяровай кнігі, напісанай Дэвідам Флэнэгэнам ад выдавецтва O'Reilly – на мой погляд лепшая крыніца, з тых што мне трапляліся, паглыбленага вывучэньня JavaScript, але на жаль электроннага варыянту няма ў вольным доступе). Ці перакладзенае на расейскую мову выданьне гэтай кнігі: ozon.ru.

Урокі

Інтэрактыўныя ўрокі для пачаткоўцаў на CodeCademy.com: http://www.codecademy.com/courses/javascript-intro

Інтэрактыўныя ўрокі для розных узроўняў на CodeSchool.com: https://www.codeschool.com/paths/javascript

Сэрыя відэа-ўрокаў «JavaScript з нуля» на Tuts+: http://code.tutsplus.com/series/javascript-from-null--net-35330

Бясплатны 30-дзённы відэа-курс па jQuery на Tuts+ Premium: http://tutsplus.com/course/30-days-to-learn-jquery/

Блогі

Разьдзел JavaScript на SmashingMagazine.com: http://coding.smashingmagazine.com/tag/javascript

Разьдзелы JavaScript & AJAX на Net.Tuts+: JavaScript і AJAX

Рознае

Калекцыя артыкулаў, кніг і відэа на тэму стварэньня, тэставаньня і падтрымкі вялікага коду на JavaScript: superherojs.com

Крыніца, якая тлумачыць, як той ці іншы код на jQuery напісаць на чыстым JavaScript: YOU MIGHT NOT NEED JQUERY

PlainJS.com – прыклады коду на чыстым JavaScript без неабходнасьці прыцягваць дадаткі.

You-Dont-Need-Javascript – прыклады коду на чыстым CSS без неабходнасьці ўжываць JavaScript.

You might not need JavaScript – прыклады коду на чыстым CSS без неабходнасьці ўжываць JavaScript.

Агляд

Што такое JavaScript?

JavaScript – гэта міжплатформавая, аб'ектна-арыентаваная, кампактная мова праграмаваньня, якая прызначана як для самастойнага ўжываньня, так і для ўбудаваньня ў браўзэр.

Ядро JavaScript утрымлівае стандартныя тыпы, базавыя аб'екты, такія, як Array, Date, Math і набор базавых элемэнтаў мовы, такіх, як апэрацыі і інструкцыі. Ядро мовы можа быць пашырана шляхам дадаваньня новых аб'ектаў.

JavaScript быў створаны інжынэрам карпарацыі Netscape Брэнданам Айкам у 1995 годзе, і выдадзены як складнік Netscape 2 на пачатку 1996 году. Першапачаткова плянавалася яго назваць LiveScript, але ў выніку дзіўнага маркетынгавага кроку, спрабуючы скарыстацца папулярнасьцю мовы Java, быў пераназваны ў JavaScript. Нягледзячы на тое, што ў гэтых дзьвюх мовах ня вельмі шмат агульнага. Падабенства назваў гэтых моваў дагэтуль шмат каго бянтэжыць.

JavaScript і Java

JavaScript і Java падобныя ў некаторых аспэктах, але фундамэнтальна адрозьніваюцца ў іншых. Напрыклад, JavaScript ня мае статычнага тыпаваньня і строгай праверкі тыпаў, як у Java, але пры гэтым вельмі падобны на яго сынтакс выразаў і інструкцыяў.

У адрозьненьні ад Java у JavaScript адбываецца дынамічнае вызначэньне тыпаў зьменных – у часе выкананьня праграмы, а не загадзя. У JavaScript выкарыстоўваецца прататыпная аб'ектная мадэль у адрозьненьні ад Java, дзе выкарыстоўваецца больш звыклая для аб'ектна-арыентаваных моваў клясавая аб'ектная мадэль. У JavaScript зьменным можна прысвойваць функцыі, а таксама апошнія могуць быць парамэтрамі аб'ектаў.

Форма ўжываньня JavaScript больш вольная, чым у Java. Ня трэба загадзя і строга вызначаць усе зьменныя, клясы, мэтады. Ня трэба вызначаць ці пэўны мэтад зьяўляецца public, private, альбо protected. Ня трэба рэалізоўваць інтэрфэйсы і вызначаць тыпы зьменных, парамэтраў і вяртаемых мэтадамі значэньняў.

Больш падрабязна пра розьніцу паміж JavaScript і Java, а таксама пра аб'ектную мадэль у JavaScript глядзіце разьдзел «Аб'ектная мадэль».

JavaScript і ECMAScript

Ecma International працуе над стандартаванай вэрсіяй JavaScript, якая завецца ECMAScript. Стандарт ECMAScript задакумэнтаваны ў спэцыфікацыі ECMA-262 (ISO-16262), першая рэдакцыя якой (па-анг. Edition 1), была зроблена на аснове JavaScript вэрсіі 1.1 (Netscape Navigator 3.0).

Суадносіны паміж вэрсіямі *JavaScript* і *ECMAScript*, і якімі браўзэрамі яны падтрымліваюцца ¹
Вэрсія JavaScript	Дата	Адпавядае вэрсіі ECMAScript	Netscape	Mozilla Firefox	Internet Explorer	Opera	Safari	Google Chrome
1.1	Жнівень 1996 г.	Edition 1	Navigator 3.0
1.2	Чэрвень 1997 г.		Navigator 4.0–4.05
1.3	Кастрычнік 1998 г.	Edition 1	Navigator 4.06–4.7x		4.0
1.4		Edition 1	Server
1.5	Лістапад 2000 г.	Edition 3	Navigator 6.0	1.0	5.5–8	6.0	3.0–5	1.0–10.0.666
1.6	Лістапад 2005 г.	Edition 3 + пашыраныя магчымасьці		1.5
1.7	Кастрычнік 2006 г.	Edition 3 + пашыраныя магчымасьці		2.0				28.0.1500.95
1.8	Чэрвень 2008 г.	Edition 3 + пашыраныя магчымасьці		3.0		11.50
1.8.1		Edition 3 + пашыраныя магчымасьці		3.5
1.8.2	Чэрвень 2009 г.	Edition 3 + пашыраныя магчымасьці		3.6
1.8.5	Ліпень 2010 г.	Edition 5		4	9	11.60	6.00
	Чэрвень 2011 г.	Edition 5.1
	Чэрвень 2015 г.	Edition 6 альбо проста ES6
	У распрацоўцы	Edition 7 альбо проста ES7

Лексычная структура

Лексычная структура мовы праграмаваньня – гэта набор элемэнтарных правілаў, якія вызначаюць якім чынам пішуцца праграмы на гэтай мове. Яна вызначае від імёнаў зьменных, сымбалі, якія выкарыстоўваюцца для пазначэньня камэнтароў, як інструкцыі аддзяляюцца адна ад другой і іншае.

Набор сымбаляў

Пры напісаньні праграмаў JavaScript выкарыстоўваецца набор сымбаляў Unicode. Гэтая 16-разрадная кадоўка забясьпечвае прадстаўленьне амаль усіх пісьмовых моваў.

Адчувальнасьць да рэгістру

JavaScript – адчувальная да рэгістру мова праграмаваньня. Гэта значыць, што ключавыя словы, зьменныя, імёны функцыяў і іншыя ідэнтыфікатары заўсёды павінны ўтрымліваць аднолькавыя наборы малых і вялікіх літараў. Напрыклад, ключавое слова while павінна заўсёды набірацца як «while», а не «While» альбо «WHILE». Аналягічна bar, Bar і BAR – гэта імёны трох розных зьменных.

Сымбалі-падзяляльнікі і пераводы радкоў

JavaScript ігнаруе прагалы, знакі табулятара і пераводы радкоў, якія прысутнічаюць паміж лексэмамі праграмы. Таму іх можна зьмяшчаць у праграме без абмежаваньняў для фарматаваньня і наданьня праграме зручнага для чытаньня выгляду.

Неабавязковыя кропка з коскай

У канцы інструкцыяў ў JavaScript звычайна зьмяшчаецца кропка з коскай. Абавязковымі яны зьяўляюцца, калі некалькі інструкцыяў месьцяцца на адным радку, для падзелу паміж імі. Калі ж кожная інструкцыя зьмяшчаецца на асобным радку, кропка з коскай не абавязковыя:

Пры гэтым, трэба заўважыць, што адзнакай добрага густу зьяўляецца яўнае пазначэньне кропкі з коскай заўсёды. Пры такім падыходзе амаль выключаецца, што сынтаксычны аналізатар JavaScript вас няправільна зразумее.

Камэнтары

JavaScript падтрымлівае як шматрадковы C-падобны камэнтар, у якім увесь тэкст паміж сымбалямі /* і */ разглядаецца як камэнтар. Так і аднарадковы С++-падобны камэнтар, у якім тэкст паміж сымбалямі // і канцом радка разглядаецца як камэнтар. Ніжэй прыведзены карэктныя JavaScript-камэнтары:

Літаралы

Літаралы (элемэнтарныя значэньні) – гэта фіксаваныя значэньні, якія вы наўпрост (літаральна) прадстаўляеце праграме, то бок без ужываньня зьменных, канстантаў, выклікаў функцыяў і інш. Прыклады літаралаў:

Ідэнтыфікатары

Ідэнтыфікатары – гэта імёны зьменных, канстантаў і функцыяў. Першым сымбалем ідэнтыфікатараў могуць быць літара альбо знак падкрэсьліваньня, а наступнымі сымбалямі ў дадатак да першых могуць быць яшчэ лічбы. Прыклады ідэнтыфікатараў:

Але ідэнтыфікатары ня могуць супадаць з ключавымі словамі JavaScript, якія зарэзэрваваныя для адмысловых мэтаў.

Ключавыя словы

У JavaScript маецца шэраг ключавых словаў, якія зарэзэрваваныя для адмысловых мэтаў і ня могуць выкарыстоўвацца ў якасьці ідэнтыфікатараў:

Ключавыя словы
`break`	`else`	`instanceof`	`true`
`case`	`false`	`new`	`try`
`catch`	`finally`	`null`	`typeof`
`continue`	`for`	`return`	`var`
`default`	`function`	`switch`	`void`
`delete`	`if`	`this`	`while`
`do`	`in`	`throw`	`with`

Таксама маецца шэраг словаў, якія ў дадзены момант ядром мовы не выкарыстоўваюцца, але зарэзэрваваныя для магчымага будучага выкарыстаньня вэрсіяй ECMAScript Edition 3:

Словы, зарэзэрваваныя для будучага выкарыстаньня
`abstract`	`double`	`goto`	`native`	`static`
`boolean`	`enum`	`implements`	`package`	`super`
`byte`	`export`	`import`	`private`	`synchronized`
`char`	`extends`	`int`	`protected`	`throws`
`class`	`final`	`interface`	`public`	`transient`
`const`	`float`	`long`	`short`	`volatile`
`debugger`

Акрамя гэтага, варта пазьбягаць ужываньня ідэнтыфікатараў, супадаючых з імёнамі глябальных зьменных ці функцыяў, якія прадвызначаны у JavaScript. У адваротным выпадку гэта можа прывесьці да памылак (калі атрыбут вызначаны як даступны толькі для чытаньня), альбо да непрадказальных вынікаў. У табліцы ніжэй прыведзеныя імёны такіх глябальных зьменных і функцыяў, якія вызначаны вэрсіяй ECMAScript Edition 3:

Глябальныя зьменныя і функцыі
`arguments`	`encodeURI`	`Infinity`	`Object`	`String`
`Array`	`Error`	`isFinite`	`parseFloat`	`SyntaxError`
`Boolean`	`escape`	`isNaN`	`parseInt`	`TypeError`
`Date`	`eval`	`Math`	`RangeError`	`undefined`
`decodeURI`	`EvalError`	`NaN`	`ReferenceError`	`unescape`
`decodeURIcomponent`	`Function`	`Number`	`RegExp`	`URIError`

Тыпы даных, значэньні і зьменныя

Тыпы значэньняў, якія могуць быць прадстаўлены і апрацаваны ў мове праграмаваньня, вядомы як тыпы даных, і адной з фундамэнтальных характарыстыкаў любой мовы праграмаваньня зьяўляецца набор тыпаў даных, якія ёю падтрымліваюцца. JavaScript дазваляе працаваць з трыма элемэнтарнымі тыпамі даных: лікамі, сымбальнымі чародамі і лягічнымі значэньнямі. Таксама маецца 2 адмысловых элемэнтарных значэньня: null і undefined.

У дадатак да гэтых элемэнтарных тыпаў JavaScript падтрымлівае састаўны тып, вядомы як аб'ект. Аб'ект уяўляе зь сябе калекцыю значэньняў (альбо элемэнтарных, альбо іншых аб'ектаў). Гэта можа быць неўпарадкаваная калекцыя іменных, альбо ўпарадкаваныя калекцыя безназоўных, але пранумараваных значэньняў. У апошнім выпадку аб'ект называецца масівам.

Таксама маецца яшчэ адзін адмысловы аб'ект – функцыя. Гэта аб'ект, зь якім злучаны код. Адпаведна, функцыя можа выклікацца для выкананьня гэтага коду.

Акрамя масіваў і функцыяў у ядры мовы вызначана яшчэ шэраг адмысловых аб'ектаў. Яны ўяўляюць зь сябе не дадатковыя тыпы даных, але толькі новыя клясы аб'ектаў:

Date – аб'екты, якія прадстаўляюць даты;
Error – аб'екты, якія прадстаўляюць памылкі сынтаксісу і часу выкананьня;
RegExp – аб'екты, якія прадстаўляюць рэгулярныя выразы;
Math – дапаможны аб'ект для выкананьня арытмэтычных апэрацыяў.
Boolean, Number, String – аб'екты-абгорткі элемэнтарных значэньняў.

Аб'екты-абгорткі

Перад тым, як перайсьці непасрэдна да тыпаў даных, спынімся спачатку на аб'ектах-абгортках. Напрыклад, разгледзім тыповую апэрацыю з сымбальнымі чародамі:

Можа падацца, што s – гэта аб'ект і мы выклікаем яго мэтады і зьвяртаемся да яго атрыбутаў. Аднак гэта ня так, s – гэта элемэнтарная сымбальная чарада. Чаму ж тады ў вышэйпрыведзеным прыкладзе выкарыстоўваецца аб'ектная натацыя?

Справа ў тым, што для кожнага з трох элемэнтарных тыпаў даных вызначаны адпаведны аб'ект-абгортка. Для лікаў гэта аб'ект Number, для сымбальных чародаў – String, для лягічных значэньняў – Boolean. Гэтыя абгорткі ўтрымліваюць тое ж самае значэньне элемэнтарных тыпаў, якое абгортваюць, але дадаткова вызначаюць атрыбуты і мэтады, якія могуць выкарыстоўвацца для маніпуляцыяў з гэтым элемэнтарным значэньнем.

JavaScript можа гнутка пераўтвараць адзін тып у іншы. Калі мы выкарыстоўваем чараду ў аб'ектным кантэксьце, то бок калі спрабуем зьвярнуцца да атрыбуту ці мэтаду чарады, JavaScript стварае ўнутры сябе аб'ект-абгортку для гэтай чарады. Менавіта гэты аб'ект забясьпечвае зьвяртаньне да сваіх атрыбутаў і мэтадаў, таксама ён часовы і будзе ўтылізаваны сыстэмай, як толькі патрэба ў ім адпадзе. Напрыклад:

Тут s застаецца сымбальнай чарадой. Ствараецца часовы аб'ект String, які дазволіць зьвярнуцца да атрыбуту length, а затым будзе ўтылізаваны, ніякім чынам не зьмяніўшы сыходнае значэньне зьменнай s.

Аб'екты-абгорткі можна ствараць і яўным чынам пры дапамозе апэратару new:

Аўтаматычнае пераўтварэньне чародаў у аб'екты String мае і зваротны напрамак – аб'екты String там, дзе патрэбна, аўтаматычна будуць пераўтвораны ў адпаведныя сымбальныя чароды.

Напрыканцы адзначым, што любыя чароды, лікі ці лягічныя значэньні могуць быць пераўтвораны ў адпаведны аб'ект-абгортку з дапамогай канструктару Object():

Лікі

re-Introduction

У JavaScript усе лікі (і цэлыя, і рэчаісныя) прадстаўляюцца адно праз 64-бітавыя рэчаісныя значэньні падвойнай дакладнасьці ў фармаце, вызначаным стандартам IEEE 754. Гэты фармат здольны прадстаўляць лікі ў дыяпазоне ад ±1,7976931348623157×10³⁰⁸ да ±5×10^-324. У JavaScript існуе базавы аб'ект-абгортка для лікаў: Number. Лік, які ўтрымліваецца наўпрост у кодзе JavaScript-праграмы, называецца лікавым літаралам.

Цэлыя літаралы

Guide

Цэлыя дзесятковыя лікі запісваюцца як пасьлядоўнасьць лічбаў:

Лікавы фармат JavaScript дазваляе дакладна прадстаўляць усе цэлыя лікі ў дыяпазоне ад –9 007 199 254 740 992 (–2⁵³) да 9 007 199 254 740 992 (2⁵³) уключна. Для цэлых значэньняў па-за гэтым дыяпазонам можа губляцца дакладнасьць для малодшых разрадаў. Варта таксама адзначыць, што некаторыя цэлыя апэрацыі ў JavaScript (напрыклад пабітавыя апэрацыі) выконваюцца з 32-разраднымі цэлымі, якія прымаюць значэньні ў дыяпазоне ад –2 147 483 648 (–2³¹) да 2 147 483 647 (2³¹–1)

Акрамя дзесятковай формы цэлыя можна яшчэ запісваць у шаснаццацірычнай – сымбалі 0x ці 0X, за якімі ідзе пасьлядоўнасьць шаснаццацірычных лічбаў:

Некаторыя рэалізацыі JavaScript падтрымліваюць і васьмірычную форму запісу цэлых лікаў. Але ўжываць яе не пажадана, таму што гэта прывядзе да нечаканых вынікаў на рэалізацыях JavaScript, якія такую форму не падтрымліваюць.

Рэчаісныя літаралы

Guide

Рэчаісны лік можа ўтрымліваць наступныя часткі:

дзесятковую цэлую частку (пасьлядоўнасьць дзесятковых лічбаў), перад якой можа стаяць знак + ці -;
рэчаісную кропку;
фракцыю (пасьлядоўнасьць дзесятковых лічбаў);
экспанэнту (сымбаль e ці E, за якім можа стаяць знак + ці -, і пасьлядоўнасьць дзесятковых лічбаў).

Рэчаісны літарал абавязкова павінен утрымліваць прынамсі адну лічбу і альбо рэчаісную кропку, альбо экспанэнту. Схематычна фармат рэчаісных літаралаў можа прадставіць наступным чынам:

Прыклады рэчаісных літаралаў:

Аб'ект-абгортка

Для лікавых элемэнтарных значэньняў існуе аб'ект-абгортка Number.

Атрыбуты

Аб'ект Number утрымлівае лікавыя канстанты для прадстаўленьня мінімальных і максымальных значэньняў, ня-лікаў і бясконцасьцяў:

MAX_VALUE – найбольшы дадатны лік, які можа быць прадстаўлены ў JavaScript (прыкладна 1,79e+308). Значэньні, большыя за гэтае, будуць прадстаўленыя як дадатная бясконцасьць. Найменшы адмоўны лік, які можа быць прадстаўлены,– гэта -MAX_VALUE. Значэньні, меншыя за гэтае, будуць прадстаўленыя як адмоўная бясконцасьць.
MIN_VALUE – найменшы але ня роўны 0 дадатны лік, які можа быць прадстаўлены ў JavaScript (прыкладна 5e-324). Значэньні, меншыя за гэтае, будуць прадстаўленыя як 0. Найбольшы адмоўны лік, які можа быць прадстаўлены,– гэта -MIN_VALUE.
POSITIVE_INFINITY – адмысловае значэньне, якое прадстаўляе дадатную бясконцасьць, якая ўтвараецца пры перапаўненьні (пры перавышэньні максымальна магчымага значэньня).
NEGATIVE_INFINITY – адмысловае значэньне, якое прадстаўляе адмоўную бясконцасьць, якая ўтвараецца пры перапаўненьні (значэньні менш мінімальна магчымага адмоўнага).
NaN – адмысловае значэньне «ня-лік», якое прадстаўляе, напрыклад, вынікі некарэктных арытмэтычных апэрацыяў (як то дзяленьне на нуль ²). Тое ж самае, што і базавы аб'ект NaN.

Прыклады

Доступ да гэтых значэньняў адбываецца заўсёды цераз прадвызначаны глябальны аб'ект Number як у прыкладзе ніжэй, а не праз аб'екты Number, якія вы ствараеце самі:

Мэтады

Таксама прататып аб'екта (магчыма ўдакладніць спасылку да даччынага разьдзелу) Number вызначае шэраг мэтадаў, якія даступны да ўсіх аб'ектаў Number:

toExponential – вяртае сымбальную чараду, якая прадстаўляе дадзены лік, у экспанэнцыяльнай натацыі. У якасьці парамэтру можа перадавацца колькасьць лічбаў пасьля рэчаіснай кропкі. Калі парамэтар не пазначаны, будзе адлюстравана столькі лічбаў пасьля рэчаіснай кропкі, колькі патрэбна. Прыклады:

toFixed – вяртае сымбальную чараду, якая прадстаўляе дадзены лік, у натацыі з фіксаванай кропкай. У якасьці парамэтру можа перадавацца колькасьць лічбаў пасьля рэчаіснай кропкі (ад 0 да 20). Калі парамэтар не пазначаны, лічбы пасьля рэчаіснай кропкі будуць адкінутыя ўвогуле. Прыклады:

toLocaleString – вяртае сымбальную чараду, якая прадстаўляе дадзены лік, з улікам лякальных асаблівасьцяў. Прыклад:

toPrecision – вяртае сымбальную чараду, якая прадстаўляе дадзены лік, альбо ў экспанэнцыяльнай натацыі, альбо ў натацыі з фіксаванай кропкай у залежнасьці ад неабходнай дакладнасьці. У якасьці парамэтру можа перадавацца неабходная дакладнасьць – колькасьць вартасных лічбаў. Калі парамэтар не пазначаны, мэтад вядзе сябе гэтак сама, як мэтад toString. Калі ў якасьці парамэтру будзе ўжыта ня цэлае значэньне, яно будзе акруглена. Пасьля агругленьня, калі значэньне парамэтру будзе выходзіць за межы дыяпазону ад 1 да 100, будзе згенэравана RangeError. Прыклады:

toString – вяртае сымбальнае прадстаўленьне дадзенага ліку. У якасьці парамэтру можа перадавацца базіс ліку для адлюстраваньня (ад 2 да 36). Калі парамэтар не пазначаны, бярэцца базіс 10. Калі парамэтар знаходзіцца па-за межамі дыяпазону ад 2 да 36, будзе згенэравана памылка. Прыклады:

valueOf – вяртае прымітыўнае лікавае прадстаўленьне дадзенага лікавага аб'екта.

Аб'ект `NaN`

Reference

² Трэба заўважыць, што вынікам Number.NaN будзе толькі дзяленьне 0/0, а, напрыклад, 1/0 верне дадатную бясконцасьць.

Акрамя аб'екта-абгортцы існуе адмысловы аб'ект для прадстаўленьня некарэктных лікавых значэньняў, – напрыклад, вынік дзяленьня на нуль ². Тое ж самае, што і Number.NaN.

Праца з лікамі

Для выкананьня арытмэтычных дзеяў над лікамі ў JavaScript існуюць арытмэтычныя апэрацыі: + для складаньня, - для адніманьня, * для памнажэньня, / для дзяленьня і % для вызначэньня астачы цэлалікавага дзяленьня.

Аб'ект `Math`

Акрамя арытмэтычных апэрацыяў JavaScript падтрымлівае выкананьне болей складаных матэматычных апэрацыяў пры дапамозе вялікай колькасьці матэматычных функцыяў. Для зручнасьці гэтыя функцыі сабраныя ў адзін дапаможны аб'ект Math.

Атрыбуты

E – аснова натуральнага лягарытму (прыкладна 2,718).
LN2 – натуральны лягарытм 2 (прыкладна 0,693).
LN10 – натуральны лягарытм 10 (прыкладна 2,303).
LOG2E – лягарытм E па аснове 2 (прыкладна 1,442).
LOG10E – лягарытм E па аснове 10 (прыкладна 0,434).
PI – значэньне π (прыкладна 3,14159).
SQRT1_2 – квадратны корань 1/2 (прыкладна 0,707).
SQRT2 – квадратны корань 2 (прыкладна 1,414).

Мэтады

Мэтад(-ы)	Апісаньне	Прыклад
`abs`	Вяртае абсалютнае значэньне аргумэнту.	`Math.abs(-5); //=> 5`
`acos` `asin` `atan` `atan2`	Зваротныя трыганамэтрычныя функцыі. Вяртаюць значэньні ў радыянах.	`Math.acos(1); //=> 3.141592653589793`
`ceil`	Вяртае найменшы цэлы лік, большы ці роўны аргумэнту.	`Math.ceil(45.25); //=> 46` `Math.ceil(-45.25); //=> -45`
`cos` `sin` `tan`	Прамыя трыганамэтрычныя функцыі. Вяртаюць значэньні ў радыянах.	`Math.cos(Math.PI); //=> -1`
`exp`	Падвышае значэньне `E` да перададзенай ступені.	`Math.exp(2); //=> 7.389`
`floor`	Вяртае найбольшы цэлы лік, меншы ці роўны аргумэнту.	`Math.ceil(45.95); //=> 45` `Math.ceil(-45.95); //=> -46`
`log`	Вяртае значэньне натуральнага лягарытму ад аргумэнту.	`Math.log(10); //=> 2.302585092994046` `Math.log(0); //=> -Infinity` `Math.log(-1); //=> NaN` `Math.log(100)/Math.LN10 // log₁₀(100)`
`max` `min`	Вяртаюць адпаведна найбольшае й найменшае сярод сваіх аргумэнтаў (адвольная колькасьць).	`Math.min(1,3); //=> 1` `Math.max(1,8,3) //=> 8` `Math.min() //=> Infinity` `Math.max() //=> -Infinity` `Math.max(1, "a") //=> NaN`
`pow`	Вяртае значэньне першага свайго аргумэнту, падвышанае ў ступень другога свайго аргумэнту.	`Math.pow(7,2) //=> 49 (7²)`
`random`	Вяртае выпадковае рэчаіснае значэньне ў дыяпазоне ад 0 (уключна) да 1 (ня ўключна).
`round`	Вяртае бліжэйшае цэлае значэньне па правілам скругленьня.	`Math.round(25.49) //=> 25` `Math.round(25.5) //=> 26`
`sqrt`	Вяртае значэньне квадратнага кораню аргумэнту.	`Math.sqrt(9) //=> 3`

У дадатак да вышэйпералічаных мэтадаў разгледзім некалькі сытуацыяў, якія выходзяць за межы магчымасьцяў гэтых мэтадаў, але зьяўляюцца даволі распаўсюджанымі.

Па-першае, лягарытмы адвольных значэньняў па аснове 2 і 10.

Далей, каб атрымаць выпадковае рэчаіснае значэньне ў адвольным дыяпазоне можна скарыстацца ўласнай функцыяй:

Каб атрымаць выпадковае цэлае значэньне ў адвольным дыяпазоне можна скарыстацца наступнай функцыяй:

Утварэньне з чародаў

Для пераўтварэньня сымбальных чародаў у лікі існуюць дапаможныя функцыі верхняга ўзроўню: parseInt і parseFloat, для цэлых і рэчаісных лікаў адпаведна. Напрыклад, вынікам усіх наступных выразаў будзе рэчаісны лік 3,14:

А наступны прыклад верне NaN:

Вынікам усіх наступных выразаў будзе цэлы лік 15:

Наступныя прыклады вернуць NaN:

Праверкі

Для праверкі ці зьяўляецца пэўнае значэньне лікам існуе функцыя isNaN, таксама верхняга ўзроўню. Гэтую функцыю трэба выкарыстоўваць з пэўнай асьцярогай, асабліва, калі правяраемым значэньнем можа быць ня лік – у гэтым выпадку значэньне будзе спачатку пераўтворана ў лік, які ўжо ў сваю чаргу будзе пераданы ў функцыю:

Для праверкі ці зьяўляецца значэньне пэўным лікам (не бясконцасьцю) існуе функцыя верхняга ўзроўню isFinite. Калі ў якасьці аргумэнту ёй перададзеныя NaN, дадатная ці адмоўная бясконцасьць, яна верне false, у астатніх выпадках – true.

Сымбальныя чароды

re-Introduction

Сымбальная чарада ўяўляе зь сябе пасьлядоўнасьць літар, лічбаў, знакаў пунктуацыі і іншых Unicode-сымбаляў і зьяўляецца тыпам даных JavaScript для прадстаўленьня тэкстаў. Зьвярніце ўвагу, што ў JavaScript няма сымбальнага тыпу даных, як char у мовах праграмаваньня C, C++ альбо Java. Адзінкавы сымбаль прадстаўляецца праз чараду адзінкавай даўжыні.

Літаралы

Guide

Сымбальныя літаралы ў JavaScript – гэта пасьлядоўнасьці з 0 ці больш Unicode-сымбаляў (у кадоўцы UTF-16), зьмешчаная паміж двума знакамі апострафа альбо двукосься. Большая колькасьць Unicode-сымбаляў могуць быць прадстаўленыя пры дапамозе 16-бітавых значэньняў і, адпаведна, ім адпавядае адзін элемэнт чарады. Тым жа Unicode-сымбалям, якія ня могуць быць прадстаўленыя 16-бітавымі значэньнямі, адпавядаюць 2 пасьлядоўных элемэнта чарады (так званая «сурагатная пара»). Даўжынёй чарады зьяўляецца колькасьць 16-бітавых значэньняў, якія яна ўтрымлівае. Адпаведна, улічваючы папярэдняе правіла, даўжыня чарады можа не адпавядаць колькасьці Unicode-сымбаляў гэтай чарады.

Пустая чарада мае даўжыню 0. Доступ да сымбаляў чарады адбываецца пры дапамозе індэксу, пачынаючы з 0.

Для пазначэньня сымбальнай чарады ў праграме патрэбны тэкст абгортваецца двукосьсем ці адзіночнымі апострафамі. Пры гэтым у чарадзе, якая абгортваецца двукосьсем, могуць сустракацца сымбалі апострафаў. І, адпаведна, у чарадзе, якая абгортваецца апострафамі, могуць сустракацца сымбалі двукосься. Сымбальная чарада таксама можа ўтрымліваць escape-пасьлядоўнасьці, backslash за якім ідзе пэўны сымбаль, – для прадстаўленьня ня-тэкставых ці адмысловых сымбаляў, а таксама для прадстаўленьня любых сымбаляў праз іх Unicode-значэньне.

*escape*-пасьлядоўнасьці ў *JavaScript*
Пасьлядоўнасьць	Сымбаль, які прадстаўляецца
\O	NUL-сымбаль (\u0000)
\b	Backspace (\u0008)
\t	Гарызантальная табуляцыя (\u0009)
\n	Сымбаль новага радка (\u000A)
\v	Вертыкальная табуляцыя (\u000B)
\f	Form feed (\u000C)
\r	Сымбаль вяртаньня карэткі (\u000D)
\"	Сымбаль двукосься (\u0022)
\'	Апостраф (\u0027)
\\	Backslash (\u005C)
\xXX	Сымбаль з кадоўкі Latin-1, які прадстаўляецца двума 16-рычнымі лічбамі
\uXXXX	Unicode-сымбаль, які прадстаўляецца чатырма 16-рычнымі лічбамі

Аб'ект-абгортка

Для сымбальных чародаў існуе аб'ект-абгортка String. Для вызначэньня даўжыні чарады выкарыстоўваецца яго атрыбут length:

Акрамя вышэйазначанага атрыбуту маецца шчэ шэраг мэтадаў:

Праца з чародамі

Адной з убудаваных магчымасьцяў працы з чародамі ў дадатак да магчымасьцяў, якія прадстаўляе аб'ект-абгортка, зьяўляецца канкатэнацыя – аб'яднаньне двух чародаў:

Для параўнаньня чародаў ня трэба выкарыстоўваць адмысловыя функцыі (як у мовах C альбо Java), дастаткова скарыстацца апэрацыямі параўнаньня:

Пераўтварэньні ў лікі і наадварот

Лікі ў чароды і наадварот могуць пераўтварацца ядром мовы аўтаматычна ў залежнасьці ад кантэксту. У прыкладзе ніжэй лік будзе аўтаматычна пераўтвораны ў чараду:

А ў наступным прыкладзе чароды будуць аўтаматычна пераўтвораны ў лікі:

Лягічныя значэньні

re-Introduction

Лікавыя і сымбальныя тыпы даных маюць вялікую ці бясконцую колькасьць магчымых значэньняў. Лягічны тып даных, наадварот, мае толькі 2 магчымых значэньні, якія прадстаўляюцца літараламі true (праўда, ці ісьціна) і false (няпраўда). Лягічныя значэньні кажуць аб праўдзівасьці чаго-небудзь і ўяўляюць зь сябе звычайна вынік параўнаньня, напрыклад:

Гэты выраз правярае ці роўнае значэньне зьменнай x ліку 5. Калі так, тады вынікам гэтага параўнаньня будзе значэньне true. Калі зьменная x ня роўная 5, вынікам параўнаньня будзе значэньне false.

Лягічныя значэньні звычайна выкарыстоўваюцца ў інструкцыях, як if...else, які выконвае адно дзеяньне, калі лягічнае значэньне роўнае true, і іншае дзеяньне, калі лягічнае значэньне роўнае false:

Тут выконваецца праверка ці роўнае значэньне зьменнай a ліку 4. Калі так, тады да значэньня зьменнай b дадаецца 1, у адваротным выпадку 1 дадаецца да значэньня зьменнай a.

Аб'ект-абгортка

Для лягічных значэньняў, гэтаксама як і для лікаў з чародамі, існуе свой аб'ект-абгортка – Boolean. Ён утрымлівае толькі адзін атрыбут – value, які вяртае лягічнае значэньне абгорнутае аб'ектам.

Аб'ект Boolean трэба выкарыстоўваць з вялікай асьцярогай, напрыклад не выкарыстоўваць яго ў лягічных выразах (глядзі наступны разьдзел).

Пераўтварэньні лягічных значэньняў

Калі лягічнае значэньне выкарыстоўваецца ў лікавым кантэксьце, тады значэньне true пераўтвараецца ў лік 1, а false – у 0. Калі лягічнае значэньне выкарыстоўваецца ў сымбальным кантэксьце, тады значэньне true пераўтвараецца ў чараду "true", а false – у чараду "false".

Трэба заўважыць, што значэньні іншых тыпаў таксама могуць выкарыстоўвацца ў лягічным кантэксьце. Наступныя значэньні хаця і не зьяўляюцца лягічнымі інтэрпрэтуюцца як «няпраўда» (false):

0
NaN
"" (пустая чарада)
null
undefined

Усе астатнія значэньні будуць інтэрпрэтавацца як true. Заўважце, што аб'ект Boolean, які ўтрымлівае лягічнае значэньне false, не падпадае ані пад адно з пералічаных вышэй значэньняў, якія трактуюцца як false, таму будзе трактаваны як true.

Значэньне `null`

null – гэта ключавое слова ў JavaScript, якое пазначае адсутнасьць значэньня (напрыклад, у зьменнай, не важна элемэнтарнага ці аб'ектнага тыпу).

null – гэта нармальная альбо чаканая адсутнасьць значэньня ў зьменнай, у адрозьненьні ад undefined. Калі пэўную зьменную трэба абнуліць альбо перадаць у функцыю пустое значэньне, трэба скарыстацца менавіта значэньнем null.

Значэньне `undefined`

У JavaScript маецца яшчэ адно адмысловае значэньне undefined, якое таксама пазначае адсутнасьць значэньня, але гэта яшчэ больш глыбокі ўзровень адсутнасьці значэньня – яно азначае, што зьменнай ўвогуле ніколі не прысвойвалася ніякае значэньне. Яно атрымліваецца, калі мы зьвяртаемся да неіснуючага атрыбуту аб'екта альбо неіснуючага элемэнту масіву, і вяртаецца функцыямі, якія не вяртаюць значэньняў.

undefined – гэта нечаканая альбо памылка-падобная адсутнасьць значэньня ў зьменнай. Звычайна яно выкарыстоўваецца у праграме наўпрост толькі пры выкананьні нейкіх праверак, каб прадухіліць нечаканыя сытуацыі.

Пераўтварэньні тыпаў

Як мы ўжо бачылі вышэй JavaScript ня ўскладвае занадта вялікіх патрабаваньняў да тыпу значэньняў, калі апэруе імі. Напрыклад, што тычыцца лягічнага тыпу, мы адзначалі вышэй, што якое б мы значэньне ня выкарысталі ў кантэксьце, у якім чакаецца лягічны тып, JavaScript аўтаматычна пераўтворыць яго менавіта ў лягічны тып. Тое ж самае тычыцца іншых тыпаў, напрыклад:

У табліцы ніжэй прыведзены правілы аўтаматычнага пераўтварэньня тыпаў:

Пераўтварэньні тыпаў
Зыходнае значэньне	Аўтаматычнае пераўтварэньне ў:
Зыходнае значэньне	Чараду	Лік	Лягічнае значэньне	Аб'ект
`undefined`	`"undefined"`	`NaN`	`false`	будзе кінута памылка `TypeError`
`null`	`"null"`	`0`	`false`	будзе кінута памылка `TypeError`
`true`	`"true"`	`1`		`new Boolean(true)`
`false`	`"false"`	`0`		`new Boolean(false)`
`""` (пустая чарада)		`0`	`false`	`new String("")`
`"1.2"` (утрымлівае лік)		`1.2`	`true`	`new String("1.2")`
`"one"` (утрымлівае ня лік)		`NaN`	`true`	`new String("one")`
`0`	`"0"`		`false`	`new Number(0)`
`-0`	`"-0"`		`false`	`new Number(-0)`
`NaN`	`"NaN"`		`false`	`new Number(NaN)`
`Infinity`	`"Infinity"`		`true`	`new Number(Infinity)`
`-Infinity`	`"-Infinity"`		`true`	`new Number(-Infinity)`
`1` (канечны лік, ня нуль)	`"1"`		`true`	`new Number(1)`
`{}` (любы аб'ект)			`true`
`[]` (пусты масіў)	`""`	`0`	`true`
`[9]` (адзіны лікавы элемэнт)	`"9"`	`9`	`true`
`['a']` (любы іншы масіў)	вынік мэтаду `join()`	`NaN`	`true`
`function(){}` (любая функцыя)	вынік мэтаду `join()`	`NaN`	`true`

Пераўтварэньні і роўнасьць

З-за таго, што JavaScript гнутка пераўтварае адны тыпы ў іншыя, яго апэрацыя роўнасьці == таксама гнуткая ў вызначэньні ці роўныя яе апэранды. Напрыклад, усе наступныя параўнаньні вяртаюць true:

Пераўтварэньні аб'ектаў у элемэнтарныя тыпы

Гэтую тэму пакінем па-за межамі дадзенага даведніку. Пры жаданьні можна зьвярнуцца да адпаведнага разьдзелу 3.8.3 шостага выданьня кнігі David Flanagan. «JavaScript. The Definitive Guide. Activate Your Web Pages».

Зьменныя аб'екты і нязьменныя элемэнтарныя значэньні

У JavaScript існуе прынцыповае адрозьненьне паміж элемэнтарнымі тыпамі і аб'ектамі (уключаючы масівы і функцыі). Значэньні элемэнтарных тыпаў нязьменныя. Праілюструем гэта на прыкладзе з чарадой:

Аб'екты ж у JavaScript могуць зьмяняцца:

Яшчэ аб'екты параўноўваюцца не па значэньні. Нават калі 2 аб'екты маюць адзін і той жа набор атрыбутаў і усе яны маюць аднолькавыя значэньні, гэтыя аб'екты ня будуць лічыцца роўнымі:

Аб'екты яшчэ завуцца спасылачным тыпам (у адрозьненьні ад элемэнтарных тыпаў), таму што значэньні аб'ектаў – гэта спасылкі на аб'екты. Таму 2 спасылкі толькі тады роўныя, калі спасылаюцца на адзін і той жа аб'ект:

З прыкладу вышэй відаць, што прысваеньне зьменнай нейкага аб'екта ня робіць копіі гэтага аб'екта, а захоўвае ў зьменнай спасылкі на гэты аб'ект. Калі ж вы жадаеце зрабіць менавіта копію, тады трэба яўным чынам скапіяваць кожны з атрыбутаў зыходнага аб'екта (масіву):

Гэткім жа чынам, пры жаданьні параўнаць 2 аб'екты ці масівы, трэба пасьлядоўна параўнаць усе іх атрыбуты/элемэнты.

Зьменныя

Зьменная – гэта імя, злучанае са значэньнем. Кажуць, што значэньне ўтрымліваецца ці захоўваецца ў зьменнай. Зьменныя дазваляюць захоўваць даныя ў праграме і працаваць зь імі. Напрыклад, наступны радок коду прысвойвае значэньне 2 зьменнай зь імем i:

А ў наступным прыкладзе значэньне 3 дадаецца да значэньня зьменнай зь імем i, а вынік прысвойваецца зьменнай зь імем sum:

JavaScript не зьяўляецца строга тыпізаванай мовай, таму адна і тая ж зьменная ў розныя часы можа захоўваць значэньні розных тыпаў:

У Java, C, C++ ці іншай тыпізаванай мове праграмаваньня такі код немагчымы, таму што ў гэтых мовах зьменная можа ўтрымліваць значэньні толькі пэўнага тыпу, які быў зададзены пры яе аб'яўленьні.

Аб'яўленьні

Перад выкарыстаньнем зьменную трэба аб'явіць. Гэта робіцца пры дапамозе ключавога слова var наступным чынам:

Калі трэба запар зрабіць некалькі аб'яўленьняў, іх можна аб'яднаць у адно аб'яўленьне:

Адначасова з аб'яўленьнем можна праініцыяваць зьменную:

Калі пры аб'яўленьні зьменнай не прысвойваецца значэньне, яна будзе ўтрымліваць значэньне undefined да таго часу, пакуль ня будзе яўным чынам праініцыяваная.

Вобласьць бачнасьці

Вобласьць бачнасьці (scope) зьменнай – гэта частка коду праграмы, у якой гэтая зьменнай аб'яўлена і, адпаведна, бачна. Глябальныя зьменныя маюць глябальную вобласьць бачнасьці і бачны ў любым месцы вашай JavaScript-праграмы. Вобласьцю бачнасьці зьменных, якія былі аб'яўлены ўнутры функцыі, зьяўляецца цела гэтай функцыі. У апошнім выпадку пра зьменную кажуць, што яна лякальная. Парамэтры функцыі таксама лічацца лякальнымі зьменнымі і бачны толькі ў межах сваёй функцыі.

Унутры цела функцыі лякальная зьменная мае перавагу перад глябальнай з такім жа імем. Такім чынам, аб'явіўшы ў функцыі зьменную зь імем як у нейкай глябальнай зьменнай, вы згубіце доступ да той глябальнай зьменнай:

Вызначэньні функцыяў могуць быць укладзенымі адна ў адну. Кожная функцыя мае сваю ўласную лякальную вобласьць бачнасьці, такім чынам у дадзеным выпадку будуць некалькі ўкладзеным абласьцей бачнасьці:

У C-падобных мовах праграмаваньня кожны блёк (заключаны ў фігурныя дужкі) мае сваю ўласную лякальную вобласьць бачнасьці і да зьменнай, аб'яўленай ў блёку, няма доступу па-за межамі гэтага блёку. Гэта завецца блёчнай вобласьцю бачнасьці і JavaScript яе ня мае. У JavaScript лякальныя вобласьці заўсёды абмежаваны функцыямі: лякальныя зьменныя бачны ўва ўсім целе функцыі, у якой яны аб'яўлены, і ўва ўсіх іншых функцыях, якія ўкладзены/вызначаны ў гэтай функцыі. У наступным прыкладзе ўсе лякальныя зьменныя аб'яўлены ў розных месцах функцыі, але ўсе яны маюць адну і тую ж вобласьць бачнасьці – цела гэтай функцыі:

Той факт, што зьменныя бачны ўва ўсёй функцыі незалежна ад месцу іх аб'яўленьня, азначае што яны могуць быць бачны да свайго аб'яўленьня:

Кажуць, што аб'яўленьні лякальных зьменных у JavaScript як бы «усплываюць» да верху функцыі. Вызначэньне функцыі ў папярэднім прыкладзе эквівалентнае наступнаму:

Выразы

Выразы ў JavaScript – гэта «фразы», якія інтэрпрэтатар JavaScript можа апрацаваць, каб атрымаць нейкае значэньне. Напрыклад, канстанта, якая наўпрост пазначана ў кодзе, ці зьменная – гэта прыклады найпрасьцейшых выразаў. Больш складаныя выразы будуюцца з простых, звычайна пры дапамозе апэрацыяў. Апэрацыя бярэ значэньні сваіх апэрандаў і на іх аснове вылічвае новае значэньне.

Базавыя выразы – гэта тыя, якія не ўключаюць у свой склад іншыя, больш простыя выразы. Базавымі выразамі зьяўляюцца канстанты, убудаваныя наўпрост у код праграмы, ці іншымі словамі літаралы, зьменныя і некаторыя ключавыя словы Напрыклад:

Выразы вызначэньня масіваў і аб'ектаў вяртаюць адпаведна створаныя масівы і аб'екты:

Існуюць таксама выразы вызначэньня функцыяў:

Выразы доступу да атрыбутаў аб'ектаў:

Выразы выкліку функцыяў:

Выразы стварэньня аб'ектаў:

Апэрацыі

Апэрацыі можна ўжыць да аднаго ці да некалькіх выразаў (яны завуцца апэрандамі ў такім кантэксьце), каб на аснове іх значэньняў атрымаць новыя састаўныя выразы (значэньні). Знак роўнасьці = – гэта апэрацыя прысваеньня, а ўжытая разам са сваімі апэрандамі k = 0 – гэта ўжо выраз прысваеньня.

Прысваеньня

Reference

Апэрацыі прысваеньня даволі інтуітыўна зразумелыя, але варта спыніцца на некаторых асаблівасьцях. Гэтыя апэрацыі зьяўляюцца права-асацыятыўнымі, а значэньнем выразу прысваеньня зьяўляецца правы апэранд апэрацыі. Таму дазваляецца наступнае:

Таксама апэрацыі прысваеньня можна выкарыстоўваць у складаных выразах кшталту:

Скарочаныя формы прысваеньняў

Скарочаныя формы прысваеньняў камбінуюць прысваеньне з іншай апэрацыяй:

дзе OP гэта пэўная апэрацыя, што эквівалентна:

Поўны сьпіс гэных апэрацыяў:

Апэрацыя	Прыклад	Эквівалент
`+=`	`a += b`	`a = a + b`
`-=`	`a -= b`	`a = a - b`
`*=`	`a *= b`	`a = a * b`
`/=`	`a /= b`	`a = a / b`
`%=`	`a %= b`	`a = a % b`
`<<=`	`a <<= b`	`a = a << b`
`>>=`	`a >>= b`	`a = a >> b`
`>>>=`	`a >>>= b`	`a = a >>> b`
`&=`	`a &= b`	`a = a & b`
`\|=`	`a \|= b`	`a = a \| b`
`^=`	`a ^= b`	`a = a ^ b`

Параўнаньня

Reference

Апэрацыі праверкі ці першы аргумэнт роўны/няроўны другому і праверкі адносінаў большы/меншы паміж імі. Табліца ніжэй утрымлівае апісаньне апэрацыяў параўнаньня, прымаючы, што ў праграме маюцца наступныя аб'яўленьні:

Апэрацыя	Апісаньне	Прыклады, якія вяртаюць `true`
`==`	Роўнасьць. Вяртае `true`, калі апэранды роўныя адзін другому.	`3 == var1` `"3" == var1` `3 == '3'`
`!=`	Няроўнасьць. Вяртае `true`, калі апэранды ня роўныя адзін другому.	`var1 != 4` `var2 != "3"`
`===`	Строгая роўнасьць. Вяртае `true`, калі апэранды роўныя адзін другому і маюць аднолькавы тып.	`3 === var1`
`!==`	Строгая няроўнасьць. Вяртае `true`, калі апэранды ня роўныя адзін другому і/ці маюць адрозныя тыпы.	`var1 !== "3"` `3 !== '3'`
`>`	Больш. Вяртае `true`, калі левы апэранд большы за правы.	`var2 > var1` `"12" > 2`
`>=`	Больш ці роўна. Вяртае `true`, калі левы апэранд большы ці роўны праваму.	`var2 >= var1` `var1 >= 3`
`<`	Менш. Вяртае `true`, калі левы апэранд меншы за правы.	`var1 < var2` `"12" < "2"`
`<=`	Менш ці роўна. Вяртае `true`, калі левы апэранд меншы ці роўны праваму.	`var1 <= var2` `var2 <= 5`

Арытмэтычныя

Reference

Арытмэтычныя апэрацыі падзяляюцца на ўнарныя (з удзелам аднаго апэранду) і бінарныя (з удзелам 2 апэрандаў).

Унарныя

Апэрацыя	Апісаньне	Прыклады
`+`	Унарны плюс. Пераўтварае апэранд у лік (ці `NaN`) і вяртае вынік. Калі ж апэрандам зьяўляецца лік, ня робіць нічога.	`+"2"; //=> 2`
`-`	Унарны мінус. Пераўтварае апэранд у лік, калі патрэбна, і зьмяняе яго знак на адваротны.	`-2; //=> -2`
`++`	Інкрымэнт. Павялічвае апэранд (які павінны быць lvalue) на адзінку.	`a++; //=> a = a + 1`
`--`	Дэкрымэнт. Памяншае апэранд (які павінны быць lvalue) на адзінку.	`a--; //=> a = a - 1`

Значэньне, якое вяртаюць апэрацыі інкрымэнту і дэкрымэнту, залежыць ад пазыцыі апэрацыі адносна апэранду. Калі апэрацыя зьмяшчаецца перад апэрандам, будзе вернута паменшанае ці павялічанае на адзінку значэньне апэранду. Калі ж апэрацыя зьмешчана пасьля апэранду, будзе вернута нязьменнае значэньне апэранду:

Бінарныя

Апэрацыя	Апісаньне
`+`	Складаньне.
`-`	Адыманьне.
`*`	Памнажэньне.
`/`	Дзяленьне.
`%`	Знаходжаньне астачы цэлалікавага дзяленьня.

Бітавыя

Reference

Гэтыя апэрацыі ажыцьцяўляюць маніпуляцыі з бітамі лікаў у іх бінарным прадстаўленьні:

Апэрацыя	Апісаньне	Прыклады
`&`	Бітавы AND. Ужывае лягічную апэрацыю AND да ўсіх адпаведных бітаў кожнага з апэрандаў.	`0x1234 & 0x00FF //=> 0x0034`
`\|`	Бітавы OR. Ужывае лягічную апэрацыю OR да ўсіх адпаведных бітаў кожнага з апэрандаў.	`0x1234 \| 0x00FF //=> 0x12FF`
`^`	Бітавы выключны OR (XOR). Ужывае лягічную апэрацыю XOR да ўсіх адпаведных бітаў кожнага з апэрандаў.	`0xFF00 ^ 0xF0F0 //=> 0x0FF0`
`~`	Бітавы NOT. Ужывае лягічную апэрацыю NOT да бітаў адзінага свайго апэранду. Знак апэрацыі зьмяшчаецца перад апэрандам.	`~0x0F //=> 0xFFFFFFF0`
`<<`	Бітавы зрух улева. Зрушвае біты свайго першага апэранду ўлева на колькасьць бітавых пазыцыяў, пазначаных у другім апэрандзе, які павінен быць у межах ад 0 да 31. Пры зруху на адзін біт улева старэйшы (самы левы) біт губляецца, а месца вызваленага малодшага (самага правага) запаўняецца 0. Апэрацыя бітавага зруху ўлева на 1 біт эквівалентна памнажэньню адпаведнага цэлага ліку на 2, зрух на 2 біты – памнажэньню на 4 і г.д. (2 у адпаведнай ступені)	`0x000F << 4 //=> 0x00F0` што эквівалентна: `15 * 2⁴ //=> 15 * 16 = 240`
`>>`	Бітавы зрух управа з захаваньнем знаку. Зрушвае біты свайго першага апэранду ўправа на колькасьць бітавых пазыцыяў, пазначаных у другім апэрандзе, які павінен быць у межах ад 0 да 31. Пры зруху на адзін біт управа малодшы (самы правы) біт губляецца, а месца вызваленага старэйшага (самага левага) запаўняецца 0 ці 1 у залежнасьці ад знаку першапачатковага ліку (0 у выпадку дадатнага ліку і 1 у выпадку адмоўнага ліку). Апэрацыя бітавага зруху дадатнага ліку ўправа на 1 біт эквівалентна дзяленьню адпаведнага цэлага ліку на 2 з адкіданьнем дробнай часткі, зрух на 2 біты – дзяленьню на 4 і г.д. (2 у адпаведнай ступені).	`0x00FF >> 4 //=> 0x000F` што эквівалентна: `255 / 2⁴ //=> 255 / 16 = 15`
`>>>`	Бітавы зрух управа без захаваньня знаку. Аналягічны бітаваму зруху ўправа з захаваньнем знаку, але адрозьніваецца тым, што на месца вызваленых бітаў зьлева падстаўляецца заўсёды 0.	`−1 >> 4 //=> −1` але: `−1 >>> 4 //=> 0x0FFFFFFF`

Лягічныя

Reference

Лягічныя апэрацыі ажыцьцяўляюць апэрацыі булевай альгебры над сваімі (звычайна лягічнага тыпу) апэрандамі:

Апэрацыя	Апісаньне
`&&`	Лягічны AND. Вяртае першы з сваіх апэрандаў, калі той можа быць пераўтвораны ў значэньне `false`, альбо другі апэранд у адваротным выпадку. Адпаведна, калі ўжываецца да апэрандаў лягічнага тыпу, верне `true` калі абодва апэранда маюць значэньне `true`, інакш верне `false`.
`\|\|`	Лягічны OR. Вяртае першы з сваіх апэрандаў, калі той можа быць пераўтвораны ў значэньне `true`, альбо другі апэранд у адваротным выпадку. Адпаведна, калі ўжываецца да апэрандаў лягічнага тыпу, верне `true` калі хаця б адзін з апэрандаў мае значэньне `true`, калі ж абодва маюць значэньне `false`, вынікам будзе таксама `false`.
`!`	Лягічны NOT. Верне `false`, калі адзіны яго апэранд можа быць пераўтвораны ў `true`, інакш верне `true`.

Прыклады

Асаблівыя

Умоўная

Reference

Гэта адзіная тэрнарная (якая прымае 3 апэранды) апэрацыя ў JavaScript. Яна зазвычай ужываецца як больш кароткая форма ўмоўнай інструкцыі:

Апэрандамі гэтай апэрацыі могуць быць любыя тыпы. Спачатку вылічваецца першы апэранд (да знака пытальніка) і інтэрпрытуецца як лягічнае значэньне, калі яно вернае – тады вылічваецца і вяртаецца другі апэранд (пасьля знака пытальніка і перад двукроп'ем), калі ня вернае – вылічваецца і вяртаецца трэці апэранд (пасьля двукроп'я). Вылічваецца заўсёды толькі адзін з двух апошніх апэрандаў – альбо другі, альбо трэці.

Хаця таго ж самага эфэкту можна дасягнуць пры дапамозе ўмоўнай інструкцыі, тэрнарная апэрацыя зьяўляецца больш кампактнай. Грувасткая ўмоўная інструкцыя:

І значна больш кампактная тэрнарная апэрацыя:

Апэрацыя-коска

Reference

Гэтая апэрацыя вылічвае свае апэранды (зьлева направа) і вяртае значэньне апошняга зь іх. Яе прызначэньне – даць магчымасьць уставіць некалькі выразаў у месца, дзе чакаецца толькі адзін выраз. Найбольш выкарыстоўваецца ўнутры інструкцыі цыкла:

Інструкцыя цыкла чакае адзін выраз пасьля другой кропкі з коскай, але мы можам уставіць 2 выразы, падзяліўшы іх коскай: i++, j--.

`void`

Reference

Гэтая апэрацыя вылічвае свой апэранд, а затым вяртае undefined. Адзін з магчымых спосабаў выкарыстаньня – імгненны выклік функцыі пры яе аб'яўленьні:

У гэтым выпадку ключавое слова function трактуецца не як аб'яўленьне функцыі, а як выраз для выкананьня. У выніку функцыя fun будзе не проста аб'яўленая, але і адразу ж выкананая.

Інструкцыі

Калі выразы – гэта фразы JavaScript, дык інструкцыі – гэта сказы (альбо каманды) JavaScript. Калі ў звычайнай мове сказы падзяляюцца адзін ад другога кропкай, дык інструкцыі ў JavaScript падзяляюцца адна ад другой кропкай з коскай. Выразы разьлічваюцца, каб атрымаць нейкае значэньне, а інструкцыі выконваюцца, каб зрабіць нейкае дзеяньне.

Інструкцыі-выразы

Найбольш простымі інструкцыямі зьяўляюцца выразы, якія маюць пабочнае дзеяньне, напрыклад – выраз прысваеньня. Ён ня толькі вылічвае нейкае значэньне, але і прысвойвае яго аднаму са сваіх апэрандаў:

Таксама выразы інкрымэнту і дэкрымэнту, выкліку функцый і падобныя маюць пабочныя эфэкты і могуць зьяўляюцца адначасова інструкцыямі.

Пустыя і састаўныя

Інструкцыя можа быць пустой, калі ў месцы, дзе чакаецца інструкцыя зьмяшчаецца кропка з коскай і больш нічога:

ці састаўной, калі некалькі інструкцыяў спалучаюцца ў адзін блёк лягічна злучаных інструкцыяў пры дапамозе фігурных дужак (усё ад адкрываючай да закрываючай дужак уключна завецца састаўной інструкцыяй):

Аб'яўленьняў

`function`

Reference

Ключавое слова function служыць для вызначэньня функцыяў. Яно таксама можа быць выкарыстана ў выглядзе выразу:

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

Пры вызначэньні функцыі ствараецца аб'ект Function, якому ўласьцівыя атрыбуты, мэтады і паводзіны апошняга.

Сынтаксіс аб'яўленьня функцыі ў агульным выпадку выглядае наступным чынам:

Дзе funcname – гэта ідэнтыфікатар, які задае імя новай функцыі. Пасьля імені ставяцца круглыя дужкі, у якіх праз коску могуць ісьці парамэтры функцыі (але сьпіс парамэтраў можа быць і пустым). Гэтыя ідэнтыфікатары выкарыстоўваюцца для доступу да значэньняў, якія перадаюцца ў функцыю пры яе выкліку. Цела функцыі можа складацца зь любой колькасьці інструкцыяў, якія заключаюцца ў фігурныя дужкі. Пры гэтым фігурныя дужкі абавязковыя для ўжываньня, нават калі цела функцыі пустое. Таксама фігурныя дужкі нельга апускаць, калі цела функцыі ўтрымлівае толькі адну інструкцыю, у адрозьненьні ад сынтаксісу напрыклад умоўнай інструкцыі, дзе фігурныя дужкі дазваляецца апускаць у такім выпадку. Інструкцыі, якія ўтрымлівае цела функцыі выконваюцца не адразу пасьля аб'яўленьня функцыі, але пры яе выкліку.

`var`

Reference

Аб'яўленьне зьменных і іх вобласьці бачнасьці былі ўжо разгледжаныя вышэй. Адно, прывядзем яшчэ колькі прыкладаў:

Умоўныя

Умоўныя інструкцыі дазваляюць выконваць іншыя інструкцыі толькі пры пэўных умовах. Яны дазваляюць разгаліноўваць плынь вашай праграмы.

`if...else`

Reference

Гэта базавая канструкцыя ўмоўнага выкананьня. Сынтаксіс яе ў агульным выпадку наступны:

Калі ўмоўны выраз expression верны, будзе выкананая інструкцыя statement1, інакш – інструкцыя statement2. Напрыклад:

Частка «інакш» (else) можа быць апушчаная (калі ўмова выконваецца зрабіць нешта, інакш нічога не рабіць):

Калі пэўная лёгіка мае не 1 ці 2 варыянты (верна/ня верна), а больш, умоўныя інструкцыі можна злучаць адна за адной наступным чынам:

`switch`

Reference

Калі ў чарадзе злучаных адна за адной if...else-інструкцыяў правяраецца адзін і той жа выраз (значэньне зьменнай n у апошнім прыкладзе папярэдняга разьдзелу), тады лепшым рашэньнем будзе выкарыстаць інструкцыю switch, хаця б для таго, каб не вылічваць значэньне аднаго і таго ж выразу некалькі разоў. Сынтаксіс гэтай інструкцыі ў агульным выпадку наступны:

Тады перадапошні прыклад з чарадой if...else-інструкцыяў можна будзе запісаць наступным чынам:

Зьвярніце ўвагу на меткі break у канцы кожнага блёку. Іх прысутнасьць тлумачыцца тым, што меткі case вызначаюць пачатак таго блёку, які павінен быць выкананы, але не вызначаюць яго канец. Для гэтай мэты і прызначаны меткі break. Калі інтэрпрэтатар сустракае іх, ён спыняе выкананьне інструкцыі switch і пераходзіць да інструкцыі, наступнай за switch.

Цыклаў

Інструкцыі цыкла дазваляюць выконваць адну ці некалькі інструкцыяў некалькі разоў пакуль выконваецца пэўная ўмова. Адзін з відавочных прыкладаў цыклічных інструкцыяў – выкананьне нейкай апэрацыі над усімі элемэнтамі пэўнага масіву.

`while`

Reference

Базавая інструкцыя цыкла – while. Яе сынтаксіс наступны:

Калі інтэрпрэтатар сустракае while-інструкцыю, ён спачатку разьлічвае выраз condition. Калі ў выніку атрымліваецца «ілжывае» значэньне, тады цела цыкла (інструкцыя statement) прапускаецца і выконваецца інструкцыя, якая ідзе за while. Калі ж значэньне выразу наадварот «вернае», тады выконваецца цела цыкла, а пасьля ізноў вылічваецца значэньне выразу condition і ўсё паўтараецца ізноў. Калі цела цыкла павінна ўтрымліваць некалькі інструкцыяў, іх трэба аб'яднаць у састаўны блёк {...}.

Прыклад ужываньня:

Вышэйпрыведзены цыкл будзе выконвацца да таго часу, пакуль значэньне зьменнай n меншае за 3. У кожным з «праходаў» цыкла значэньне зьменнай n павялічваецца на 1, а значэньне зьменнай х павялічваецца на значэньне зьменнай n. У выніку атрымаем наступнае:

У канцы першага праходу: n = 1, x = 1
У канцы другога праходу: n = 2, x = 3
У канцы трэцяга праходу: n = 3, x = 6

`do...while`

Reference

Гэтая інструкцыя амаль цалкам падобная на папярэднюю, але ў ёй спачатку выконваецца цела цыкла, а ўжо потым правяраецца ўмова. Калі вынік умоўнага выразу верны, тады цела цыкла выконваецца ізноў, інакш выкананьне цыкла спыняецца і адбываецца пераход да інструкцыі, якая ідзе за цыклам. Такім чынам, цела цыкла будзе выканана прынамсі адзін раз, незалежна ад значэньня умоўнага выразу. Сынтаксіс інструкцыі ў агульным выпадку наступны:

Прыклад ужываньня:

У выніку выкананьня папярэдняга фрагмэнту коду ў кансоль будуць выведзеныя пасьлядоўна лічбы ад 1 да 5 уключна.

`for`

Reference

Наступная інструкцыя цыкла – гэта інструкцыя for. Яе сынтаксіс у агульным выпадку наступны:

дзе:

initialization – выраз ініцыіраваньня цыкла. Ён выконваецца аднойчы ў самым пачатку, і выкарыстоўваецца звычайна для вызначэньня альбо ініцыіраваньня лічыльніка цыкла.
condition – умоўны выраз, які выконваецца перад кожным праходам цыкла, у тым ліку перад першым. Калі яго значэньне вернае, тады выконваецца цела цыкла з інструкцыяй statement, інакш выкананьне цыкла спыняецца. Гэты выраз не абавязковы і калі не пазначаны, тады лічыцца, што ўмова выконваецца. У такім разе спыненьне выкананьня цыкла трэба арганізоўваць нейкім іншым чынам.
increment – выраз, які выконваецца ў канцы кожнага праходу (перад наступнай праверкай умоўнага выразу) і выкарыстоўваецца звычайна для зьмяненьня лічыльніка.
statement – інструкцыя, якая ўтварае цела цыклуаі выконваецца ў кожным праходзе цыкла да таго часу, пакуль выконваецца ўмова цыкла. Можа быць састаўной інструкцыяй.

Прыклад ужываньня:

У выніку выкананьня папярэдняга фрагмэнту коду ў кансоль будуць выведзеныя пасьлядоўна лічбы ад 0 да 8 уключна.

`for...in`

Reference

Гэтая інструкцыя прызначана для перабору тых атрыбутаў пэўнага аб'екта, якія дазваляюцца для пераліку (зьяўляюцца «пералічваемымі»). Перабіраюцца атрыбуты як уласна самога аб'екта, так і тыя, якія ён спадкуе ад сваіх бацькоўскіх аб'ектаў. Ня ўсе атрыбуты пералічваюцца (і, адпаведна, ня будуць перабірацца гэтай інструкцыяй). Напрыклад, мэтад indexOf() аб'екта String і мэтад toString() аб'екта Object не зьяўляюцца «пералічваемымі».

Гэтаксама як пры дапамозе інструкцыі for можна перабраць усе элемэнты масіву:

пры дапамозе інструкцыі for...in можна перабраць усе атрыбуты аб'екта:

Дадзены прыклад:

выведзе ў кансоль наступнае:

Акрамя гэтага можна скарыстацца мэтадам hasOwnProperty() для таго, каб сярод усіх перабіраемых атрыбутаў выбраць тыя, якія належаць ўласна самому аб'екту:

Дадзены прыклад выведзе ў кансоль наступнае:

Пераходаў

Інструкцыі пераходаў кажуць інтэрпрэтатару перарваць звычайную хаду выкананьня праграмы і зрабіць пераход у нейкае іншае месца праграмы.

`break`

Reference

Гэтая інструкцыя цалкам перарывае выкананьне цыкла альбо інструкцыі switch і кажа інтэрпрэтатару адразу ж перайсьці да наступнай за імі інструкцыі. Наступны мэтад перарывае цыкл while (радок 6) у момант, калі i роўнае тром і пераходзіць да наступнай інструкцыі (радок 10), дзе вяртае значэньне 3 * x:

`continue`

Reference

Дадзеная інструкцыя перарывае цяперашнюю ітэрацыю цыкла і пераходзіць да наступнай яго ітэрацыі – да праверкі ўмовы цыкла. Для інструкцыі for дадаткова перад праверкай умовы цыкла будзе выкананы выраз increment, які звычайна выкарыстоўваецца для зьмяненьня лічыльніка цыкла.

У наступным прыкладзе інструкцыя continue (радок 6) перарве выкананьне той ітэрацыі цыкла, калі зьменная i будзе мець значэньне 3 (радок 5) і пяройдзе да чарговай праверкі ўмовы цыкла (радок 3). Такім чынам зьменная n па чарзе прыме значэньні 1, 3, 7, 12 (а не значэньні 1, 3, 6, 10, 15, якія б яна прыняла пры адсутнасьці інструкцыі continue):

У наступным прыкладзе інструкцыя continue (радок 2) перарве выкананьне той ітэрацыі цыкла, калі чарговы элемэнт масіву data[i] будзе мець значэньне undefined, і пяройдзе да наступнага элемэнту масіву (альбо скончыць выкананьне цыкла, калі гэта быў апошні элемэнт):

`return`

Reference

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

Інструкцыя return можа таксама ўжывацца сама па сабе, без значэньня. У гэтым выпадку выклікаючаму коду будзе вернутае значэньне undefined:

`throw`

Reference

`try...catch`

Reference

Іншыя

`with`

Reference

Аб'ектная мадэль

«Details of the Object Model» на MDN: https://developer.mozilla.org/en/JavaScript/Guide/Details_of_the_Object_Model

«Working with objects» на MDN: https://developer.mozilla.org/en/JavaScript/Guide/Working_with_Objects

«Inheritance and the prototype chain» на MDN: https://developer.mozilla.org/en/JavaScript/Guide/Inheritance_and_the_prototype_chain

«Inheritance revisited» на MDN: https://developer.mozilla.org/en/JavaScript/Guide/Inheritance_Revisited

«Prototypes and Inheritance in JavaScript» на scriptjunkie{}: http://msdn.microsoft.com/en-us/magazine/ff852808.aspx

What’s new in JavaScript 1.8.5

Closures: Front to Back

Javascript Properties Example

Доступу да атрыбутаў

Reference

Апэрацыя доступу да атрыбутаў дазваляе атрымаць ці прысвоіць значэньне атрыбуту аб'екта альбо элемэнту масіву. Існуе 2 варыянты гэтай апэрацыі. У першым зь іх імя атрыбуту ідзе праз кропку пасьля ідэнтыфікатару аб'екта, у другім – заключана ў прамавугольныя дужкі пасьля ідэнтыфікатару:

`delete`

Reference

Апэрацыя выдаляе атрыбут аб'екта ці элемэнт масіву.

Калі апэрацыя выкананая пасьпяхова, яна выдаляе атрыбут у аб'екта. Але, калі ў ланцугу прататыпаў аб'екта існуе атрыбут з такім жа імем, ён будзе успадкаваны аб'ектам адтуль.

Апэрацыя ня можа быць ужытая да зьменных, функцый, а таксама да пэўных атрыбутаў базавых аб'ектаў.

У JavaScript, як і ў бальшыні іншых аб'ектна-арыентаваных мовах праграмаваньня, ключавое слова this служыць для таго, каб можна было спасылацца знутры функцыі да аб'екта, які гэтую функцыю утрымлівае. Але існуе некалькі ўласьцівых JavaScript асаблівасьцяў, на якіх варта спыніцца. Каб вызначыць, на што спасылаецца this, трэба кіравацца наступным альгарытмам:

Калі выклік функцыі адбыўся пры дапамозе apply, bind ці call, this будзе роўны першаму аргумэнту, які быў перададзены apply/bind/call. Калі ж першым аргумэнтам быў перададзены null ці undefined, this будзе спасылацца на глябальны аб'ект (window у выпадку браўзэра).

Калі выклік функцыі адбыўся ў якасьці апрацоўшчыка падзеі (не знутры апрацоўшчыка падзеі, а менавіта як апрацоўшчык падзеі), тады this будзе спасылацца на аб'ект, для якога гэтая падзея спрацавала.

Калі функцыя выклікана як мэтад аб'екта, тады this будзе спасылацца на гэты аб'ект.
Інакш this будзе спасылацца на глябальны аб'ект.

`typeof`

Reference

`get`

Reference

Калі значэньне нейкага атрыбуту аб'екта павінна разьлічвацца дынамічна, яго можна не аб'яўляць наўпрост, а скарыстацца мэханізмам

`set`

Reference

Базавыя аб'екты

У JavaScript існуюць базавыя ці, інакш кажучы, глябальныя аб'екты (у тым сэнсе, што даступныя ў глябальнай прасторы імёнаў). Ніжэй прыведзена больш падрабязная інфармацыя па кожнаму зь іх.

`Array`

`Date`

`Error`

Reference

`RangeError`

`Function`

Любая функцыя ў JavaScript зьяўляецца экзэмплярам базавага аб'екта Function. Па-першае, функцыю можна стварыць праз канструктар:

Выклікаючы канструктар, спачатку перадаецца сьпіс імёнаў неабавязковых аргумэнтаў, а апошнім ідзе сымбальная чарада, якая ўтрымлівае выразы для выкананьня, напрыклад:

Часам, для вырашэньня пэўных задачаў, немагчыма абмінуць стварэньне функцыяў праз канструктар, але звычайна, ў астатніх выпадках, трэба пазьбягаць гэтага, таму што такія функцыі ствараюцца пры кожным сваім выкліку наноў. Замест гэтага ў большасьці выпадкаў трэба аб'яўляць функцыю і выклікаць яе ў тэксьце праграмы:

Функцыя можа быць прызначана зьменнай:

Гэта вельмі падобна да звычайнага аб'яўленьня функцыі, але трэба ведаць, што:

калі функцыя ствараецца праз выраз кшталту var adder = new Function("..."), adder зьяўляецца зьменнай, якая у дадзены момант спасылаецца на аб'ект Function (а ў іншы момант можа спасылацца на іншы аб'ект, у тым ліку іншага тыпу),
калі ж функцыя ствараецца праз выраз function sayHello() {...}, sayHello зьяўляецца імем функцыі, а ня зьменнай.

Функцыі таксама можна аб'яўляць унутры іншых функцыяў. Укладзеныя (унутраныя) функцыі абмежаваны для выкарыстаньня толькі сваімі абымаючымі (зьнешнімі) функцыямі. Пры гэтым унутраныя функцыі могуць мець доступ да аргумэнтаў і зьменных сваіх зьнешніх функцыяў, але зьнешнія функцыі ня могуць мець доступ да аргумэнтаў і зьменных сваіх унутраных функцыяў.

Атрыбуты

У аб'ектаў Function маецца адзін атрыбут, які дазваляе пашыраць/зьмяняць усе экзэмпляры адпаведных аб'ектаў:

prototype

Reference

Мэтады

Разгледзем мэтады, якія даступны экзэмплярам Function.

`apply`

Reference

`bind`

Reference

`call`

Reference

`isGenerator`

Reference

`toString`

Reference

`Object`

Reference

`RegExp`

Асынхроннасьць

Mozilla Developers Network

The Basics of Web Workers

whatwg.org

Introduction to Service Worker

Fetch API

Promise-Based Validation

How do Promises Work?

JavaScript Promises

Лагіраваньне і тэставаньне

Лагіраваньне і дэбаг

Прасьцейшы спосаб рабіць лагіраваньне і дэбаг у JavaScript – вывад інфармацыі ў кансоль Firebug:

Што такое Firebug можна даведацца ў відэа-ўводзінах да гэтага Firefox-дадатку на css-tricks.com: http://css-tricks.com/video-screencasts/15-introduction-to-firebug/.

Тэставаньне

How to Test your JavaScript Code with QUnit, Don't Forget to Cover Your Client Side!

Testing Your JavaScript with Jasmine

Test-Driven JavaScript Development in Practice

cross-browser testing platform

Advanced Unit Testing Techniques in JavaScript

forceFeed.js, gremlins.js – monkey testing library (генэруе выпадковыя дзеяньні на старонцы).

Tips & Tricks

jscrambler

Пераўтварэньне ў `boolean` праз `!!`

Выраз !!variable аўтаматычна перавядзе значэньне любога тыпу ў значэньне тыпу boolean. У выніку false атрымаецца толькі тады, калі зыходнае значэньне мела адно са значэньняў: 0, null, "", undefined альбо NaN, інакш атрымаецца true. Напрыклад:


function Account(cash) {
    this.cash = cash;
    this.hasMoney = !!cash;
}
var account = new Account(100.50);
console.log(account.cash); // 100.50
console.log(account.hasMoney); // true

var emptyAccount = new Account(0);
console.log(emptyAccount.cash); // 0
console.log(emptyAccount.hasMoney); // false

Пераўтварэньне ў лік праз `+`

Простае пераўтварэньне сымбальнай чарады ў лік:


function toNumber(strNumber) {
    return +strNumber;
}
console.log(toNumber("1234")); // 1234
console.log(toNumber("ACB")); // NaN

Змоўчныя значэньні праз `||`

У ES6 маецца магчымасьць пазначаць змоўчныя значэньні парамэтраў. У ранейшых вэрсіях JavaScript тое ж самае можна было рабіць наступным чынам:


function User(name, age) {
    this.name = name || "Oliver Queen";
    this.age = age || 27;
}
var user1 = new User();
console.log(user1.name); // Oliver Queen
console.log(user1.age); // 27

var user2 = new User("Barry Allen", 25);
console.log(user2.name); // Barry Allen
console.log(user2.age); // 25

Замена ўмоўных інструкцыяў умоўнымі апэрацыямі

Наступны фрагмэнт:


if (user) {
  user.login();
}

Можна замяніць больш кароткай формай:


user && user.login();

Вызначэньне прысутнасьці атрыбутаў у аб'ектах

Прысутнасьць атрыбутаў ці функцыяў у аб'ектах можна правяраць пры дапамозе апэрацыі in:


if ('querySelector' in document) {
    document.querySelector("#id");
} else {
    document.getElementById("id");
}

Атрыманьне апошняга элемэнту масіву

Пры дапамозе функцыі Array.prototype.slice(begin, end) можна атрымліваць апошні элемэнт масіву пры:


var array = [1,2,3,4,5,6];
console.log(array.slice(-1)); // [6]
console.log(array.slice(-2)); // [5,6]
console.log(array.slice(-3)); // [4,5,6]

Уразаньне масіву

Калі з сыходнага масіву трэба атрымаць першыя n яго элемэнтаў не клапоцячыся пра захаваньне зыходнага масіву, можна скарыстацца наступнай тэхнікай:


var array = [1,2,3,4,5,6];
console.log(array.length); // 6
array.length = 3;
console.log(array.length); // 3
console.log(array); // [1,2,3]

Зьліцьцё масіваў

Натуральны спосаб зьліцьця масіваў:


var array1 = [1,2,3];
var array2 = [4,5,6];
console.log(array1.concat(array2)); // [1,2,3,4,5,6];

Але недахоп такога мэтаду ў тым, што ён стварае новы масіў, спажываючы дадатковую памяць, што можа быць непажадана пры вялікіх масівах. Альтэрнатыўным і больш аптымальным з пункту гледжаньня спажываньня памяці зьяўляецца наступны спосаб:


var array1 = [1,2,3];
var array2 = [4,5,6];
console.log(array1.push.apply(array1, array2)); // [1,2,3,4,5,6];

Дадаткі і бібліятэкі

Сьпіс плагінаў

Useful JavaScript Libraries and jQuery Plugins

Useful JavaScript and jQuery Tools, Libraries, Plugins

Multiple.js - An experiment in sharing background across multiple elements using CSS

Маніпуляцыі з Favicon

Tinycon – library for manipulating the favicon, in particular adding alert bubbles and changing images

Загалоўкі старонак

Бібліятэкі, якія хаваюць загаловак пры пракрутцы старонкі ўніз: HeadsUp, Headroom.js

Табліцы

Бібліятэка, якая надае табліцам магчымасьць упарадкоўваць даныя: sorttable

Бібліятэкі, якія надаюць табліцам магчымасьць фільтраваць даныя:

Clusterize.js – Tiny plugin to display large data sets easily.

Для наданьня табліцам адначасова магчымасьцяў і ўпарадкоўваць радкі, і фільтраваць іх, і пастаронкавую навігацыю, і шмат чаго іншага зьвярніце ўвагу на jQuery-дадатак DataTables.

Даты

Бібліятэка для фарматаваньня, маніпуляваньня і парсынгу датаў: moment.js

Бібліятэка для фарматаваньня, маніпуляваньня і парсынгу датаў: tidyTime.js

Бібліятэка для фарматаваньня, маніпуляваньня і парсынгу датаў: xDate

Тэкставыя палі

Вызначэньне месца зьмяшчэньня ці водступу карэткі ў тэкставым полі: Caret.js

Аўтазапаўненьне: Awesomplete

Фарматаваньне: cleave.js

superplaceholder.js

Выпадаючыя сьпісы

Chosen - makes long select boxes much more user-friendly.

DropKick.js

Лікі, грошы, валюты

Лякалізуемая бібліятэка для фарматаваньня лікаў, грошай і валютаў: accounting.js

Бібліятэка для канвэртацыі валютаў: money.js

Бібліятэка для адвольнага фарматаваньня лікаў: numeral.js

stripe - payments for developers

recurly.js - Secure, PCI Compliant Transaction Forms With Fully Customizable CSS.

Skeuocard - progressively enhances credit card inputs to provide a skeuomorphic interface

Падказкі

html5tooltips.js – Light and clean tooltips with CSS3 animation, No framework required

popper.js

Аўтаматычная падстаноўка

Аўтаматычная падстаноўка фрагмэнту тэксту па гарачай клавішы: At.js

Мапы

MapBox

A Modern, Lightweight Open-Source JavaScript Library for Interactive Maps by CloudMade

Split panes

Split.js is a lightweight, unopinionated utility for creating adjustable split views or panes.

Дыялёгі

Avgrund – A modal concept which aims to give a sense of depth between the page and modal layers.

Загрузка артэфактаў ці паводзінаў

RequireJS – is a JavaScript file and module loader.

PreloadJS – A Javascript library that lets you manage and co-ordinate the loading of assets.

conditioner.js – A javascript library for loading and unloading behavior based on environment conditions.

Асынхронная апрацоўка

Taming Asynchronous JavaScript with Async.js

Push

JavaScript notifications for every browser

Анімацыя

Declarative handling library for CSS animations: AniJS

bounce.js lets you create tasty CSS3 powered animations in no time.

Колеры

chroma.js – JavaScript library for all kinds of color manipulations.

Move, Drag&Drop, Resize

interact.js – JavaScript drag and drop, resizing and multi-touch gestures with inertia and snapping.

Відэа

POPCORN - Popcorn makes video work like the web.

Графікі

Chartist.js – simple responsive charts.

Прэзэнтацыі

Fathom.js - прэзэнтацыі на JavaScript

PDF

Стварэньне ўбудаваных на старонцы PDF-дакумэнтаў лётма на кліенцкім баку: jsPDF

Мабільныя прылады

Quo.js – Micro JavaScript Library for mobile web projects.

Фрэймворкі

Embular Part 1 - Comparing Ember and Angular

Angular, Backbone, or Ember: Which is Best for your Build?

Aurelia vs AngularJS – Round One: FIGHT!

senna.js – A blazing-fast single page application engine

Node.js

Home
Docs

Фрэймворк для сэрвэраў. Прызначаны для выкананьня не на кліенцкім баку (у браўзэры), а на сэрверным баку. Зьяўляецца вельмі хуткім падзейна-арыентаваным фрэймворкам, які працуе на рухавіку V8 ад Гугла.

Карысныя спасылкі

Node.js Step by Step

Learning Server-Side JavaScript with Node.js

How to Scrape Web Pages with Node.js and jQuery

Testing in Node.js

Introduction to HTML5 Desktop Apps With Node-Webkit

10 Habits of a Happy Node Hacker

Node.js Framework Comparison: Express vs. Koa vs. Hapi

Node.js: Full application example

Node.js Tutorial: Building web apps

Node.js CMS & Web Application Platform

npm

Home
Docs

11 Simple npm Tricks That Will Knock Your Wombat Socks Off

Усталяваць сам Node.js і npm (Node Package Manager) у сыстэму лепш за ўсё праз nvm (Node Versions Manager) наступным чынам. Спачатку ўсталюем сам nvm:

Затым ужывем зьмены, якія усталёўшчык унёс у файл .profile у хатняй тэчцы:

І напрыканцы ўсталюем апошнія стабільныя вэрсіі Node.js і npm:

Усталяваць пакет лякальна можна наступным чынам:

Стварыць праект у цяперашняй тэчцы (файл package.json):

У гэтым файле можна прапісаць залежнасьці рукамі і тады пры выкананьні каманды npm install npm сьцягне і усталюе ўсе пакеты, якія прапісаны як залежнасьці цяперашняга праекта. Каб не запаўняць гэты файл рукамі, можна адначасова ўсталяваць пакет і прапісаць яго залежнасьць у файле package.json (з пастаяннай прысутасьцю, то бок як у распрацоўшчыцкім, так і ў вытворчым асяродках):

Усталяваць праект як залежнасьць выключна распрацоўшчыцкага асяродку можна такім чынам:

Grunt

Пакет аўтаматычнага выкананьня задачаў (зборкі).

Setting up an ES6 Project Using Babel and Browserify

How to Grunt and Gulp Your Way to Workflow Automation

Gulp

Пакет аўтаматычнага выкананьня задачаў (зборкі).

Browserify, Babelify and ES6

A Simple Gulp’y Workflow For Sass

Gulp: Creating multiple bundles with Browserify

Introduction to Gulp.js

Сьцісканьне выяваў:

Сьцісканьне HTML:

Сьцісканьне CSS:

Сьцісканьне JavaScript:

Browserify

Home

Browserify lets you require('modules') in the browser by bundling up all of your dependencies.

Watchify – сочыць за зьменамі ў файлах, каб запускаць білды Browserify.

Reactify – Browserify transform for JSX.

Express.js

Home

Fast, unopinionated, minimalist web framework for Node.js

Node.js: Express tutorial

RxJS

Home

Сродак рэактыўнага праграмаваньня на JavaScript

Understanding Reactive Programming and RxJS

TypeScript

Home

TypeScript lets you write JavaScript the way you really want to. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.

Working with React and TypeScript

8 Steps to Migrating from JavaScript to TypeScript

Meteor

Home
Docs

MEAN

Home

Introduction to the MEAN Stack

React

Tutorial на academy.plot.ly.

"React and ES6" series.

Articles in "Build with react"

Different tutorials

React CSS Modules

React + Spring Security Java API

Unit Testing React.js With Jasmine and Karma

react-boilerplate

React, Webpack, and Horizon Quick Start

Radium – set of tools to manage inline styles on React elements

Арганізацыя коду кампанэнтаў

Атрыбуты кампанэнтаў

Атрыбуты кампанэнту перадаюцца пры яго канструяваньні, а зьвяртацца да атрыбутаў унутры кампанэнту можна пры дапамозе this.props:


var InterfaceComponent = React.createClass({
  render : function() {
    return <div>hello {this.props.name}!</div>;
  }
});

React.renderComponent(
  <InterfaceComponent name="chris" />,
  document.body
);

Валідацыя

React прадстаўляе мэханізм валідацыі значэньняў атрыбутаў – propTypes:

Калі валідацыя не прайшла ў рэжыме распрацоўкі (ужываецца не мініміфікаваная і аптымізаваная бібліатэка React), у кансоль будзе выведзена адпаведнае папярэджаньне. У вытворчым рэжыме валідацыя ўвогуле не будзе адбывацца для лепшай хуткадзейнасьці.

Дадатковай магчымасьцю, якую прадстаўляе propTypes, зьяўляецца праверка таго, што ў кампанэнт быў перададзены дакладна адзін укладзены кампанэнт:

Змоўчныя значэньні

Можна пазначыць змоўчныя значэньні для атрыбутаў, калі яны не абавязковыя і не былі перададзеныя ў кампанэнт:

Перадача па герархіі

Бацькоўскія кампанэнты могуць перадаваць даччыным усе свае атрыбуты разам. Існуе 2 варыянты гэта рабіць.

Варыянт 1
Варыянт 2

Стан кампанэнтаў

Асноўнае правіла адносна стану кампанэнтаў – ён павінен быць мінімальна неабходным. Ня трэба захоўваць тое, што можна дынамічна разьлічыць/атрымаць. Калі кампанэнт статычны і не залежыць ад зьнешніх фактараў, у яго не павінна быць стану – усё павінна разьлічвацца ў момант адлюстраваньня. Мэтад getInitialState вызначае зыходны стан, мэтад setState усталёўвае новае значэньне зьменным, а мэтад replaceState зацірае папярэдні стан (цалкам выдаляе значэньні ўсіх зьменных стану) і ўсталёўвае новыя значэньні.

JS Bin on jsbin.com

Publisher-Subscriber pattern

Understanding the Publish/Subscribe Pattern for Greater JavaScript Scalability

AmplifyJS

PubSubJS

Add-ons і кампанэнты

UI Toolkit for React.js Websites and Apps

Add-ons at React Docs

react-components.com

Search reusable React components

react.rocks

react-motion

Material UI

Home

Flux

Redux

Redux is a predictable state container for JavaScript apps.

How to Use the react-redux Package.

Draft.js

Home

Draft.js is a framework for building rich text editors in React

Іншыя рэалізацыі rich text editors:

Aurelia

Home

Aurelia - next generation JavaScript client framework that leverages simple conventions to empower your creativity.

Angular

Home

Building a Web App From Scratch in AngularJS

Rethinking AngularJS Controllers

5 tips on how to use AngularJS with Rails that changed how we work

SSO for Your Single Page Application (Part 1/2 - AngularJS)

Ember.js

Home
Guides

Getting Into Ember.js

Let's Learn Ember

Warming Up With Ember.js

EmberJS with a Separate Rails API

Things I wish someone had told me when I was learning Ember.js

Backbone.js

Home

Getting Started with Backbone.js

Single Page ToDo Application With Backbone.js

KnockOut

Home

Into the Ring with Knockout.js

jQuery

jQuery – гэта JavaScript-бібліятэка, якая спрашчае:

доступ і маніпуляцыі з элемэнтамі DOM;
вызначэньне рэакцый на JavaScript-падзеі.
выкананьне AJAX-запытаў;
выкананьне JavaScript-эфэктаў (анімацыі).

Бібліятэка надзвычай папулярная, як вынік над ёй працуюць шмат прафісыйных адмыслоўцаў, якія адточваюць яе да дасканаласьці. Адпаведна, нягледзячы на мінусы (напрыклад, дадатковая вага старонак, якія ўтрымліваюць бібліятэку), яе адназначна ёсьць сэнс выкарыстоўваць:

амаль поўная адсутнасьць памылак;
аптымальны код, сумяшчальны з большасьцю браўзэраў;
лёгкасьць асваеньня і выкарыстаньня.

Падключыць у дакумэнт бібліятэку можна спаслаўшыся альбо на лякальную яе вэрсію, папярэдне спампаваўшы яе адсюль:

альбо на адзін з даступных CDN, напрыклад гуглаўскі:

«1» у шляху, у апошнім прыкладзе азначае запыт на апошнюю вэрсію, калі патрэбна не апошняя, а пэўная вэрсія, трэба пазначыць яе замест, напрыклад: «1.7.1». Заўважце, што перавагай спасылкі на лякальную вэрсію зьяўляецца магчымасьць працаваць зь лякальнай вэрсіяй сайту, сеціўнай праграмы, ці займацца распрацоўкай нават ня маючы сувязі з інтэрнэтам. Перавагай жа спасылкі на CDN зьяўляецца высокая верагоднасьць кэшаваньня файлу бібліятэкі і на сэрвэры, і ў лякальным браўзэры карыстальнікаў, што прывядзе да хутчэйшай загрузкі старонкі.

Доступ да элемэнтаў

У самым агульным выпадку доступ да элемэнтаў DOM адбываецца праз CSS-сэлектары:

jQuery – гэта функцыя, якая мае аліас $, такім чынам апошні прыклад можна запісаць больш кароткай формай:

У гэтых прыкладах зьменная lis будзе ўтрымліваць масіў усіх элемэнтаў li HTML-дакумэнту, у якіх сярод бацькоўскіх элемэнтаў ёсьць элемэнт ul.

jQuery-код амаль заўсёды маніпулюе з элемэнтамі дакумэнту, таму важна, каб ён выканаўся не ў адвольны момант часу, але менавіта пасьля таго моманту, калі дакумэнт будзе цалкам загружаны ў акно браўзэра. Для гэтага jQuery прадстаўляе адмысловы мэханізм:

Безназоўная функцыя, якая перадаецца ў $(document).ready(), будзе выканана толькі пасьля таго, як будзе загружаны ўвесь дакумэнт цалкам.

Доступ да дзіцячых элемэнтаў

Атрымаць усе непасрэдныя дзіцячыя элемэнты можна пры дапамозе функцыі children. У наступным прыкладзе:

зьменная lis будзе ўтрымліваць усе наўпроставыя дзіцячыя элемэнты li элемэнту ul, чыя кляса пазначана як emphasis, адзначаныя ў радках 2, 3 і 4 у прыкладзе ніжэй:

jQuery-выраз $("ul.emphasis").children("li") эквівалентны CSS-сэлектару ul.emphasis > li.

Атрымаць усе дзіцячыя элемэнты незалежна ад герархіі можна пры дапамозе функцыі find. У наступны прыкладзе:

зьменная lis будзе ўтрымліваць усе дзіцячыя элемэнты li элемэнту ul, чыя кляса пазначана як emphasis, адзначаныя ў радках 2, 3, 4 і 6 у прыкладзе ніжэй:

jQuery-выраз $("ul.emphasis").find("li") эквівалентны CSS-сэлектару ul.emphasis li.

Доступ да бацькоўскіх элемэнтаў

Аналягічна функцыям доступу да дзіцячых элемэнтаў сярод функцыяў доступу да бацькоўскіх ёсьць:

parent, якая вяртае наўпроставага бацьку ў герархіі;
parents, якая вяртае ўсе бацькоўскія элемэнты адпаведна пазначанаму CSS-сэлектару, незалежна ад герархіі;
а таксама closest, якая вяртае бліжэйшы элемэнт у бацькоўскай герархіі, улучна з самім элемэнтам, у якога гэта функцыя выклікаецца.

Доступ да элемэнтаў аднаго ўзроўню

siblings

Уявім, што мы маем наступны HTML-код:

а таксама наступны jQuery-код:

У выніку, у кансоль браўзэра будзе выведзена імя націснутай кнопкі. Для таго, каб атрымаць усе элемэнты таго ж узроўню, маецца функцыя siblings:

У выніку пры націсканьні на адну з кнопак тэкст астатніх (але не націснутай) будзе выстаўлены як «siblings».

Звужэньне набору элемэнтаў

У выпадку, калі пэўны jQuery-запыт вярнуў шэраг элемэнтаў, маюцца функцыі звужэньня гэтага набору:

функцыя first верне першы элемэнт шэрагу (альбо масіву);
last верне апошні элемэнт шэрагу;
функцыя eq верне адвольны элемэнт па ягонаму індэксу (пачынаючы з 0);
а функцыя filter звузіць набор да тых элемэнтаў, якія задаволяць перададзенаму ёй CSS-крытэру.

У выніку, у апошнім прыкладзе, мы атрымаем ня ўсе кнопкі кантэйнэра buttons, але толькі другую ў першым радку і апошнюю ў другім і чацьвертым радку. Яшчэ адзін прыклад выкарыстаньня функцыі filter:

Перамяшчэньне па наборы элемэнтаў

Таксама інсуюць функцыі перамяшчэньня па масіву элемэнтаў. У прыкладзе вышэй мы атрымалі другую кнопку кантэйнэра buttons. Цяпер мы можам атрымаць доступ да папярэдняй ці наступнай кнопцы ў гэтым наборы праз функцыі prev і next:

што эквівалентна наступнаму:

Ланцуг выклікаў

Кожная jQuery-функцыя вяртае jQuery-аб'ект, які абгортвае адпаведны(-я) JavaScript-аб'ект(-ы). Гэта дазваляе запісваць выклікі функцый у ланцуг, як можна было зразумець з папярэдніх прыкладаў. Калі ў такім ланцугу прысутнічаюць функцыі доступу да элемэнтаў, фільтрацыі набору элемэнтаў, ці перамяшчэньня па наборы, адмяніць вынік працы папярэдняй такой функцыі можна пры дапамозе функцыі end:

Вынікам будзе наступны эфэкт (панаціскайце на кнопкі):

`this`

У дадатак да таго, што ўжо апісана вышэй у дачыненьні да JavaScript, у jQuery існуе яшчэ адна магчымасьць пазначыць кантэкст функцыі (злучыць this унутры функцыі з пэўным аб'ектам) – гэта мэтад $.proxy:

ці так:

Маніпуляцыі з элемэнтамі

Атрыбуты элемэнтаў

Атрымаць і зьмяніць значэньне атрыбуту пэўнага HTML-элемэнту можна пры дапамозе варыянтаў функцыі attr. Варыянт з адным парамэтрам (назвай атрыбуту) верне значэньне атрыбуту. Варыянт з двума парамэтрамі (першы – назва атрыбуту, другі – яго значэнье) альбо дадасьць новы атрыбут з пазначаным значэньнем, альбо зьменіць значэньне існага атрыбуту на пазначанае:

Таксама існуе варыянт функцыі, у якім можна адначасна зьмяняць значэньні некалькіх атрыбутаў:

...і варыянт, калі ў якасьці друга парамэтру выкарыстоўваецца ня проста значэньне, але функцыя, якая павінна вяртаць новае значэньне, а прымае яна індэкс элемэнту ў наборы і старое значэньне атрыбуту:

Спэцыфікацыя HTML5 дазволіла выкарыстоўваць карыстальніцкія атрыбуты для элемэнтаў выгляду data-...:

Для доступу да такіх атрыбутаў у jQuery ёсьць адмысловая аліас-функцыя data:

Цалкам выдаліць пэўны атрыбут з элемэнту можна пры дапамозе функцыі removeAttr:

Даданьне зьместу

У jQuery існуе шэраг функцыяў, пры дапамозе якіх можна дадаць зьмест да старонкі. Уявім, што ў нас маецца наступны фрагмэнт дакумэнту:

Які будзе выглядаць наступным чынам:

Загаловак

Параграф 1.

Параграф 2.

Дадаць зьмест у пачатак альбо канец пэўнага элемэнту можна пры дапамозе функцыяў prepend і append адпаведна. Напрыклад, наступны скрыпт:

Дадасьць тэкст « Трохі тэксту ў параграф.» у канец апошняга (2-га) параграфу:

Загаловак

Параграф 1.

Параграф 2.

Дадаць зьмест перад альбо пасьля пэўнага элемэнту можна пры дапамозе функцыяў before і after адпаведна. Напрыклад, наступны скрыпт:

Дадасьць тэкст «Трохі тэксту перад параграфам.» перад апошнім параграфам:

Загаловак

Параграф 1.

Параграф 2.

Як можна заўважыць фарматаваньне дададзенага фрагмэнту адрозьніваецца ад фарматаваньня параграфаў. Гэта таму, што тэкст быў дададзены як звычайны тэкст наўпрост у артыкул, што ў большасьці выпадкаў не зусім правільна. Правільней было б стварыць новы элемэнт параграфу з тэкстам унутры і ўставіць яго ў дакумэнт. Для гэтага існуюць функцыі appendTo, prependTo, insertBefore і insertAfter. Напрыклад, папярэдні прыклад больш правільна было б рэалізаваць наступным чынам:

Загаловак

Параграф 1.

Параграф 2.

Па-першае, зьвярніце ўвагу на тое, што выкарыстаньне гэтых апошніх чатырох функцыяў іншае ў параўнаньні зь першымі чатырма. У гэтыя функцыі перадаецца ня новы зьмест, а існыя элемэнты, у якія (ці пасьля/перад якімі) трэба ўставіць зьмест.

Па-другое, зьвярніце ўвагу на тое, што код $("<p>Новы параграф.</p>") будзе не шукаць элемэнт на старонцы, а створыць цалкам новы элемэнт, які пасьля дадзенага выкліку будзе існаваць адно толькі ў памяці кампутара, і толькі пасьля выкліку функцыі insertBefore будзе ўстаўлены ў дакумэнт.

Таксама трэба заўважыць, што фрагмэнт $("<p>Новы параграф.</p>") не зусім адпавядае добрай практыцы напісаньня JavaScript. Лепш яго перапісаць наступным чынам:

Для большай нагляднасьці пашырым гэты прыклад, каб пазначыць class і id новага элемэнту:

Варта закрануць яшчэ адзін нечаканы эфэкт ужываньня функцыяў appendTo, prependTo, insertBefore і appendTo. Калі яны выклікаюцца ня ў створанага элемэнту, але ў існага, адбываецца перанос гэтага элемэнту з першапачатковай пазыцыі на старонцы ў новую пазыцыю. Наступны код:

Прывядзе да пераносу загалоўку з пачатку артыкула ў яго канец:

Загаловак

Параграф 1.

Параграф 2.

Апрацоўка падзеяў

Функцыі bind і unbind прызначаліся раней для усталёўкі і зьняцьця апрацоўшчыкаў падзеяў на і з пэўных элемэнтаў, якія на дадзены момант знаходзяцца ў дакумэнце. Адпаведна, элемэнты, якія былі дададзеныя да дакумэнту пазьней, ня мелі гэтага апрацоўшчыка. Пазьней зьявіўся мэтад, які пазбаўляўся ад гэтага недахопу – live, і парны для яго die. Ён дадаваў пазначаны апрацоўшчык падзеі ня толькі да існых элемэнтаў, адпавядаючых крытэру, але і да ўсіх тых, якія зьўляліся ў дакумэнце пазьней. Потым зьявіліся delegate/undelegate. Ідэя апошніх была ў тым, што ў выпадку, калі ў дакумэнце існуе шмат ідэнтычных элемэнтаў, і ўсе яны павінны аднолькава рэагаваць на пэўную падзею, усталёўваць на іх усіх адзін і той жа апрацоўшчык нямэтазгодна, асабліва калі такіх элемэнтаў можа быць сотні ці тысячы – гэта можа вельмі значна запаволіць працу старонкі. Замест гэтага лепш усталяваць адзін апрацоўшчык, на іх бацькоўскіх элемэнт, і каб ён дэлегаваў апрацоўку сваім адпаведным даччыным элемэнтам. Адсюль і назва мэтаду. Трэба заўважыць, што тое ж самае можна было зрабіць і з дапамогай функцыі live, але delegate ня проста меў такую магчымасьць, яго назва і сынтакс накіроўвалі распрацоўшчыкаў у бок лепшай практыкі.

Але, гэта ўсё перадгісторыя, на самай справе ў jQuery, пачынаючы з вэрсіі 1.7, былі ізноў уведзены новыя функцыі – on і off, якія павінны былі ўвасобіць у сабе самае лепшае сваіх папярэднікаў, а ўсе вышэйпералічаныя былі пазначаныя як непажаданыя да выкарыстаньня. Яны засталіся ў бібліятэцы, але зьяўляюцца на дадзены момант нічым іншым як аліас-функцыямі да актуальных on і off.

Разгледзем навочны прыклад. Возьмем элемэнт dl з прыкладу вышэй, дзе 5 разоў зьмяшчаецца тэрмін What are your hours? і яго вызначэньне We are open 24/7. Пры дапамозе наступнага коду:

можна дасягнуць наступнага выніку (панаводзьце курсар мышы на розныя элемэнты):

What are your hours?: We are open 24/7.
What are your hours?: We are open 24/7.
What are your hours?: We are open 24/7.
What are your hours?: We are open 24/7.
What are your hours?: We are open 24/7.

Апрацоўшчык падзеі mouseenter (кажучы мовай CSS – hover) будзе ўсталяваны не на кожны элемэнт dt, але на ўвесь сьпіс dl, прычым апрацоўку падзеі сьпіс будзе дэлегаваць адпаведнаму элемэнту dt (на які быў наведзены курсар мышы). Дэлегаваць не ў наўпроставым сэнсе, а ў тым, што $(this) у апрацоўшчыку будзе спасылацца на адпаведны dt-элемэнт.

Тыпы падзеяў

У табліцы ніжэй прыведзеныя магчымыя тыпы падзеяў.

Тып падзеі	Апісаньне
`blur`	Падзея дасылаецца элемэнту, калі той губляе фокус. Раней падзея ўжывалася толькі для элемэнтаў формаў, зараз – да любых элемэнтаў старонкі. Парная падзея да падзеі `focus`.
`change`	Падзея дасылаецца элемэнту, калі зьмяняецца яго значэньне. Ужываньне абмежаванае элемэнтамі `input`, `textarea` і `select`. У выпадку чэкбоксаў, радыёкнопак і сэлектбоксаў падзея дасылаецца адразу ж пасьля зьмены значэньня. У выпадку астатніх элемэнтаў падзея дасылаецца толькі пасьля таго, як зь іх сыйдзе фокус.
`click`	Падзея дасылаецца элемэнту, калі над элемэнтам знаходзіцца курсар мышы і была націснутая (падзея `mousedown`) і вызвалена (падзея `mouseup`) яе кнопка. Для спрацоўваньня гэтай падзеі патрэбна менавіта пасьлядоўнасьць гэтых дзьвюх апэрацыяў, а не асобныя зь іх. Ужываецца да любых элемэнтаў старонкі.
`dblclick`	Падзея дасылаецца элемэнту, калі над элемэнтам знаходзіцца курсар мышы і была пасьлядоўна 2 разы націснутая і вызвалена яе кнопка. На адзін і той жа элемэнт не рэкамэндуецца ўсталёўваць адначасова апрацоўшчыкі падзеяў `click` і `dblclick`. Ужываецца да любых элемэнтаў старонкі.
`error`	Падзея дасылаецца элемэнту, напрыклад выяве, калі яго рэсурс ня можа быць згружаны звонку (няправільная спасылка, тып рэсурсу альбо памылка выкананьня скрыпту).
`focus`	Падзея дасылаецца элемэнту, калі той атрымлівае фокус. Па змоўчаньні фокус могуць атрымаць толькі элемэнты формы і спасылкі, але элемэнту любога тыпу можна пазначыць атрыбут `tabindex`, тады ён таксама будзе здольны атрымаць фокус. Парная падзея да падзеі `blur`.
`focusin`	Падзея дасылаецца элемэнту, калі ён альбо адзін з яго даччыных элемэнтаў атрымлівае фокус. Парная падзея да падзеі `focusout`.
`focusout`	Падзея дасылаецца элемэнту, калі ён альбо адзін з яго даччыных элемэнтаў губляе фокус. Парная падзея да падзеі `focusin`.
`keydown`	Падзея дасылаецца элемэнту, калі карыстальнік націскае нейкую кнопку клавіятуры, але толькі ў тым выпадку, калі гэты элемэнт утрымлівае фокус. Парная падзея да падзеі `keyup`.
`keypress`	Падзея дасылаецца элемэнту, калі браўзэр рэгіструе націсканьне кнопкі клавіятуры, але толькі ў тым выпадку, калі гэты элемэнт утрымлівае фокус. Падзея падобная да `keydown`. Адрозьненьні ў тым, што пры націсканьні й утрымліваньні націснутай пэўнай кнопкі клавіятуры `keydown` спрацуе адзін раз, а `keypress` тым часам спрацуе столькі разоў, колькі будзе пры гэтым ўстаўлена сымбаляў (напрыклад, у тэкставае поле). Таксама адрозьненьні ў тым, што пры націсканьні мадыфікацыйных кнопак (Shift, Ctrl і г.д.) падзея `keydown` спрацуе, а `keypress` – не.
`keyup`	Падзея дасылаецца элемэнту, калі карыстальнік адпускае раней націснутую кнопку клавіятуры, але толькі ў тым выпадку, калі гэты элемэнт утрымлівае фокус. Парная падзея да падзеі `keydown`.
`load`	Падзея дасылаецца элемэнту, калі яго зьмест і ўсіх яго даччыных элемэнтаў цалкам запампаваны ў старонку. Ужываецца толькі для тых элемэнтаў, якія могуць быць зьвязаны з URL'ам: выявы, скрыпты, фрэймы і вокны.
`mousedown`	Падзея дасылаецца элемэнту, калі націснулі кнопку мышы і пры гэтым курсар мышы знаходзіўся над гэтым элемэнтам. Ужываецца да любых элемэнтаў старонкі. Парная падзея да падзеі `mouseup`.
`mouseenter`	Падзея дасылаецца элемэнту, калі курсар мышы «заходзіць» на яго. У адрозьненьні ад падзеі `mouseover` ня будзе дасланая бацькоўскаму элемэнту, калі курсар мышы «зойдзе» на яго даччыны элемэнт, які графічна знаходзіцца ў межах гэтага бацькоўскага элемэнту, над ім. Ужываецца да любых элемэнтаў старонкі. Парная падзея да падзеі `mouseleave`.
`mouseleave`	Падзея дасылаецца элемэнту, калі курсар мышы «сыходзіць» зь яго. У адрозьненьні ад падзеі `mouseout` ня будзе дасланая бацькоўскаму элемэнту, калі курсар мышы «сыйдзе» зь яго даччынага элемэнту, які графічна знаходзіцца ў межах гэтага бацькоўскага элемэнту, над ім. Ужываецца да любых элемэнтаў старонкі. Парная падзея да падзеі `mouseenter`.
`mousemove`	Падзея дасылаецца элемэнту, калі курсар мышы рухаецца над гэтым элемэнтам, пры гэтым незалежна ад таго, наўпрост над ім, альбо над адным зь яго дзіцячых элемэнтаў. Ужываецца да любых элемэнтаў старонкі.
`mouseout`	Падзея дасылаецца элемэнту, калі курсар мышы «сыходзіць» зь яго. У адрозьненьні ад падзеі `mouseleave` будзе дасланая бацькоўскаму элемэнту, нават калі курсар мышы «сыйдзе» зь яго даччынага элемэнту, які графічна знаходзіцца ў межах гэтага бацькоўскага элемэнту, над ім. Ужываецца да любых элемэнтаў старонкі. Парная падзея да падзеі `mouseover`.
`mouseover`	Падзея дасылаецца элемэнту, калі курсар мышы «заходзіць» на яго. У адрозьненьні ад падзеі `mouseenter` будзе дасланая бацькоўскаму элемэнту, нават калі курсар мышы «зойдзе» на яго даччыны элемэнт, які графічна знаходзіцца ў межах гэтага бацькоўскага элемэнту, над ім. Ужываецца да любых элемэнтаў старонкі. Парная падзея да падзеі `mouseout`.
`mouseup`	Падзея дасылаецца элемэнту, калі адпусьцілі кнопку мышы і пры гэтым курсар мышы знаходзіўся над гэтым элемэнтам. Парная падзея да падзеі `mousedown`.
`resize`	Падзея дасылаецца элемэнту `window`, калі зьмяняецца памер акна браўзэра.
`scroll`	Падзея дасылаецца аконным, фрэймавым элемэнтам, ці любым іншым, чый CSS-атрыбут `overflow` мае значэньне `scroll`, калі пазыцыя яго скролінгу зьмяняецца.
`select`	Падзея дасылаецца элемэнтам, калі карыстальнік зьмяняе абраньне тэксту ў ім. Падзея ўжываецца толькі для элемэнтаў `input type="text"` і `textarea`.
`submit`	Падзея дасылаецца элемэнту `form`, калі адбываецца спроба яе сабміту (дасылкі даных).
`unload`	Падзея дасылаецца элемэнту `window`, калі адбываецца зьмена адрасу старонкі. Падзея генэрыцца ня толькі пры наўпроставай зьмене адрасу: кнопкі «назад» і «ўперад» браўзэра, пераход па спасылцы, увод новага адрасу ў адрасны радок, але таксама пры ўскосным дзеяньні: перагрузка той жа самай старонкі і нават закрыцьцё акна ці ўстаўкі браўзэра.

20 Helpful jQuery Methods you Should be Using

An Introduction to jQuery Templating

jQuery Templating and AJAX

Display Elements Sequentially with jQuery

Progressively Enhance a Form to a Modal Form

Create an AJAX/jQuery/PHP Contact Form

Sliding labels on form

14 Helpful jQuery Tricks, Notes, and Best Practices

Uncovering jQuery’s Hidden Features

Quick Tip: Think Right-to-Left with jQuery

jQuery replaceText

jQuery 1.4 Released: The 15 New Features you Must Know

jQuery Animations: A 7-Step Program

CheatSheet

8 Great Websites to Learn Step-by-Step jQuery

Using jQuery To Manipulate and Filter Data

Building better web forms: Context highlighting using jQuery

From jQuery to JS

From jQuery to JavaScript: A Reference

jQuery UI

jQuery UI

What’s Changed in jQuery UI 1.8

Coding your First jQuery UI Plugin

jQuery UI 101: The Essentials

Дадаткі і бібліятэкі

Home

A repository of over 1000 quality jQuery plugins

41 Remarkable and useful jQuery Plugins

Popular jQuery Plugins

Best jQuery Plugins for 2010

25 Amazing and Fresh jQuery Plugins

15 Best of the best jQuery Plugins in 2010

Best jQuery Plugins of 2010

10 Useful jQuery Plugins

10 Useful jQuery Plugins and Techniques

BlockUI

Placeholder

jQuery Tools

Enhancing Web Apps with AmplifyJS

SubWay map plugin.

jQuery plugins

Chico UI

nestedSortable jQuery Plugin

HTML5 Sortable - jQuery plugin to create sortable lists and grids using native HTML5 drag and drop API

Формы

75+ Top jQuery Plugins to improve Your HTML Forms

55 jQuery Form Plugins To Download And Use

Элемэнт `select`

SelectBox Plugin

Select2 Plugin

DropKick – painless custom dropdowns

Тэкставыя палі

Input & Textarea Character Limit Display with jQuery

Табліцы

Picnet table filter

DataTables

A Responsive Design Approach for Complex, Multicolumn Data Tables

Excel-like table editor in HTML & jQuery

Выявы, слайды, буклеты

supersized – fullscreen background slideshow ад BuildInternet.com

mosaic – sliding boxes and captions ад BuildInternet.com

totem – animated vertical ticker ад BuildInternet.com

thumbreel – fluid thumbnail bar ад BuildInternet.com

BookBlock – a content flip plugin

Пастаронкавая навігацыя

jPaginator screenshot

Адкладзеная загрузка

Waypoints – унівэрсальны jQuery-дадатак, які дазваляе прычапляць апрацоўшчыкі падзеі, калі пэўны элемэнт старонкі трапляе ці наадварот зьнікае з экрану пры скролінгу. Гэта дазваляе рабіць ня толькі адкладзеную загрузку зьместу старонкі па патрэбе, але і шмат чаго іншага. На старонцы дадатку прыведзеныя варыянты магчымага выкарыстаньня, а таксама апісаньне.

Іншыя дадаткі адкладзенай загрузкі зьместу старонкі: 12 jQuery Infinite Scrolling(scroll & read) Plugins for Content Navigation.

Час

Smart Time Ago – дадатак, які аўтаматычна вызначае колькі часу прайшло з пазначанай даты, выводзіць гэтую інфармацыю ў элемэнт старонкі і абнаўляе яе з пазначанай пэрыядычнасьцю.

Лікі, грошы, валюты

Credit card validation plugin.

jQuery Credit Card Validator.

Клавішныя скароты

js-hotkeys

keymaster

jKey

Падказкі

30 Stylish jQuery Tooltip Plugins For Catchy Designs

20 Examples of jQuery Tooltip Plugins

jQuery plugin: Tooltip

jQuery для чайников | Всплывающая подсказка | Плагин Tooltip

iPicture - Tooltip your images

Zepto.js

Zepto.js

Мінімалістычны аналяг jQuery (амаль ідэнтычны API) з падтрымкай толькі сучасных браўзэраў.

ExpandJS

ExpandJS

Modular library with 100+ custom elements and 350+ utility functions to kickstart your Web Applications.

Тэхналёгіі

AJAX

24 Best Practices for AJAX Implementations

Cross Domain AJAX Request with YQL and jQuery

AJAX-падзеі:

ajax:before – right before ajax call
ajax:loading – before ajax call, but after XmlHttpRequest object is created)
ajax:success – successful ajax call
ajax:failure – failed ajax call
ajax:complete – completion of ajax call (after ajax:success and ajax:failure)
ajax:after – after ajax call is sent (note: not after it returns)

JSON

JSON: What It Is, How It Works, and How to Use It

Прылады

Сьцісканьне скрыптоў

Добрая практыка

JSLint

Прылада правярае ці адпавядае напісаны вамі скрыпт пэўным крытэрам «добрай практыкі».

JSHint – прыкладна тое ж самае.

Карысныя спасылкі

Комплексная дакумэнтацыя

Даведнікі і кнігі

Урокі

Блогі

Рознае

Агляд

Што такое JavaScript?

JavaScript і Java

JavaScript і ECMAScript

Лексычная структура

Набор сымбаляў

Адчувальнасьць да рэгістру

Сымбалі-падзяляльнікі і пераводы радкоў

Неабавязковыя кропка з коскай

Камэнтары

Літаралы

Ідэнтыфікатары

Ключавыя словы

Тыпы даных, значэньні і зьменныя

Аб'екты-абгорткі

Лікі

Цэлыя літаралы

Рэчаісныя літаралы

Аб'ект-абгортка

Атрыбуты

Прыклады

Мэтады

Аб'ект NaN

Праца з лікамі

Аб'ект Math

Атрыбуты

Мэтады

Утварэньне з чародаў

Праверкі

Сымбальныя чароды

Літаралы

Аб'ект-абгортка

Праца з чародамі

Пераўтварэньні ў лікі і наадварот

Лягічныя значэньні

Аб'ект-абгортка

Пераўтварэньні лягічных значэньняў

Значэньне null

Значэньне undefined

Пераўтварэньні тыпаў

Пераўтварэньні і роўнасьць

Пераўтварэньні аб'ектаў у элемэнтарныя тыпы

Зьменныя аб'екты і нязьменныя элемэнтарныя значэньні

Зьменныя

Аб'яўленьні

Вобласьць бачнасьці

Выразы

Апэрацыі

Прысваеньня

Скарочаныя формы прысваеньняў

Параўнаньня

Арытмэтычныя

Унарныя

Бінарныя

Бітавыя

Лягічныя

Прыклады

Асаблівыя

Умоўная

Апэрацыя-коска

void

Інструкцыі

Інструкцыі-выразы

Пустыя і састаўныя

Аб'яўленьняў

function

var

Умоўныя

if...else

switch

Цыклаў

while

do...while

for

Аб'ект `NaN`

Аб'ект `Math`

Значэньне `null`

Значэньне `undefined`

`void`

`function`

`var`

`if...else`

`switch`

`while`

`do...while`

`for`

`for...in`

`break`

`continue`

`return`

`throw`

`try...catch`

`with`

`delete`

`in`

`instanceof`

`new`

`this`

`typeof`

`get`

`set`

`Array`

`Date`

`Error`

`RangeError`

`Function`

`apply`

`bind`

`call`

`isGenerator`

`toString`

`Object`

`RegExp`

Пераўтварэньне ў `boolean` праз `!!`

Пераўтварэньне ў лік праз `+`

Змоўчныя значэньні праз `||`