Web Мастерская
Как в JS / jQuery сделать неизменную переменную?
В стандартной JavaScript и jQuery нет понятия «константной» переменной, как в языках программирования, таких как Java или C++. Однако есть несколько способов, которые помогут достичь аналогичного эффекта:
Синтаксис ES6 (ECMAScript 2015) ввёл ключевое слово
Если нужно объявить постоянную переменную в локальном контексте, можно использовать немедленно вызываемую анонимную функцию:
...
Способ 1: Использовать ключевое слово const
Синтаксис ES6 (ECMAScript 2015) ввёл ключевое слово
const, которое позволяет объявлять переменные, которые не могут быть повторно определены:
const MY_CONSTANT = 'This is a constant';
console.log(MY_CONSTANT); // This is a constant
MY_CONSTANT = 'New Value'; // Будет ошибка: Assignment to constant variable.Способ 2: Использовать IIFE (Immediately Invoked Function Expression)
Если нужно объявить постоянную переменную в локальном контексте, можно использовать немедленно вызываемую анонимную функцию:
(function () {
var CONSTANT_VALUE = 'Some Constant Value';
console.log(CONSTANT_VALUE); // Some Constant Value
})();
// Попытка доступа извне невозможна:
console.log(CONSTANT_VALUE); // ReferenceError: CONSTANT_VALUE- Жалоба
Как проверить событие: "window.onload"
Для проверки события:
...
window.onload можно использовать: document.readyState:
if (document.readyState == 'complete') {
// Код JS
};Как соединить два массива в один в JavaScript
Для соединения двух массивов будем использовать метод
Допустим у нас есть два массива:
Делаем так:
Теперь
concat(), чьё предназначение: Вернуть новый массив, состоящий из массива, котором он был вызван, соединённого с другими массивом.Допустим у нас есть два массива:
const first = [1, 2, 3];
const second = [4, 5, 6];Делаем так:
const common = first.concat(second);Теперь
common содержит в себе массив, состоящий из двух массивов:
[1, 2, 3, 4, 5, 6]
...Cannot read properties of undefined (reading 'querySelector')
Ошибка: Cannot read properties of undefined (reading 'querySelector') говорит о том, что метод:
Возможные решения:
querySelector пытается обратиться к элементу, которого не существует.Возможные решения:
- Убедитесь, что элемент, к которому обращаетсь, существует, на самом деле.
- Расположите JavaScript в нижнюю часть Вашего документа.
Карусель фотографий
Для одной своей идеи, использовал карусель фотографий, взятую из интернета и переписанную под себя. Выложу, как было у меня. Карусель использует библиотеку jQuery, так что придется подключать её, хотя, переписать на чистый JavaScript не составит особого труда.
jQuery:
...
jQuery:
var carouselID = 1, change = 8000;
function carouselStart() {
if ($('div[data-carousel="carousel"]').length < 1) {
return false;
};
$('div[data-carousel="carousel"]').each(function() {
$(this).removeAttr('data-carousel').attr('id', 'carousel_' + carouselID);
carousel('#carousel_' + carouselID);
carouselID++;
});
};
$(() => {
carouselStart();
window.setInterval(carouselStart, 3000);
});
function carousel(carouselID) {
var $slr, $sls, interval, $selectors, $btns, currentIndex, nextIndex;
var cycle = index => {
var $currentSlide, $nextSlide, $currentSelector, $nextSelector;
nextIndex = index !== undefined ? index : nextIndex;
$currentSlide =