JavaScript
 | Тази статия се нуждае от вниманието на редактор с по-задълбочени познания. Ако смятате, че имате необходимите знания, подобрете тази страница. |
| JavaScript | |
 Неофициално лого JSConf EU 2011 | |
| Парадигма | обектно ориентиран |
|---|---|
| Реализиране през | 1995 |
| Автор | Брендан Айк |
| Типизация на данните | динамична |
| Повлиян от | Self, C, Scheme, Perl, Python, Java |
| Повлиява | Objective-J |
| JavaScript в Общомедия | |
JavaScript е интерпретируем език за програмиране, разпространяван с повечето уеб браузъри. Поддържа обектно ориентиран и функционален стил на програмиране. Създаден е в Netscape през 1995 г. Най-често се прилага към HTML кода на интернет страница с цел добавяне на функционалност и зареждане на данни. Може да се ползва също за писане на сървърни скриптове JSON, както и за много други приложения. JavaScript не трябва да се бърка с Java, съвпадението на имената е резултат от маркетингово решение на Netscape. Javascript е стандартизиран под името EcmaScript.
История[редактиране | редактиране на кода]
JavaScript е разработен първоначално от Брендан Айк под името Mocha, като по-късно е преименуван на LiveScript и накрая на JavaScript. LiveScript е официалното име на езика когато за първи път бива пуснат в бета версиите на Netscape Navigator 2.0 през септември 1995 г., но е преименуван на JavaScript на 4 декември 1995 г.[1]
Описание[редактиране | редактиране на кода]
JavaScript е програмен език, който позволява динамична промяна на поведението на браузъра в рамките на дадена HTML страницата. JavaScript се зарежда, интерпретира и изпълнява от уеб браузъра, който му осигурява достъп до Обектния модел на браузъра. JavaScript функции могат да се свържат със събития на страницата (например: движение/натискане на мишката, клавиатурата или елемент от страницата, и други потребителски действия). JavaScript е най-широко разпространеният език за програмиране в интернет. Прието е JavaScript програмите да се наричат скриптове.
Възможности[редактиране | редактиране на кода]
JavaScript може да влияе на почти всяка част от браузъра. Браузъра изпълнява JavaScript кода в цикъла на събития т.е. като резултат от действия на потребителя или събития в браузъра (например document.onLoad).
Основни задачи в повечето JavaScript приложения са:
- Зареждане на данни чрез AJAX.
- Ефекти с изображения и HTML елементи: скриване/показване, пренареждане, влачене, слайд шоу, анимация и много други.
- Управление на прозорци и рамки.
- Разпознаване на възможностите на браузъра.
- Използване на камерата и микрофона.
- Създаване на 3D графики WebGL.
- По-добър и гъвкав потребителски интерфейс
Какво не може да се прави с помощта на JavaScript:
- Не може да се записва информация на потребителския компютър или отдалечения сървър.
- Не може да се запазва информация директно в отдалечена база данни.
- Не може да се стартират локални приложения.
Разлики с Java[редактиране | редактиране на кода]
Освен съвпадението в част от името, двата езика нямат кой знае какви прилики, дори са разработени от различни корпорации (Java е дело на Sun, a JavaScript е разработка на Netscape). Java е популярен език за програмиране не само на интернет приложения, но и на самостоятелни програми за различни платформи. Интернет приложенията на Java се наричат аплети. Те са файлове с разширение .class и се вмъкват в HTML документа между таговете <applet> и </applet>.
Основи на езика[редактиране | редактиране на кода]
Зареждане[редактиране | редактиране на кода]
JavaScript кодът може да се вмъква в HTML документа между двойката елементи <script> и</script>. Когато срещне тага <script>, браузърът разбира, че трябва да спре интерпретирането на HTML кода и да започне да обработва скрипта, намиращ се между <script> и </script>. Този скрипт не е задължително да бъде написан на JavaScript. Има и други езици за писане на скриптове, например VBScript. Но езикът по подразбиране е JavaScript. В следния пример създаваме уеб страница в която е вмъкнат JavaScript код, който да изписва на екрана „Здравей!“
<!Doctype HTML> <html> <head> <title>javascript</title> </head> <body> <script> document.write("Здравей!"); </script> </body> </html> Препишете горния код в някой текстов редактор и запазете файла като hi.html. След това го отворете с някой браузър.
Другият начин да заредите JavaScript е да го поставите в отделен файл. В следващия пример отново ще напишем „Здравей“ на екрана, но ще заредим скрипта си от отделен файл.
Първо създаваме файла Hello.js:
document.write("Здравей!"); След което трябва да променим Hello.html от предходния пример по следния начин:
<!-- <script> document.write("Здравей!"); </script> --> <script src="Hello.js"></script> Това разделение на javascript логиката от HTML структурата е един от основните принципи на Софтуерното инженерство.
Променливи[редактиране | редактиране на кода]
Променливите в JavaScript са динамични и могат да съдържат стойности от всеки тип. Декларират се чрез ключовата дума var следвана от името на променливата или списък от променливи. Възможно е също да присвоите стойност на променливата при декларация чрез оператора =. По подразбиране стойността на променливата ще бъде undefined.
var greeting = "Здравей!", x = 42; document.write(greeting); Тук имаме списък от променливи. Името на първата е greeting, а стойността ѝ е „Здравей!“. Kогато отпечатваме променливата greeting ние всъщност отпечатваме стойността ѝ „Здравей!“.
Имена на променливи[редактиране | редактиране на кода]
Имената на променливите в JavaScript не трябва да започват с цифра, могат да започват с малка или голяма буква, _ или $ и да съдържат само тези знаци както и числа. Всички останали символи са забранени. Името на променливата не може да е ключова дума или оператор.
//Валидни имена на променливи: var ninja, apples_and_oranges, var56, $, nutsAndBolts; //Невалидни имена на променливи: var 3, var, "test", if, while, 5wtx1; Обхват на променливите[редактиране | редактиране на кода]
В JavaScript има два вида обхват за променливите: функционален и глобален.
- Функционален обхват важи за всяка променлива обявена чрез
varв рамките на дадена функция. Тази променлива е видима единствено в рамките на тази функция. - Глобален обхват важи за всяка променлива обявена извън функция или без
var, дори и във функция. Тази променлива е видима от всеки друг код на страницата.
Константи[редактиране | редактиране на кода]
От версия ES6 на ECMAScript е възможно декларирането на константи с ключовата дума const. В миналите версии на езика даден обект може да се замрази object.freeze(myConstants); което спира промяната на стойностите на членовете му.
//Деклариране на константа с числото Пи: const PI = 3.141592653589793; //Използване на константата при инициализация на друга променлива var a = PI * 2; //Ще върне грешка "TypeError", защото константите не могат да бъдат променяни PI = 3.14; Прости типове данни[редактиране | редактиране на кода]
В JavaScript има няколко основни прости типа данни:
- Числа – всички числа в JavaScript са представени по един и същи начин в паметта. Няма отделна категории за целочислени и дробни.
- Низове – низовете се ограждат с единични или двойни кавички и могат да съдържат всеки друг знак.
- Булеви – само две стойности: true и false.
//Инициализиране на числова променлива: var a = 3; //Инициализиране на променлива с низ var b = "JavaScript iz kuwl"; //Инициализиране на булева променлива var c = true; //Извеждане на типа на данните в променливите alert(typeof a); alert(typeof b); alert(typeof c); Този пример създава променливи с начална стойност от три различни типа данни, поддържани от JavaScript. Първо използваме ключовата дума typeof, за да върне типовете данни и след това ги подаваме като параметри на функцията alert за да бъдат показани в диалогов прозорец.
Оператори[редактиране | редактиране на кода]
Езикът JavaScript притежава два вида оператори, с един или два аргумента. Единичните (едноаргументни) оператори променят стойността на дадена променлива или израз в скоби, докато двойните (двуаргументни) оператори връщат нова стойност като резултат.
var sum = 5 + 7; //sum става 12 var negative = -9; //отрицателният знак може да е и едно- и двуаргументен var subtraction = 12 – 7; //subtraction става 5 | Сравнителен оператор | Действие |
|---|---|
| == | Равенство, не се препоръчва |
| != | Неравенство, не се препоръчва |
| === | Стриктно равенство |
| !== | Стриктно неравенство |
| < | По-малко |
| > | По-голямо |
| <= | По-малко или равно |
| >= | По-голямо или равно |
Стриктното равенство/неравенство проверява стойността или типа на променливите.
Равенството/неравенството проверява само стойността и не се препоръчва защото ако се провери „1“ и 1 това е вярно, но „1“ е низ а 1 е число!!!
| Аритметичен оператор | Действие |
|---|---|
| + | Събиране |
| – | Изваждане |
| * | Умножение |
| / | Деление (без остатък) |
| % | Деление (с остатък) |
var five = 5, seven = 7, greeting = "Здравей!"; document.write(five + seven); //изписва сбора на five и seven т.е. 12 document.write("<br />"); //добавя HTML тага за нов ред document.write(greeting + five); //изписва "Здравей!5" Забележете че резултата от събирането на greeting и five е „Здравей!5“. Когато стойността на едната или двете променливи не е число, резултатът е стойностите „слепени“ в нов низ.
| Логически оператор | Действие |
|---|---|
| ! | (логическо отрицание) |
| && | И (логическо умножение) |
| || | Или (логическо събиране) |
//при присвояване на стойност могат да се използват оператори //например: var x = 5; x = x + 5; // x става 10 x += 5; // също добавя 5 към x var y = 12; y -= 1; // y става 11 y *= 2; // y става 24 Сложни типове данни[редактиране | редактиране на кода]
Абстрактните типове данни в JavaScript са полезни. Те включват масиви, функции и обекти.
Масиви[редактиране | редактиране на кода]
Масивите съдържат списък от елементи и се бележат с [].
// създаване на нов масив: var empty = []; // празен масив var my_data = [1, 2, 3, "Hi!", "Bye!", -2.11 ]; var array_of_arrays = [[1, 2, 3], [4, 5, 6], "Anything else?"]; // масив от масиви Тъй като JavaScript е динамичен език, елементите от масива могат да са от различен тип. Един масив може да съдържа други масиви, обекти и функции.
Функции[редактиране | редактиране на кода]
Функциите съдържат код, който ще бъде изпълнен когато функцията бъде извикана. Функцията винаги връща стойност, а ако в края няма return функцията връща undefined. Функциите могат да приемат параметри (аргументи) и да връщат резултат от всякакъв вид: число, текст, обект, масив или друга функция.
// декларация на функция "Кажи "Здравей!" с параметър "име"; връща текста "Здравей, _име_ !" function SayHello(name) { return "Здравей, " + name + "!"; } // този запис е еквивалентен на горния запис: var SayHello = function(name) { return "Здравей, " + name + "!"; }; // извикване на функцията "Кажи "Здравей!" SayHello("Иван"); // Здравей, Иван! Функциите са много гъвкави структури и са едно от най-добрите неща в JavaScript. Позволяват за логическо затваряне и обособен обхват на променливите.
// създаване на нова функция, която връща функция, която връща името на зададеното като параметър число: // външната функция се изпълнява веднага след като е дефинирана var numberName = (function() { var names = ["нула", "едно", "две", "три", "четири", "пет", "шест", "седем", "осем", "девет", "десет"]; return function(n) { return names[n]; }; }()); numberName(6); // връща "шест" Обекти[редактиране | редактиране на кода]
Обектите съдържат свойства и методи. Те са съвкупност от данни и функции, които работят за изпълнението на свързана задача, бележат се с {}.
// създаване на нов обект "студент" със свойства име, оценка и функция за дрямка: var student = { name : "Иван", grade : 4.50, nap : function() { this.grade -= 0.5; return "ZzZ"; } }; // прилагане на метода на студента за дрямка и извеждане на оценката student.nap(); alert(student.grade); Чести грешки при програмиране с JavaScript[редактиране | редактиране на кода]
Много пъти ще видите JavaScript кода обвит в HTML коментар. Към 2013 г. тази практика е излишна. Някои по-стари браузъри, които вече не са в употреба, не разбират JavaScript. Затова трябва да скривате скрипта в HTML коментари. Така по-старите версии на браузърите ще помислят JavaScript кода за коментар и няма да съобщят за грешка.
Ето как ще изглежда скрипт заграден с коментари: Не го правете освен ако не искате да поддържате много стари браузъри!!!
<script> <!-- document.write("Здравей!") //--> </script> Функцията document.write не се препоръчва, защото може да има неочаквани резултати (подмяна на съдържането). В следващия пример използваме един от чистите начини да вмъкнем HTML таг:
<script> document.body.innerHTML += "<h1>Здравей!</h1>"; </script> Източници[редактиране | редактиране на кода]
- ↑ A Short History of JavaScript // Web Education Community Group Wiki. Архивиран от оригинала на 2013-07-25. Посетен на 16 юли 2013. (на английски)