× Темы

Введение в JavaScript

0

javascript может изменить веб-страницу без обращения к серверу, проверять значения вводимых пользователем данных и выполнять любые другие операции.

В данной статье собраны базовые сведения, которые позволят начать использование javascript. 

Подключение javascript

Вставка скрипта прямо в код страницы

Можно вставить JS код прямо внутри страницы.

Вынос кода в отдельный файл

Можно вынести javascript код во внешний файл и использовать на странице ссылку на него

<script src=”js-script.js”></script>

Закрывающий тег в этом случае обязателен.

Лучше всего вставлять скрипты перед закрывающим тегом </body>

Переменные

Имена переменных

Имена переменных можно начинать с большой или маленькой буквы, подчеркивания или знака $.

В имени могут быть цифры, но начинать название переменной с цифры нельзя.

javascript чувствителен к регистру: mytext и myText — это две разные переменные.

Лучше использовать для именования CamelCase, начиная каждое слово в название переменной с большой буквы.

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

Для объявления переменных в javascript используется var.

var myText; //undefined
 myText = "Hi!";
 alert(myText);

Сразу после объявления переменной ее значение равно undefined.

Можно при объявлении присвоить переменной значение:

var myText = "Hi!";

Также можно объявить несколько переменных в одном var:

var sum = 4 + 5,
    myText = "Hi!";

При присвоении значения var можно опустить, но лучше этого не делать.

Типы переменных

В javascript можно использовать строки:

var myText = "Hello !";

целые числа:

var myNumber = 10;

Дробные числа:

var pi = 3.14;

Логические значения:

var isBoolean = false;

Детали синтаксиса javascript

Комментарии

Комментарии в одной строке выделяются «//». Все, что идет после этих символов, считается комментарием.

Чтобы закомментировать несколько строк, нужно использовать «/*» чтобы обозначить начало комментария, и «*/» для обозначения конца комментария

/*
here is commented code
and it's also comment
*/

Разделение операторов

Для разделения операторов нужно использовать «;»

Желательно, но не обязательно, использовать пробелы для улучшения читаемости текста.

Работа со строками

var str = 4 + 5 + "7"

даст строковое значение «97» в str

var str2 = "7" + 4 + 5

даст строковое значение «745» в str2

Дело в том, что значение при сложении вычисляется последовательно  — слева направо. Когда складывается 2 числа — результатом становится число. Когда складывается строка и число, число воспринимается как строка и происходит объединение двух строк.

Перевод строки в число

Для перевода строки в число используются parseInt() и parseFloat()

Данные функции получают два аргумента. Первый — это строка, которая будет переведена в число и второй — основание системы счисления, которое будет использовано для перевода. Для трактования строки как десятичного числа, нужно использовать 10 в качестве второго аргумента

var myNumber = parseInt("345", 10);

Функции javascript

Функции в javascript объявляются следующим образом:

function myFunction() {
    Some JS code
}

Для возврата значения нужно использовать return:

function myMultiplication(paramOne, paramTwo) {
    return paramOne * paramTwo
}

Можно объявить «анонимную» функцию, опустив указание имени для функции.

Функцию можно передать как параметр в другую функцию, указав ее имя.

Объекты

Все в javascript является наследником Object.

Создание нового объекта

var person = new Object(); // создание объекта person
person.firstname = "Andrew"; // добавляем первый атрибут
person.lastname = "Peterson";// добавляем второй атрибут
person.getFullName = function() {// добавляем метод
     return this.firstname + " " + this.lastname;
}

Второй, более краткий вариант создания объекта

var person = { // создание объекта person
    firstname : "Andrew",
    lastname : "Peterson",
    getFullName : function() {
         return this.firstname + " " + this.lastname;
    }
}

Работа со свойствами объекта

var me = new Object();

me[«name»] = «Serg»;
me.age = 33;

Массивы  в javascript

Создание массива

var arr = new Array(11, "Hello!",  true); // Создание массива

Новый способ записи

var arr = [11, "Hello!",  true]; // Создание массива

Работа с массивами в javascript

Количество элементов в массиве

var length = arr.length; // 3

Добавление элементов в массив — push

arr.push("A new value");

Извлечение последнего элемента массива — pop

var lastValue = arr.pop();

 

Объединение массивов

var arr2 = [2, 3, 4];
var longArray = arr.concat(arr2); // Объединение двух массивов arr и arr2 в один longArray

Join — слияние всех элементов массива

var longString = arr.join(":") // "11:Hello!:true"

Сравнение и логические функции в javascript

Больше-меньше

var isTrue = 6 >= 5; // больше или равно

Равенство

var isFalse = 1 == 2; // равно
isTrue = 1 != 2; // неравно
var alsoTrue = "6" == 6;

Идентичность

var notIdentical = "3" === 3 // false, поскольку типы данных не совпадают
notIdentical = "3" !== 3 // true, поскольку типы данных не совпадают

Оператор IF

if (5 < 6) {
    alert("true!");
} else {
    alert("false!")
}

Оператор SWITCH

var lunch = prompt("What do you want for lunch?","Type your lunch choice here");
switch(lunch){
  case 'sandwich':
    console.log("Sure thing! One sandwich, coming up.");
    break;
  case 'soup':
    console.log("Got it! Tomato's my favorite.");
    break;
  case 'salad':
    console.log("Sounds good! How about a caesar salad?");
    break;
  case 'pie':
    console.log("Pie's not a meal!");
    break;
  default:
    console.log("Huh! I'm not sure what " + lunch + " is. How does a sandwich sound?");
}

Логическое AND — &&

if (1 == 1 && 2 == 2) {
    alert("true!");
}

Логическое OR — ||

if (1 == 1 || 2 == 3) {
    alert("true!");
}

Логическое NOT — !

if (!(1 == 1)) {
    alert("false!");
}

Циклы

FOR

for (var i = 0; i < 10; i = i + 1) {
    alert(i);
}
var names = [ "Sergey", "Andrey", "Petr" ];
for (var i = 0, len = names.length; i < len; i = i + 1) {
    alert(names[i]);
}

WHILE

while (true) { // Бесконечный цикл
    alert("This will never stop!");
}
var names = [ "Sergey", "Andrey", "Petr" ];
while (names.length > 0) {
    alert(names[i]);
}

DO WHILE

do {
    alert("This will never stop!");
} while (true) { // Бесконечный цикл

Строки

text = "Blah blah blah blah blah blah Eric \
blah blah blah Eric blah blah Eric blah blah \
blah blah blah blah blah Eric";
все для dleфильмы и сериалы онлайн hdавтоматический обмен webmoney на приват24android игры, приложения, инструкции, обзоры



Оценить статью