WebDEV

/* Каким цветом будет слово "Item"? */
div p:first-child { color: red; }
div p:first-of-type { color: blue; }

/* HTML:
<div>
  <h2>Title</h2>
  <p>Item</p>
</div>
*/

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

// Какой результат выведется в консоль?
function getMessage() {
  return () => {
    console.log(this.text);
  };
}

const obj1 = { text: 'Hello', getMessage };
const obj2 = { text: 'World' };

obj1.getMessage().call(obj2);

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

// В каком порядке выведутся логи?
const nums = [1, 2];

const run = () => {
  nums.forEach(async (num) => {
    await Promise.resolve();
    console.log(num);
  });
  console.log('Done');
};

run();

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

/* Чему будет равен margin-top у элемента .child? */
.parent {
  width: 400px;
  height: 200px;
}

.child {
  margin-top: 10%;
}

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

// Какой будет результат выполнения кода?
const user = {
  name: 'Max',
  greet() {
    setTimeout(function() {
      console.log(`Hi, ${this.name}`);
    }, 100);
  }
};

user.greet();

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

const [a, ...b] = [1, 2, 3];
const c = b;
c.push(4);

console.log(b);

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

:root {
  --main-color: red;
}
.box {
  --main-color: blue;
  color: var(--main-color, green);
}
/* Какой цвет текста будет у элемента .box? */

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

console.log(1);
setTimeout(() => console.log(2), 0);
queueMicrotask(() => console.log(3));
console.log(4);

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

const numbers = [1, 2, 3];
const result = numbers.push(4);

console.log(result);

WebDEV #test #Frontend Выберите правильный вариант 👇🏼

/* Какой цвет будет у текста в <div class="box">Text</div> ? */
div { color: red; }
.box:not(span) { color: green; }
.box { color: blue; }

WebDEV #test #Frontend Выберите правильный вариант 👇🏼