Hello, world

Hello, world

hello world в alert.

Асинхронные скрипты defer/async

async - полностью асинхронная загрузка скриптов
defer - выполняется асинхронно, но 1) порядок сохраняется; 2) выполняется после загрузки всей страницы;


$ cat script1.js
console.log(1);


$ cat script2.js
setTimeout( function () {
  console.log(2);
}, 2000);


$ cat script3.js
setTimeout(function () {
  console.log(3);
}, 3000);

Без async


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, world</title>
</head>
<body>
    <script src="script1.js"></script>
    <script src="script2.js"></script>
    <script src="script3.js"></script>
    <script>console.log("hi")</script>
</body>
</html>


script1.js:1 1
index.html:11 hi
script2.js:2 2
script3.js:2 3

С async


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, world</title>
</head>
<body>
    <script async src="script1.js"></script>
    <script async src="script2.js"></script>
    <script async src="script3.js"></script>
    <script>console.log("hi")</script>
</body>
</html>


index.html:11 hi
script1.js:1 1
script2.js:2 2
script3.js:2 3

С defer


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Hello, world</title>
</head>
<body>
    <script async src="script1.js"></script>
    <script async src="script2.js"></script>
    <script async src="script3.js"></script>
    <script>console.log("hi")</script>
</body>
</html>


index.html:11 hi
script1.js:1 1
script2.js:2 2
script3.js:2 3

Работа с переменными

Объявите две переменные: admin и name.
Запишите в name строку "Василий".
Скопируйте значение из name в admin.
Выведите admin (должно вывести «Василий»).


var admin, name;
name = "Вася";
admin = name;
alert(admin);

Объявление переменных

Создайте переменную для названия нашей планеты и присвойте ей значение "Земля". Правильное имя выберите сами.
Создайте переменную для имени посетителя со значением "Петя". Имя также на ваш вкус.


var earth = "Земля", user_name = "Петя";

Взаимодействие с пользователем: alert, prompt, confirm

Простая страница

Создайте страницу, которая спрашивает имя и выводит его.


var name = prompt("Как вас зовут?", '');
alert(name);

Условные операторы: if, ‘?’

Проверка стандарта

Используя конструкцию if..else, напишите код, который будет спрашивать: «Каково «официальное» название JavaScript?».

Если посетитель вводит «ECMAScript», то выводить «Верно!», если что-то другое – выводить «Не знаете? «ECMAScript»!».


var answer = prompt('Каково "официальное" название JavaScript?', '');

if (answer == 'ECMAScript'){
    alert("Верно!");
} else {
    alert('Не знаете? "ECMAScript"!');
}

Получить знак числа

Используя конструкцию if..else, напишите код, который получает значение prompt, а затем выводит alert:

1, если значение больше нуля,
-1, если значение меньше нуля,
0, если значение равно нулю.


var number = prompt("Введите число", '');
if (number > 0){
    alert(1);
} else if ( number < 0 ){
    alert(-1);
} else if ( number === 0 ) {
    alert(0);
}

Проверка логина

Напишите код, который будет спрашивать логин (prompt).

Если посетитель вводит «Админ», то спрашивать пароль, если нажал отмена (escape) – выводить «Вход отменён», если вводит что-то другое – «Я вас не знаю».

Пароль проверять так. Если введён пароль «Чёрный Властелин», то выводить «Добро пожаловать!», иначе – «Пароль неверен», при отмене – «Вход отменён».


var login = prompt('Введите логин', '');
if ( login == 'Админ' ){
    var password = prompt('Введите пароль', '');
    if ( password == 'test'){
        alert("Welcome");
    } else if ( password == null ){
        alert("Вход отменён");
    } else {
        alert("Пароль неверен");
    }
} else if ( login == null ){
    alert("Вход отменён");
} else {
    alert("Я вас не знаю");
}

Перепишите ‘if’ в ‘?’

Перепишите if с использованием оператора '?':


if (a + b < 4) {
  result = 'Мало';
} else {
  result = 'Много';
}


result = (a + b < 4) ? 'Мало' : 'Много';

Перепишите ‘if..else’ в ‘?’

Перепишите if..else с использованием нескольких операторов '?'.

Для читаемости – оформляйте код в несколько строк.


var message;

if (login == 'Вася') {
  message = 'Привет';
} else if (login == 'Директор') {
  message = 'Здравствуйте';
} else if (login == '') {
  message = 'Нет логина';
} else {
  message = '';
}


var message =   (login == 'Вася')     ? 'Привет' : 
                (login == 'Директор') ? 'Здравствуйте' :
                (login == '')         ? 'Нет логина' : '';

Проверка if внутри диапазона

Напишите условие if для проверки того факта, что переменная age находится между 14 и 90 включительно.

«Включительно» означает, что концы промежутка включены, то есть age может быть равна 14 или 90.


var age = prompt("age", 14);
if ( age >= 14 && age <= 90 ){
    alert(true);
}

Проверка if вне диапазона

Напишите условие if для проверки того факта, что age НЕ находится между 14 и 90 включительно.

Сделайте два варианта условия: первый с использованием оператора НЕ !, второй – без этого оператора.


var age = prompt("age", 14);
if ( !( age >= 14 && age <= 90 ) ){
    alert(true);
}


var age = prompt("age", 14);
if ( age < 14 || age > 90 ){
    alert(true);
}

Avis notes

JavaScript - Basic