Pull to refresh

«Hello world!» или путь к становлению специалистом. База JavaScript

Level of difficultyEasy
Reading time4 min
Views8.3K

Кто я

Я обычный студент, которого сегодня выгнали со стажировки на направлении фронтенд. Всю свою старшую школу я хотел стать программистом и много кодить, создавать что-то свое, все предметы и экзамены мне приходилось терпеть, ведь без них я не мог достичь своей мечты. Сейчас в учебе у меня не все так гладко, хотя я и учусь в одном из ведущих вузах страны на техническом направлении - то, о чем я всегда мечтал.

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

Начало пути

Этот блог и будущие публикации будут содержать в основном контент о программировании: статьи, ресурсы, туториалы, создание приложений и т.д. В первых публикациях я хочу рассказать о базовых вещах, которые мне понадобятся для создания будущих проектов. Я давно выбрал фронтенд, поэтому сейчас изучаю JavaScript, HTML, CSS.

Переменные в JS

В JS есть 3 способа объявления переменной: let, var и const.

let variable;

С помощью let мы объявляем переменную variable. Далее мы можем присваивать этой переменной значение с помощью оператора присваивания "=".

Операторы в JavaScript

Имя

Сокращённый оператор

Смысл

Присваивание (en‑US)

x = y

x = y

Присваивание с вычитанием (en-US)

x -= y

x = x - y

Присваивание с умножением (en-US)

x *= y

x = x * y

Присваивание с делением (en-US)

x /= y

x = x / y

Присваивание по модулю (en-US)

x %= y

x = x % y

Присваивание с левым сдвигом (en-US)

x <<= y

x = x << y

Присваивание с правым сдвигом (en-US)Присваивание с правым сдвигом (en-US)

x >>= y

x = x >> y

Присваивание с беззнаковым сдвигом вправо (en-US)

x >>>= y

x = x >>> y

Присваивание с побитовым AND (en-US)

x &= y

x = x & y

Присваивание с побитовым XOR (en-US)

x ^= y

x = x ^ y

Присваивание с побитовым OR (en-US)

x |= y

x = x | y

Источник: https://developer.mozilla.org/ru/docs/Web/JavaScript/Guide/Expressions_and_operators

variable = "Значение"; //тут мы сохраняем "Значение" в переменной variable

Переменную можно сравнить с ячейкой в полке, куда мы ставим какие-нибудь вещи(в моём случае книги, которые я каждый раз намереваюсь прочитать). Так и с переменной, мы складываем в нее значения, которые в будущем будем использовать в коде.

Но кроме let есть var, который не так часто используют для объявления переменной, как let. Это связано с очень важным отличием, которое я разберу после цикла for, потому что там мы уже будем иметь представление о блочной системе в коде.

Синтаксис var, const такой же, как и у let:

var variable; //все так же
variable = "Значение"; //тут мы сохраняем "Значение" в переменной variable

С помощью const мы объявляем константу, которую нельзя изменить в процессе кода, иначе будет ошибка:

const Var = "Значение"; //объявляем константу даты
variable = "Изменненое значение";  // мы не сможем этого сделать

Типы данных в JavaScript

При присваивании значения переменной у нее есть тип данных. В JS типы данных делят на 7 "примитивных" и не "примитивный" объект:

  • number(число)

  • string(строка)

  • boolean(true/false)

  • BigInt(числа произвольной длины)

  • null(неизвестное значение)

  • undefined(неопределённое значение)

  • Symbol

  • Object(не "примитивный" тип данных)

Тип данных number содержит числа и так же числа с плавающей запятой в диапазоне от-253 до 253. При присваивании переменной числа JS автоматически определяет тип данных number.

let one = 1; // js определяет one как number

Мы можем проверить это с помощью оператора typeof(arg), который возвращает нам тип данных аргумента arg.

let one = 1;
//выводим тип данных нашей переменой в консоль
console.log(typeof(one)); //number

string - это строка, то есть значение заключенное в двойные " " , одинарные ' ' или обратные кавычки ` `.

let one = "Один";
console.log(typeof(one)); //string

Это может быть и цифра, предложение и т.д.

let one = "Один";
console.log(typeof(one)); //string

one = "Один в поле не воин";
console.log(typeof(one)); //string

one = "1";
console.log(typeof(one)); //string

Обратные кавычки позволяют нам встраивать переменные в строку, используя конструкцию ${variable}

let one = "Один";
console.log(`${one} в поле не воин`); //Один в поле не воин

bolean(логический тип данных) содержит два значения - true/false(истинно/ложно)

let ImHuman = false; //я не человек
let ImRobot = true; //я робот
console.log(typeof(ImHuman), typeof(ImRobot)); //boolean boolean

При сравнении значений, типом данных результата будет boolean:

let result = 2 > 1;
console.log(result);//true

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

let onemore = 9007199254740991n;
console.log(typeof(onemore));//bigint

null - специальное значение, которое дает нам понять, что переменная "пустая"

let one = null;
console.log(typeof(one)); //object

И да, это object, потому что это, по сути, ссылка на несуществующий объект, и еще null примитивный.

Специальное значение undefined, как и null формирует отдельный тип, означающий "не определено". Например, когда мы объявляем переменную и не присваиваем значение.

let one;
console.log(typeof(one)); //undefined

Symbol - тип данных, предназначенный для создания идентификаторов. Пока что это все что, надо знать о Symbol, но в будущем я так и или иначе столкнусь с этим.

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

let pet = { 
    name: "Rex",  // под ключом "name" хранится значение "Rex"
    animal: "dog"   // под ключом "animal" хранится значение "dog"
  };
console.log(typeof(pet)); //object

Объект в JavaScript является очень важной частью. В будущем мы еще встретим очень много объектов.

В этой статье я попытался вам рассказать своими словами некоторую базу JS. В следующих статьях я буду описывать то, что узнаю сам в процессе своего обучения и становления компетентным человеком в сфере IT.

Источники: https://learn.javascript.ru/first-steps, https://developer.mozilla.org/ru/docs/Web/JavaScript

Tags:
Hubs:
Total votes 16: ↑7 and ↓9-2
Comments28

Articles