Простий JavaScript

Де писати код?

<script type='text/javascript'> 
    /* сюди код */
</script>

<script src='URL/до/вашого/js/файлу.js'> </script>

Коментарі

//даний коментар від початку подвійного слешу до нового рядка

/* даний коментар може 
містити безліч рядків */

Змінні

var var_name ;
var _varname ;

• числа;
• рядки символів;
• бульове значення;

var myvar ; 

myvar = 10 ; /* ціле число */ 
myvar = 3.1415 ; /* дійсне число */ 
myvar = 'My super' + " value" ; /* рядок (конкатенація рядків) */ 
myvar = true ; /* бульове значення */ 

myvar = {x: 10, y: 15 } ; /* об'єкт з властивостями x і y */
myvar.z = 3 ; /* додаємо нову властивість до об'єкту */

myvar = [1, 2, 10, 5] ; /* масив значень */
myvar[4] = 15 ; /* додаємо новий елемент до масиву */

myvar = {} ; /* також об'єкт без властивостей */
myvar = [] ; /* і пустий масив */

var a = '2' ; /* рядок символів */
var b = 2 ; /* цілочисельне значення */
var c = a + b ; /* c = 22 */

Оператори вибірки

if ( /* логічна умова */ )
{
	/* оператори, які виконуються при істинності умови */
}
else
{
	/* оператори, які виконуються при не істинності умови */
}

if ( /* логічна умова 1 */ )
{
	/* оператори, які виконуються при істинності умови 1 */
}
else if (/* логічна умова 2 */ )
{
	/* оператори, які виконуються при істинності умови 2 */
}
else
{
	/* оператори, які виконуються при хибності попередніх умов  */
}

if ( /* логічна умова */ )
{
	/* оператори, які виконуються при істинності умови */
}

/* умова */ ? /* значення при істинності умови*/ : /* значення при помилковості умови */ ;

switch (/* умовний вираз, або змінна */)
{
	case /* ймовірне значення змінної 1 */ :
		/* оператори випадку 1 */
		break ;

	/* інші case-оператори */

	default: 
		/* операції з даного блоку виконуються, коли 
		** не справдилась жодна з попередніх умов */
}

Цикли

• цикл з передумовою (while);
• цикл з після умовою (do/while);
• цикл for.

while ( /* умова */ )
{
	/* дані оператори виконуються циклічно
	** поки дійсна умова */
}

do
{
	/* оператори тіла циклу з після умовою */
}
while ( /* умова */ ) ;

for (/* ініціалізація умов циклу*/; /* перевірка умов ітерацій */; /* інкремент змінних */)
{
	/* оператори тіла циклу */
}

for ( /* змінна */ in /* об'єкт */)
{
	/* оператори тіла циклу */
}

for (var i=0; i<5; ++i)
{
	if (i==3)
	{ continue ; }

	alert (i) ; /* дана функція виводить повідомлення */
}

for (var i=0; i<5; ++i)
{
	if (i==3)
	{ break ; }

	alert (i) ; /* дана функція виводить повідомлення */
}

var a = 0;

while (a<5)
{
	alert (a) ;
}
/* інкремент змінної a */

/* безкінечний цикл for */
for (;;)
{}

do
{
	alert (a) ;
}
while (a=0) ;
/* оператор = завжди повертає true */

Математичні і логічні оператори

var result ;

result = 2 + 2 ; /* result містить 4 */
result = 2 - 2 ; /* result містить 0 */
result = 2 * 3 ; /* result містить 6 */
result = 6 / 3 ; /* result містить 2 */
result = 5 % 2 ; /* result містить 1 */
result = 2 + 2 * 2 ; /* result містить 6 */
result = (2 + 2)* 2 ; /* result містить 8 */

result = 2 ;
result += 2 /* result містить 4, аналогічно result = result + 2 */

result = 2 ;
result *= 2 /* result містить 4 аналогічно result = result * 2 */

result = 5 ;
result %= 2 /* result містить 1 аналогічно result = result % 2 */

var result ;

result = 10 > 20 ; /* result містить false */
result = 10 <= 20 ; /* result містить true */
result = true && false ; /* result містить false */
result = true || false ; /* result містить true */
result = !false ; /* result містить true */
result = true != true /* result містить false */

var result ;
var a = 5 ;

result = a > 2 + 4 ;

var result ;
var a = 5 ;

result = (a > 2) + 4 ;

Функції

function /* ідентифікатор функції */ ( /*параметри функції через кому */ )
{
	/* оператори або код тіла функції */
}

function myfunction (str1, str2)
{
    return str1.length - str2.length ;
}

var s1 = “AAA” ;
var s2 = “A” ;

var result = myfunction (s1, s2) ; /* result містить 2 */

/* функція, яка виводить повідомлення */
function show (msg)
{ alert (msg) ; }

var obj = {} ; /* створюємо пустий об'єкт */

/*створюємо нову властивість об'єкту 
** і записуємо в нього адресу функції */
obj.method = show ;

/* викликаємо функцію show */
obj.method('Hallo, World') ;

Приклад

<html>

 <head>
 
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />	
 
  <title>Вивчаємо JavaScript</title>
  
  <script>
  
    function ShowUserName ()
    {
        var uname = document.getElementById ('UserName').value ;
        
        if (uname.length==0)
        {
            alert ('Введіть своє ім\`я') ;
            
            return false ;
        }
        
        var msg = "Привіт, " + uname + ", як справи?" ;
            
        alert (msg) ;
    }
        
  </script>
  
 </head>
 
 <body>
 
  Введіть своє ім'я: <input type='text' size=50 id='UserName'>
  <input type='button' value='Клікни' onClick='ShowUserName()'>
 
 </body>
 
</html>

Резюме