МИНИСТЕРСТВО НАУКИ И ВЫСШЕГО ОБРАЗОВАНИЯ
РОССИЙСКОЙ ФЕДЕРАЦИИ
ФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ БЮДЖЕТНОЕ
ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ВЫСШЕГО ОБРАЗОВАНИЯ
«САХАЛИНСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ»

Институт естественных наук и техносферной безопасности
Кафедра информатики
Гусев Владислав Михайлович

Лабораторная работа №8.«JS»
01.03.02 Прикладная математика и информатика

Научный руководитель
Соболев Евгений Игоревич

г. Южно-Сахалинск
2024 г.

Введение

HTML — стандартизированный язык гипертекстовой разметки документов для просмотра веб-страниц в браузере. Веб-браузеры получают HTML документ от сервера по протоколам HTTP/HTTPS или открывают с локального диска, далее интерпретируют код в интерфейс, который будет отображаться на экране монитора.

CSS — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Также может применяться к любым XML-документам, например, к SVG или XUL.

Задачи js

Напишите оператор if, такой, чтобы в качестве выражения в скобках у него были значения true, false (Например, if( true ) или if( false )). Посмотрите как работает этот оператор, поместив какую-нибудь команду после круглых скобок (Например, console.log(1)).
Создайте переменные m и n. В m поместите произвольное числовое значение. Напишите оператор ветвления if так, чтобы если m было больше 50, то в переменную n помещалось слово «большое», иначе — слово «маленькое».
Определите сколько раз выполнится цикл while? Примечание: это можно сделать прочитав скрипт или запустив его консоли браузера.
```
var i = 2; while( i < 9 ){ console.log( i++ ); } 
```
Напишите скрипт, который используя оператор while выведет все числа от 45 до 67.
Напишите скрипт, который используя оператор while выведет все числа от 45 до 670, кратные 10.
Напишите скрипт, который используя оператор for выполнит два предыдущих задания.
Переменная n хранит целое число от 0 до 9. Используя оператор switch, написать скрипт, который в зависимости от числа будет выводить слово (Например, если n равно 3, то будет выводиться слово «три»)
```
var n = 5; switch( n ){ //Напишите тут свой код } 
```
Используя document.write() и любую из циклических конструкций выведите десять одинаковых изображений (надо выводить <img src="..." alt="..." />)
В переменных size и unit хранятся размер и единицы измерения информации 120 и «Кб» соответственно. Зная что могут быть заданные Кб, Мб, Гб (кило-, мега- и гигабайты) и 1килобайт равен 1024 байта, найти количество байт в size.
Постройте при помощи циклов JavaScript скрипт для календаря на HTML. Примечание: выполнить задание для одного месяца, используя HTML-элемент table
Напишите функцию hello1(), которая при вызове будет возвращать строку «Привет, JavaScript!».
Напишите функцию hello2(), которая при вызове будет принимать переменную name (например, «Василий») и выводить строку (в нашем случае «Привет, Василий»). В случае отсутствующего аргумента выводить «Привет, гость»
Напишите функцию mul(n,m), которая принимает два аргумента и возвращает произведение этих аргументов. Проверьте ее работу.
Создайте функцию repeat(str, n), которая возвращает строку, состоящую и n повторений строки str. n — по умолчанию 2, str — пустая строка
Создайте функцию rgb(), которая будет принимать три числовых аргумента и возвращать строку вида «rgb(23,100,134)». Если аргументы не заданы, считать их равными нулю. Не проверять переменные на тип данных
Создайте функцию avg(), которая будет находить среднее значение по всем своим аргументам (аргументы величины числовые).
Создайте функцию m(a,b) оболочку для mul(). m() должна принимать два аргумента а возвращать результат работы mul() с этими двумя аргументами После выполнения задания поэкспериментируйте, создайте функцию log(), которая будет принимать одно значение, а вызывать console.log() с этим значением.
Напишите функцию operation(m,n,o), в которой m и n — числовые переменные, а o — функциональный литерал, который берет два аргумента и выполняет математическую операцию над ними
Напишите функцию addN(n), которая вернёт другую функцию. Возвращенная функция должна складывать получаемый аргумент с аргументом n возвращающей функции.
Напишите функцию words(), которая в зависимости от переданного в нее целочисленного аргумента n, будет выводить слово «товар» в нужно форме («12 товаров», но «22 товара»). По умолчанию аргумент d должен иметь значение 0
Решить задачу на сайте https://www.codewars.com/kata/596fd97f65ad2fc072000037
Решить задачу на сайте https://www.codewars.com/kata/5925138effaed0de490000cf
Решить задачу на сайте https://www.codewars.com/kata/59269e371a640c0e98000085
Решить задачу на сайте https://www.codewars.com/kata/5913ffb2cb1475215c000039

Решения CSS

Файл 1.js

if (true) {
    console.log(1);
}

if (false) {
    console.log(0);
}

Файл 2.js

let m = 60;
let n;

if (m > 50) {
    n = "большое";
} else {
    n = "маленькое";
}

console.log(n);

Файл 3.js

let i = 2;
while (i < 9) {
    console.log(i++);
}

Файл 4.js

let number = 45;

while (number <= 67) {
    console.log(number);
    number++;
}

Файл 5.js

let number = 45;

while (number <= 670) {
    if (number % 10 === 0) {
        console.log(number);
    }
    number++;
}

Файл 6.js


console.log("Числа от 45 до 67:");
for (let number = 45; number <= 67; number++) {
    console.log(number);
}


console.log("Числа от 45 до 670, кратные 10:");
for (let number = 45; number <= 670; number++) {
    if (number % 10 === 0) {
        console.log(number);
    }
}

Файл 7.js

let n = 5;

switch (n) {
    case 0:
        console.log("ноль");
        break;
    case 1:
        console.log("один");
        break;
    case 2:
        console.log("два");
        break;
    case 3:
        console.log("три");
        break;
    case 4:
        console.log("четыре");
        break;
    case 5:
        console.log("пять");
        break;
    case 6:
        console.log("шесть");
        break;
    case 7:
        console.log("семь");
        break;
    case 8:
        console.log("восемь");
        break;
    case 9:
        console.log("девять");
        break;
    default:
        console.log("Число не входит в диапазон от 0 до 9");
        break;
}

Файл 8.js

for (var i = 0; i < 10; i++) {
    document.write('<img src="путь_к_изображению" alt="описание_изображения" />');
}

Файл 9.js

let size = 120;
let unit = "Кб";
let bytes;

switch (unit) {
    case "Кб":
        bytes = size * 1024;
        break;
    case "Мб":
        bytes = size * 1024 * 1024;
        break;
    case "Гб":
        bytes = size * 1024 * 1024 * 1024;
        break;
    default:
        console.log("Неподдерживаемая единица измерения.");
}

console.log("Количество байт в size:", bytes);

Файл 10.js

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table id="calendar">

</table>
<script>
    let month = 4;
    let year = 2024;

    let table = document.getElementById("calendar");

    let headerRow = table.insertRow();
    let headerCell = headerRow.insertCell();
    headerCell.colSpan = 7;
    headerCell.textContent = new Date(year, month).toLocaleString("default", { month: "long", year: "numeric" });
    headerCell.classList.add("header");

    let daysOfWeek = ["Пн", "Вт", "Ср", "Чт", "Пт", "Сб", "Вс"];
    let daysRow = table.insertRow();
    for (let i = 0; i < daysOfWeek.length; i++) {
        let daysCell = daysRow.insertCell();
        daysCell.textContent = daysOfWeek[i];
        daysCell.classList.add("day-of-week");
    }

    let firstDay = new Date(year, month, 0).getDay();

    let daysInMonth = new Date(year, month + 1, 0).getDate();

    let currentDay = 1;
    for (let week = 0; week < 6; week++) {
        let weekRow = table.insertRow();
        for (let dayOfWeek = 0; dayOfWeek < 7; dayOfWeek++) {
            let dayCell = weekRow.insertCell();
            if (week === 0 && dayOfWeek < firstDay) {
                dayCell.classList.add("empty");
            } else if (currentDay > daysInMonth) {
                dayCell.classList.add("empty");
            } else {
                dayCell.textContent = currentDay;
                dayCell.classList.add("day");
                currentDay++;
            }
        }
    }
</script>
</body>
</html>

Файл 11.js

function hello1() {
    return "Привет, JavaScript!";
}

console.log(hello1());

Файл 12.js

function hello2(name) {
    if (name) {
        return "Привет, " + name + "!";
    }

    return "Привет, гость!";
}


console.log(hello2("Василий"));
console.log(hello2());

Файл 13.js

function mul(n, m) {
    return n * m;
}

console.log(mul(5, 7));
console.log(mul(2, 3));

Файл 14.js

function repeat(str = "", n = 2) {
    return str.repeat(n);
}

console.log(repeat("Hello", 3));
console.log(repeat("JavaScript"));
console.log(repeat());

Файл 15.js

function rgb(red = 0, green = 0, blue = 0) {
    return "rgb(" + red + "," + green + "," + blue + ")";
}

console.log(rgb(23, 100, 134));
console.log(rgb(255, 0, 0));
console.log(rgb());

Файл 16.js

function avg(...args) {
    if (args.length === 0) {
        return 0;
    }

    const sum = args.reduce((acc, val) => acc + val, 0);
    return sum / args.length;
}

console.log(avg(2, 4, 6));
console.log(avg(10, 20, 30, 40, 50));
console.log(avg());

Файл 17.js

function mul(n, m) {
    return n * m;
}

function m(a, b) {
    return mul(a, b);
}

console.log(m(2, 3));
console.log(m(5, 7));

Файл 18.js

function operation(m, n, o) {
    return o(m, n);
}

const sum = function(a, b) {
    return a + b;
};

console.log(operation(2, 3, sum));

const multiply = function(a, b) {
    return a * b;
};

console.log(operation(4, 5, multiply));

Файл 19.js

function addN(n) {
    return function(x) {
        return x + n;
    };
}

const add5 = addN(5);

console.log(add5(10));
console.log(add5(7));

const add3 = addN(3);

console.log(add3(8));
console.log(add3(2));

Файл 20.js

function words(n) {
    if (n === 0) {
        return 'товаров';
    }

    const lastDigit = n % 10;
    const lastTwoDigits = n % 100;

    if (lastTwoDigits >= 11 && lastTwoDigits <= 19) {
        return 'товаров';
    } else if (lastDigit === 1) {
        return 'товар';
    } else if (lastDigit >= 2 && lastDigit <= 4) {
        return 'товара';
    } else {
        return 'товаров';
    }
}

console.log(words(0));
console.log(words(1));
console.log(words(2));
console.log(words(5));
console.log(words(11));
console.log(words(22));
console.log(words(100));

Файл 21.js

class Converter {
    constructor(size, unit) {
        switch (unit) {
            case "KB":
                this.sizeB = size * 1024;
                break;
            case "MB":
                this.sizeB = size * 1048576;
                break;
            case "GB":
                this.sizeB = size * 1073741824;
                break;
            case 'TB':
                this.sizeB = size * 1099511627776;
                break;
            default:
                this.sizeB = size
        }
    }

    toB() {
        this.size = this.sizeB;
        this.round();
        this.unit = 'B';
        this.size = this.size + ' ' + this.unit;
    }

    toKB() {
        this.size = this.sizeB / 1024;
        this.round();
        this.unit = 'KB';
        this.size = this.size + ' ' + this.unit;
    }

    toMB() {
        this.size = this.sizeB / 1048576;
        this.round();
        this.unit = 'MB';
        this.size = this.size + ' ' + this.unit;
    }

    toGB() {
        this.size = this.sizeB / 1073741824;
        this.round();
        this.unit = 'GB';
        this.size = this.size + ' ' + this.unit;
    }

    toTB() {
        this.size = this.sizeB / 1099511627776;
        this.round();
        this.unit = 'TB';
        this.size = this.size + ' ' + this.unit;
    }
    round() {
        if (!Number.isInteger(this.size)) {
            this.size = Math.floor(this.size * 1000) / 1000;
        }
    }
}

Файл 22.js

function tiaosheng(failedCount) {
    if (failedCount.length === 0) {
        return 60;
    }

    let jumps = 60;
    let number = 0;

    for (var key = 0; key < failedCount.length; key++) {
        key = Number(key);
        let current = failedCount[key];
        number = current + 3 * key;

        if (number < 57) {
            jumps = current - 3 * key;
        } else if (number >= 57 && number <= 60) {
            return current;
        } else {
            return 60 - (3 * key);
        }
    }

    if (number < 57) {
        return 60 - (3 * key);
    }

    return jumps;
}

console.log(tiaosheng([3, 7, 12, 13, 15, 17, 19, 20, 22, 23, 24, 25, 27, 28, 29, 31, 32, 33, 36, 38, 40, 42, 47, 48, 50, 51, 56, 57, 58]))

Файл 23.js

function xPlusY(n) {
    if (!/^[01]+$/.test(n)) {
        return 0;
    }
    n = n.split('');

    let turns = 0;
    for (let i = 0; i < n.length; i++) {
        if (n[i] === '1') {
            if (n[i + 1] !== undefined && n[i + 1] === '0') {
                n[i] = '0';
                n[i + 1] = '1'
                turns++;
            } else if (n[i + 1] !== undefined && n[i + 1] === '1') {
                n[i] = '0';
                n[i + 1] = '0'
                turns++;
            }
        }
    }

    if (n[n.length - 1] === '1') {
        turns++;
    }

    return turns;
}

console.log(xPlusY('11'))

Файл 24.js

function countTriangles(n) {
    return Math.floor(n + n*n*(6*n+9)/2)
}

console.log(countTriangles(4));

Результат HTML

Напишите оператор if, такой, чтобы в качестве выражения в скобках у него были значения true, false (Например, if( true ) или if( false )). Посмотрите как работает этот оператор, поместив какую-нибудь команду после круглых скобок (Например, console.log(1)).
Создайте переменные m и n. В m поместите произвольное числовое значение. Напишите оператор ветвления if так, чтобы если m было больше 50, то в переменную n помещалось слово «большое», иначе — слово «маленькое».
Определите сколько раз выполнится цикл while? Примечание: это можно сделать прочитав скрипт или запустив его консоли браузера.
```
var i = 2; while( i < 9 ){ console.log( i++ ); } 
```
Напишите скрипт, который используя оператор while выведет все числа от 45 до 67.
Напишите скрипт, который используя оператор while выведет все числа от 45 до 670, кратные 10.
Напишите скрипт, который используя оператор for выполнит два предыдущих задания.
Переменная n хранит целое число от 0 до 9. Используя оператор switch, написать скрипт, который в зависимости от числа будет выводить слово (Например, если n равно 3, то будет выводиться слово «три»)
```
var n = 5; switch( n ){ //Напишите тут свой код } 
```
Используя document.write() и любую из циклических конструкций выведите десять одинаковых изображений (надо выводить <img src="..." alt="..." />)
В переменных size и unit хранятся размер и единицы измерения информации 120 и «Кб» соответственно. Зная что могут быть заданные Кб, Мб, Гб (кило-, мега- и гигабайты) и 1килобайт равен 1024 байта, найти количество байт в size.
Постройте при помощи циклов JavaScript скрипт для календаря на HTML. Примечание: выполнить задание для одного месяца, используя HTML-элемент table
Напишите функцию hello1(), которая при вызове будет возвращать строку «Привет, JavaScript!».
Напишите функцию hello2(), которая при вызове будет принимать переменную name (например, «Василий») и выводить строку (в нашем случае «Привет, Василий»). В случае отсутствующего аргумента выводить «Привет, гость»
Напишите функцию mul(n,m), которая принимает два аргумента и возвращает произведение этих аргументов. Проверьте ее работу.
Создайте функцию repeat(str, n), которая возвращает строку, состоящую и n повторений строки str. n — по умолчанию 2, str — пустая строка
Создайте функцию rgb(), которая будет принимать три числовых аргумента и возвращать строку вида «rgb(23,100,134)». Если аргументы не заданы, считать их равными нулю. Не проверять переменные на тип данных
Создайте функцию avg(), которая будет находить среднее значение по всем своим аргументам (аргументы величины числовые).
Создайте функцию m(a,b) оболочку для mul(). m() должна принимать два аргумента а возвращать результат работы mul() с этими двумя аргументами После выполнения задания поэкспериментируйте, создайте функцию log(), которая будет принимать одно значение, а вызывать console.log() с этим значением.
Напишите функцию operation(m,n,o), в которой m и n — числовые переменные, а o — функциональный литерал, который берет два аргумента и выполняет математическую операцию над ними
Напишите функцию addN(n), которая вернёт другую функцию. Возвращенная функция должна складывать получаемый аргумент с аргументом n возвращающей функции.
Напишите функцию words(), которая в зависимости от переданного в нее целочисленного аргумента n, будет выводить слово «товар» в нужно форме («12 товаров», но «22 товара»). По умолчанию аргумент d должен иметь значение 0
Решить задачу на сайте https://www.codewars.com/kata/596fd97f65ad2fc072000037
Решить задачу на сайте https://www.codewars.com/kata/5925138effaed0de490000cf
Решить задачу на сайте https://www.codewars.com/kata/59269e371a640c0e98000085
Решить задачу на сайте https://www.codewars.com/kata/5913ffb2cb1475215c000039

Вывод

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

lab_4_8

Введение

Задачи js

Решения CSS

Файл 1.js

Файл 2.js

Файл 3.js

Файл 4.js

Файл 5.js

Файл 6.js

Файл 7.js

Файл 8.js

Файл 9.js

Файл 10.js

Файл 11.js

Файл 12.js

Файл 13.js

Файл 14.js

Файл 15.js

Файл 16.js

Файл 17.js

Файл 18.js

Файл 19.js

Файл 20.js

Файл 21.js

Файл 22.js

Файл 23.js

Файл 24.js

Результат HTML

Вывод

Описание

Языки

Использование cookies

lab_4_8

Wwilhelmgansfix readme 6 месяцев назадa7cb98

Введение

Задачи js

Решения CSS

Файл 1.js

Файл 2.js

Файл 3.js

Файл 4.js

Файл 5.js

Файл 6.js

Файл 7.js

Файл 8.js

Файл 9.js

Файл 10.js

Файл 11.js

Файл 12.js

Файл 13.js

Файл 14.js

Файл 15.js

Файл 16.js

Файл 17.js

Файл 18.js

Файл 19.js

Файл 20.js

Файл 21.js

Файл 22.js

Файл 23.js

Файл 24.js

Результат HTML

Вывод

Описание

Языки

Использование cookies