Готовый Код | Frontend
Хай! Сегодня мы напишем функцию создания генератора sequence(start, step). Она при вызове возвращает другую функцию-генератор, которая при каждом вызове дает число на 1 больше, и так до бесконечности. Начальное число, с которого начинать отсчет, и шаг, задается…
Решение :
function
sequence(start, step) {
start = start 0;
step = step 1;
start -= step;
return function() {
return start += step;
}
}
var generator = sequence(2, 3);
console.log(generator());
function
sequence(start, step) {
start = start
step = step
start -= step;
return function() {
return start += step;
}
}
var generator = sequence(2, 3);
console.log(generator());
Готовый Код | Frontend
Хай! Сегодня у нас будет задача: Напишите две функции, которые будут проходить через массив целых чисел и выводить индекс каждого элемента с задержкой в 3 секунды. P.s Ожидаем два решения) Ставим десять смайлов и скидываем решение)
Хай! Вот и решение задачи)
Первое решение:
const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
// pass in the variable i so that each function
// has access to the correct index
setTimeout(function(i_local) {
return function() {
console.log('The index of this number is: ' + i_local);
}
}(i), 3000);
}
Второе решение:
const arr = [10, 12, 15, 21];
for (let i = 0; i < arr.length; i++) {
// using the ES6 let syntax, it creates a new binding
// every single time the function is called
// read more here: http://exploringjs.com/es6/ch_variables.html#sec_let-const-loop-heads
setTimeout(function() {
console.log('The index of this number is: ' + i);
}, 3000);
}
Первое решение:
for (var i = 0; i < arr.length; i++) {
// pass in the variable i so that each function
// has access to the correct index
setTimeout(function(i_local) {
return function() {
console.log('The index of this number is: ' + i_local);
}
}(i), 3000);
}
for (let i = 0; i < arr.length; i++) {
// using the ES6 let syntax, it creates a new binding
// every single time the function is called
// read more here:
setTimeout(function() {
console.log('The index of this number is: ' + i);
}, 3000);
}
Всем привет! У нас задача: Векторный тип.
Напишите конструктор Vector, представляющий вектор в двумерном пространстве. Он принимает параметры x и y (числа), которые хранятся в одноимённых свойствах.
Дайте прототипу Vector два метода, plus и minus, которые принимают другой вектор в качестве параметра, и возвращают новый вектор, который хранит в x и y сумму или разность двух (один this, второй — аргумент)
Добавьте геттер length в прототип, подсчитывающий длину вектора – расстояние от (0, 0) до (x, y).
Напишите конструктор Vector, представляющий вектор в двумерном пространстве. Он принимает параметры x и y (числа), которые хранятся в одноимённых свойствах.
Дайте прототипу Vector два метода, plus и minus, которые принимают другой вектор в качестве параметра, и возвращают новый вектор, который хранит в x и y сумму или разность двух (один this, второй — аргумент)
Добавьте геттер length в прототип, подсчитывающий длину вектора – расстояние от (0, 0) до (x, y).
Хай! Давай решим задачу!
Напишите функцию lorem(n), которая принимает положительное целое n (от 1 до 445) и при вызове возвращает строку длиной n символов из строки
«Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.»
Например, при вызове lorem(100) функция должна вернуть строку
«Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore »
P.s Десять смайлов и скидываем решение
Напишите функцию lorem(n), которая принимает положительное целое n (от 1 до 445) и при вызове возвращает строку длиной n символов из строки
«Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.»
Например, при вызове lorem(100) функция должна вернуть строку
«Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore »
P.s Десять смайлов и скидываем решение
Привет! Давай сделаем простой скрипт для увеличение картинки, который требуется очень часто.
Обычно картинки на сайте обладают небольшим размером, чтобы не увеличивать их до такого размера, когда это смотрится уже, как минимум, некрасиво. Однако, очень часто пользователи хотят увеличить картинку, и вот для их удобства и был сделан этот простой скрипт.
Условие:
Кликните на любую фотографию. Если кликните ещё раз, то она вернётся в исходное состояние
Обычно картинки на сайте обладают небольшим размером, чтобы не увеличивать их до такого размера, когда это смотрится уже, как минимум, некрасиво. Однако, очень часто пользователи хотят увеличить картинку, и вот для их удобства и был сделан этот простой скрипт.
Условие:
Кликните на любую фотографию. Если кликните ещё раз, то она вернётся в исходное состояние
Привет! Напишите в комментариях, что выведет этот код)
const client = {
name: "Mr. Smith",
age: 21
}
const increaseAge = (x = { ...client }) => x.age += 1
const changeAgeAndName = (x = { ...client }) => {
x.age += 1
x.name = "Ivan"
}
increaseAge(client)
changeAgeAndName()
console.log(client)
P.s Пять смайлов и скидываем похожую задачку снова)
const client = {
name: "Mr. Smith",
age: 21
}
const increaseAge = (x = { ...client }) => x.age += 1
const changeAgeAndName = (x = { ...client }) => {
x.age += 1
x.name = "Ivan"
}
increaseAge(client)
changeAgeAndName()
console.log(client)
P.s Пять смайлов и скидываем похожую задачку снова)
Привет) Вам понравилась вчерашняя задача, значит сегодня будет похожая)
Какое значение будет на выходе?
const client = {
name: "Mr. Smith",
age: 21
}
const increaseAge = (x = { ...client }) => x.age += 1
const changeAgeAndName = (x = { ...client }) => {
x.age += 1
x.name = "Ivan"
}
increaseAge(client)
changeAgeAndName()
console.log(client)
P.s Десять смайлов и выбираем среди комментариев правильный ответ)
Если есть желание можно подкинуть задачу)
Какое значение будет на выходе?
const client = {
name: "Mr. Smith",
age: 21
}
const increaseAge = (x = { ...client }) => x.age += 1
const changeAgeAndName = (x = { ...client }) => {
x.age += 1
x.name = "Ivan"
}
increaseAge(client)
changeAgeAndName()
console.log(client)
P.s Десять смайлов и выбираем среди комментариев правильный ответ)
Если есть желание можно подкинуть задачу)
Привет! Сегодня мы будем делать игру "угадай число"
Реализуйте игру угадай число. В этой игре компьютер загадывает число от 1 до 100. В инпут на экране игрок вводит число от 1 до 100, пытаясь угадать, что же загадал компьютер.
Если игрок ввел число, меньше загаданного, компьютер должен написать 'введите число побольше', а если введено больше загаданного, то, соответственно, компьютер должен написать 'введите число поменьше'.
P.s Десять смайлов и скидываем решение
Реализуйте игру угадай число. В этой игре компьютер загадывает число от 1 до 100. В инпут на экране игрок вводит число от 1 до 100, пытаясь угадать, что же загадал компьютер.
Если игрок ввел число, меньше загаданного, компьютер должен написать 'введите число побольше', а если введено больше загаданного, то, соответственно, компьютер должен написать 'введите число поменьше'.
P.s Десять смайлов и скидываем решение
Хай! Сегодня задача сделать игру "найди число" на JavaScript
Давайте сделаем игру, в которой будет квадратная таблица, в которой случайным образом будут числа от 1 до N, где N - количество ячеек в таблице. Суть игры будет заключаться в том, что нужно будет кликать по ячейкам в правильном порядке: сначала на 1, потом на 2, потом на 3 и так далее.
Если игрок кликает на правильную ячейку - пусть она активируется и делает красный фон. Если же он кликает на неправильную ячейку - ничего не происходит.
Когда игрок найдет последнее число - пусть игра начинается сначала, но таблица увеличивается на одну строку и одну колонку.
P.s Десять смайлов и скидываем решение
Давайте сделаем игру, в которой будет квадратная таблица, в которой случайным образом будут числа от 1 до N, где N - количество ячеек в таблице. Суть игры будет заключаться в том, что нужно будет кликать по ячейкам в правильном порядке: сначала на 1, потом на 2, потом на 3 и так далее.
Если игрок кликает на правильную ячейку - пусть она активируется и делает красный фон. Если же он кликает на неправильную ячейку - ничего не происходит.
Когда игрок найдет последнее число - пусть игра начинается сначала, но таблица увеличивается на одну строку и одну колонку.
P.s Десять смайлов и скидываем решение
Привет! Сегодня у нас задача сделать "Календарь"
Для простоты просто сделаем так, чтобы календарь выводился за текущий месяц. Но с прицелом на то, что его можно будет доработать так, чтобы можно было менять месяц и год. Образец того, что должно получится на фотографии)
P.s Десять смайлов и скидываем решение задачи)
Для простоты просто сделаем так, чтобы календарь выводился за текущий месяц. Но с прицелом на то, что его можно будет доработать так, чтобы можно было менять месяц и год. Образец того, что должно получится на фотографии)
P.s Десять смайлов и скидываем решение задачи)
Готовый Код | Frontend
Привет! Сегодня у нас задача сделать "Календарь" Для простоты просто сделаем так, чтобы календарь выводился за текущий месяц. Но с прицелом на то, что его можно будет доработать так, чтобы можно было менять месяц и год. Образец того, что должно получится…
Решение задачи "Календарь"
<div id="parent">
<div id="calendar">
<table>
<thead>
<tr>
<th>пн</th>
<th>вт</th>
<th>ср</th>
<th>чт</th>
<th>пт</th>
<th>сб</th>
<th>вс</th>
</tr>
</thead>
<tbody class="body"></tbody>
</table>
</div>
</div>
#parent {
text-align: center;
}
#calendar {
display: inline-block;
}
#calendar td, #calendar th {
padding: 5px 12px;
border: 1px solid black;
text-align: center;
}
let calendar = document.querySelector(' #calendar ');
let body = calendar.querySelector('.body');
let prev = calendar.querySelector('.prev');
let next = calendar.querySelector('.next');
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth();
draw(body, year, month);
function draw(body, year, month) {
let arr = range(getLastDay(year, month));
let firstWeekDay = getFirstWeekDay(year, month);
let lastWeekDay = getLastWeekDay(year, month);
let nums = chunk(normalize(arr, firstWeekDay, 6 - lastWeekDay), 7);
createTable(body, nums)
}
function createTable(parent, arr) {
parent.textContent = '';
let cells = [];
for (let sub of arr) {
let tr = document.createElement('tr');
for (let num of sub) {
let td = document.createElement('td');
td.textContent = num;
tr.appendChild(td);
cells.push(td);
}
parent.appendChild(tr);
}
return cells;
}
function normalize(arr, left, right) {
for (let i = 0; i < left; i++) {
arr.unshift('');
}
for (var i = 0; i < right; i++) {
arr.push('');
}
return arr;
}
function getFirstWeekDay(year, month) {
let date = new Date(year, month, 1);
let num = date.getDay();
if (num == 0) {
return 6;
} else {
return num - 1;
}
}
function getLastWeekDay(year, month) {
let date = new Date(year, month + 1, 0);
let num = date.getDay();
if (num == 0) {
return 6;
} else {
return num - 1;
}
}
function getLastDay(year, month) {
let date = new Date(year, month + 1, 0);
return date.getDate();
}
function range(count) {
let arr = [];
for (let i = 1; i <= count; i++) {
arr.push(i);
}
return arr;
}
function chunk(arr, n) {
let result = [];
let count = Math.ceil(arr.length / n);
for (let i = 0; i < count; i++) {
let elems = arr.splice(0, n);
result.push(elems);
}
return result;
}
<div id="calendar">
<table>
<thead>
<tr>
<th>пн</th>
<th>вт</th>
<th>ср</th>
<th>чт</th>
<th>пт</th>
<th>сб</th>
<th>вс</th>
</tr>
</thead>
<tbody class="body"></tbody>
</table>
</div>
</div>
text-align: center;
}
display: inline-block;
}
padding: 5px 12px;
border: 1px solid black;
text-align: center;
}
let calendar = document.querySelector('
let body = calendar.querySelector('.body');
let prev = calendar.querySelector('.prev');
let next = calendar.querySelector('.next');
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth();
draw(body, year, month);
function draw(body, year, month) {
let arr = range(getLastDay(year, month));
let firstWeekDay = getFirstWeekDay(year, month);
let lastWeekDay = getLastWeekDay(year, month);
let nums = chunk(normalize(arr, firstWeekDay, 6 - lastWeekDay), 7);
createTable(body, nums)
}
function createTable(parent, arr) {
parent.textContent = '';
let cells = [];
for (let sub of arr) {
let tr = document.createElement('tr');
for (let num of sub) {
let td = document.createElement('td');
td.textContent = num;
tr.appendChild(td);
cells.push(td);
}
parent.appendChild(tr);
}
return cells;
}
function normalize(arr, left, right) {
for (let i = 0; i < left; i++) {
arr.unshift('');
}
for (var i = 0; i < right; i++) {
arr.push('');
}
return arr;
}
function getFirstWeekDay(year, month) {
let date = new Date(year, month, 1);
let num = date.getDay();
if (num == 0) {
return 6;
} else {
return num - 1;
}
}
function getLastWeekDay(year, month) {
let date = new Date(year, month + 1, 0);
let num = date.getDay();
if (num == 0) {
return 6;
} else {
return num - 1;
}
}
function getLastDay(year, month) {
let date = new Date(year, month + 1, 0);
return date.getDate();
}
function range(count) {
let arr = [];
for (let i = 1; i <= count; i++) {
arr.push(i);
}
return arr;
}
function chunk(arr, n) {
let result = [];
let count = Math.ceil(arr.length / n);
for (let i = 0; i < count; i++) {
let elems = arr.splice(0, n);
result.push(elems);
}
return result;
}
Хай! Сегодня у нас сайт предсказаний на JavaScript
Сегодня твоя задача сделать сайт, который будет выдавать предсказания. Пусть на этом сайте будет кнопка, по нажатию на которую будет запускаться таймер, который будет каждые 0.1 секунд выводить в в какой-нибудь див случайное число от 1 до некоторого максимального.
Под дивом пусть будет другая кнопка, по нажатию на которую пользователь нашего сайта может остановить таймер и зафиксировать некоторое число в диве. Это число будет номером предсказания. После этого покажите пользователю предсказание с этим номером, а все лишние кнопки уберите с экрана, чтобы пользователь не мог получить еще одно предсказание. То есть на один заход на сайт - одно предсказание.
P.s Попытайтесь сделать сами, но для решения накидайте десять смайлов)
Сегодня твоя задача сделать сайт, который будет выдавать предсказания. Пусть на этом сайте будет кнопка, по нажатию на которую будет запускаться таймер, который будет каждые 0.1 секунд выводить в в какой-нибудь див случайное число от 1 до некоторого максимального.
Под дивом пусть будет другая кнопка, по нажатию на которую пользователь нашего сайта может остановить таймер и зафиксировать некоторое число в диве. Это число будет номером предсказания. После этого покажите пользователю предсказание с этим номером, а все лишние кнопки уберите с экрана, чтобы пользователь не мог получить еще одно предсказание. То есть на один заход на сайт - одно предсказание.
P.s Попытайтесь сделать сами, но для решения накидайте десять смайлов)
Хай! Сегодня у нас вопрос "Почему нам нужен Origin?"
Как вы, вероятно, знаете, существует HTTP-заголовок Referer, который обычно содержит адрес страницы, инициировавшей сетевой запрос.
Например, при запросе (fetch) http://google.com с http://javascript.info/some/url заголовки выглядят так:
Accept: */*
Accept-Charset: utf-8
Accept-Encoding: gzip,deflate,sdch
Connection: keep-alive
Host: google.com
Origin: http://javascript.info
Referer: http://javascript.info/some/url
Как вы можете видеть, присутствуют и Referer, и Origin.
Вопросы:
Почему нужен Origin, если Referer содержит даже больше информации?
Возможно ли отсутствие Referer или Origin, или это неправильно?
Как вы, вероятно, знаете, существует HTTP-заголовок Referer, который обычно содержит адрес страницы, инициировавшей сетевой запрос.
Например, при запросе (fetch) http://google.com с http://javascript.info/some/url заголовки выглядят так:
Accept: */*
Accept-Charset: utf-8
Accept-Encoding: gzip,deflate,sdch
Connection: keep-alive
Host: google.com
Origin: http://javascript.info
Referer: http://javascript.info/some/url
Как вы можете видеть, присутствуют и Referer, и Origin.
Вопросы:
Почему нужен Origin, если Referer содержит даже больше информации?
Возможно ли отсутствие Referer или Origin, или это неправильно?
Доброе утро!
Напишите функцию JavaScript, чтобы получить наименьшее общее кратное (LCM) из двух чисел.
Замечания :
Согласно Википедии - общее число - это число, кратное двум или более целым числам. Общие кратные 3 и 4 равны 0, 12, 24, .... Наименьшее общее кратное (LCM) двух чисел - это наименьшее число (не ноль), которое кратно обоим.
Тестовые данные :
console.log (lcm_two_numbers (3,15));
console.log (lcm_two_numbers (10,15));
Выход :
15
30
Напишите функцию JavaScript, чтобы получить наименьшее общее кратное (LCM) из двух чисел.
Замечания :
Согласно Википедии - общее число - это число, кратное двум или более целым числам. Общие кратные 3 и 4 равны 0, 12, 24, .... Наименьшее общее кратное (LCM) двух чисел - это наименьшее число (не ноль), которое кратно обоим.
Тестовые данные :
console.log (lcm_two_numbers (3,15));
console.log (lcm_two_numbers (10,15));
Выход :
15
30