Задачи с собеседований (front-end)

    Так получилось, что за свою карьеру front-end разработчика, я побывала на многих собеседованиях. Тема прохождения интервью не теряет своей актуальности, а в комментариях, когда речь заходит о собеседованиях, начинают ломаться копья. Хочу тоже внести свой вклад и поделиться накопившейся коллекцией вопросов. Прошу.

    image

    Лирическое отступление


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

    Задачи


    Для начала что-нибудь полегче.

    1. Есть некоторая строка (var str = 'fgfggg';), что будет, если мы возьмем str[0]?

    Ответ
    str[0] вернет символ строки, который находится по нулевому индексу. Строка в js — immutable, то есть из нее можно прочитать символ, а вот записать нет.

    2. Реализовать методы, которые в процессе выполнения строки (2).plus(3).minus(1) дали бы на выходе 4.

    Ответ
    Поскольку, мы работаем с числами, надо расширить прототип Number новыми методами.

    Number.prototype.plus = function (value) {
    	return this + value;
    }
    
    Number.prototype.minus = function (value) {
    	return this - value;
    }
    

    Число два будет доступно через this в функции plus. Из нее мы возвращаем результат сложения числа, на которое указывает this и числа, переданного в качестве аргумента. Аналогично для minus.

    3. Сейчас уже редко, но до сих еще спрашивают: «Почему плохо писать прямо в прототипы базовых типов?»

    Ответ
    Array.prototype.sort = function () {}
    var t = [2, 1, 22];
    t.sort()
    

    Ожидаемый результат — [1, 2, 22], а вернется undefined.
    Мы рассчитываем, что стандартные методы сработают согласно документации, но какой-то разработчик можем переопределить метод, и он вернет совершенно неожиданный результат.
    Именно поэтому библиотека prototype.js уступила jQuery.

    4. Дана функция, она принимает в качестве аргументов строки '*', '1', 'b', '1c', реализуйте ее так, что бы она вернула строку '1*b*1c'

    Ответ
    Ее можно решать прямо в лоб, перебирая в цикле все аргументы, но мы поступим умнее.

    function getStr() {
    	return [].slice.call(arguments, 1).join(arguments[0])
    }
    


    5. Дано дерево, надо найти сумму всех вершин.

    Ответ
    Я решила задачу рекурсией, потом мы упростили решение, а затем переписали на очередь.

    Рекурсия.

    var sum = 0;
    
    function getSum(obj) {
    	sum += obj.valueNode;
    	if (obj.next != null) {
    		for (var i = 0; i < obj.next.length; i++) {
    			getSum(obj.next[i]);
    		}
    	}
    
    	return sum;
    }
    
    var tree1 = {
    				valueNode: 1,
    				next: [
    					{
    						valueNode: 3,
    						next: null
    					},
    					{
    						valueNode: 2,
    						next: null
    					}
    				]
    			} 
    
    var tree = {
    	valueNode: 3,
    	next: [{
    				valueNode: 1,
    				next: null
    			},
    			{
    				valueNode: 3,
    				next: null
    			},
    			{
    				valueNode: 2,
    				next: null
    			},
    			{
    				valueNode: 2,
    				next: [
    					{
    						valueNode: 1,
    						next: null
    					},
    					{
    						valueNode: 5,
    						next: null
    					}
    				]
    			}]
    };
    console.log(getSum(tree1));
    sum = 0;
    console.log(getSum(tree));
    

    Очередь.

    function getSum(obj) {
    	var arr = [obj],
    		sum = 0,
    		current;
    
    	while(arr.length > 0) {
    		current = arr.shift();
    		sum += current.valueNode;
    
    		if (current.next != null) {
    			for (var i = 0; i < current.next.length; i++) {
    				arr.push(current.next[i]);
    			}
    		}
    	}
    
    	return sum;
    }
    
    var tree = {
    	valueNode: 3,
    	next: [{
    				valueNode: 1,
    				next: null
    			},
    			{
    				valueNode: 3,
    				next: null
    			},
    			{
    				valueNode: 2,
    				next: null
    			},
    			{
    				valueNode: 2,
    				next: [
    					{
    						valueNode: 1,
    						next: null
    					},
    					{
    						valueNode: 5,
    						next: null
    					}
    				]
    			}]
    };
    getSum(tree)
    


    6. Можно ли из js менять значения в before, after?

    Ответ
    Нет, единственное что мы можем — это удалить класс, у которого указаны before или after, либо наоборот добавить.

    Давайте, что-нибудь для разгрузки мозга, вопрос на верстку.

    7. Вместить три блока 20X20px в ряд, в блок шириной 60px, при этом у блоков должны быть границы.



    Ответ
    так или так

    8. Как применяются скругленные углы для элементов и стили для текста(шрифт, тип шрифта, цветащте и тд)?

    Ответ
    Стилевые свойства применятся ко всем элементам с текстом, если у тегов не указаны стилевые правила. К примеру у ссылок указан цвет текста по умолчанию и он более приоритетный, чем определенный нами в body. Дело в том, что для многих свойств по умолчанию стоит значение inherit, то есть как у родителя. Получается поднимается вверх, пока не дойдет до body.
    Для свойства border-radius, наоборот, применяется только к тегу, у которого мы хотим что бы били скругленные углы.

    9. Что такое ресет стилей?

    Ответ
    Многим тегам стили прописаны по умолчанию, в процессе верстке нам приходится переопределять их. Что бы не делать это каждый раз, мы «скидываем» их «массово». Для этого заводим файл под стили, подключаем его первым или в первом стилевом файле, в самом верху указываем наши стили для базовых тегов.
    К примеру. Мы часто используем список ul для верстки меню, для этого мы каждый раз вынуждены обнулять padding, margin и list-style-type. Можно один раз задать стили, и списки станут без внешней и внутренней границы, а так же без маркеров.

    10. Требуется сверстать попап по центру, его размеры нам известны, но мы не хотим что бы он прокручивался вместе со страницей, причем по высоте может и не влезать в высоту экрана.

    Ответ
    body {
      overflow: hidden;
    }
    
    .wrap {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow-y: auto;
      background-color: rgba(230, 230, 230, .1);
    }
    
    .popup {
      position: absolute;
      width: 400px;
      height: 300px;
      right: 0;
      left: 0;
      top: 0;
      bottom: 0;
      margin: auto;
    }
    


    11. Нарисовать стилями полукруг.


    Ответ
    width: 100px;
    height: 100px;
    border-right: 1px solid #f00;
    border-radius: 0 50% 50% 0;
    


    12. Есть массив в котором лежат объекты с датами, отсортировать по датам.

    Ответ
    var arr = [{date: '10.01.2017'}, {date: '05.11.2016'}, {date: '21.13.2002'}];
    
    arr.forEach(function(item) {
    	var arrDate = item.date.split('.'),
          date = new Date(Number(arrDate[2]), Number(arrDate[1]), Number(arrDate[0]));
          item.time = date.getTime();
    });
    
    arr.sort(function (a, b) {
      if (a.time - b.time < 0) {
            return false;
          } else {
            return true;
          }
    });
    
    var res = arr.map(function (item) {
      return {date: item.date};
    });
    
    console.log(res);
    


    13. Есть несколько слов, определить состоят ли они из одних и тех же букв('кот', 'ток', 'окт')

    Ответ
    var arr = ['kot', 'tok', 'okt'],
    	arr1 = ['kot', 'tok', 'ott'];
    
    function sameWords(arr) {
      var word1, word2;
      
      for (var i = 0; i < arr.length-1; i++) {
        word1 = 0;
        word2 = 0;
        
        if (arr[i].length !== arr[i+1].length) {
            return false;   
        } else {
          for (var j = 0; j < arr[i].length; j++) {
            word1 += arr[i][j].charCodeAt(0);
            word2 += arr[i+1][j].charCodeAt(0);
          }
          
          if (word1 !== word2) {
            return false;
          }
        }      
      }
      
      return true;
    }
    
    console.log(sameWords(arr));
    console.log(sameWords(arr1));
    


    Про промисы


    В последнее время часто стали задавать вопросы про promse, что это такое, какие методы обработки ошибок, можно ли обойтись без них.(14, 15, 16)

    Ответ
    Начну издалека, так как js-асинхронен, то в результате отслеживания завершения определенного когда в качестве аргументов передавались callback-функции, которые и вызывались по мере готовности. Цепочка ассинхронных методов росла, что приводило к Callback Hell, что затрудныло работу с кодом, отлаживание ошибок и им на смену пришли промисы.

    var promis = new Promise(function (resolve, reject) {
    	...
    	setTimeout(function () {
    		resolve(res);
    	}, 5000);
    });
    

    Несколько промисов можно объединить и получить разом ответ от них
    var promisesImages = [];
    
    for (let i = 0; i < count; i++) {
        promisesImages.push(new Promise((resolveImg, rejectImg) => {
            let img =  new Image(),
                startTime = Date.now();
    
            img.src = this.imgUrl + '?' + Math.floor(Math.random() * 100000000);
    
            img.onload = () => {
                resolveImg(Date.now() - startTime);
            };
            img.onerror = rejectImg;
        }));
    }
    
    Promise.all(promisesImages)
        .then((timings) => {...})
    


    17. И конечно вопрос на засыпку: «Каким образом можно обойтись без промисов?».

    Ответ
    По старинке, вводили переменную-счетчик и как-только наступало окончание очередного асинхронного действия, сравнивали переменную с общем количеством.

    18. Еще вспомнился вопрос про обработку ошибок в промисах. У нас есть три запроса к серверу, один возвращает нам имя пользователя, второй его данные, а третий изображение для аватарки, мы для каждого запроса используем по промису, объединяя их в цепочку, что будет если в одном из запросов произойдет ошибка, довыполнится ли цепочка?

    Ответ
    Нет

    Промисы все разрастаются и на смену Callback Hell приходит Promise Hell. Что же делать?

    Ответ
    function test() {
    	return new Promise(function (resolve) {
    		setTimeout (function () {
    			resolve(1);
    		})
    	})
    }
    
    async function test1() {
    	var res = await test();
    	console.log(res + 1);
    }
    

    Фактически выполнение test1 как бы «останавливается» до того момета пока мы не получим ответ от test. Я и раньше читала про эти методы, но особо не обращала внимание, а как-то в разговоре речь зашла о них, я удивилась: «Как так, выполнение останавливает, это же не понятно, что за функция, где она определена, когда callback — здесь все понятно, видно что произойдет в функции по завершению операции, ну или всегда можем поискать по имени, опять же, привычно про контекст». На что мне ответили, что у меня javascript головного мозга и я на столько привыкла к асинхронности, что синхронное выполнение мне кажется чем-то за гранью, а ведь в в пыхе, на которой я некогда программировала все синхронно, там даже если чтение из файла, пока не завершиться, дальше не продолжится.

    (19)Вот еще один примерчик на асинхронность. Объяснить в какой последовательности выведутся цифры и почему так.
    console.log(1);
    setTimeout(function() {
    	console.log(2);
    }, 0)
    console.log(3);
    

    Достаточно популярный, надо сказать. Вот мне он и достался в очередной раз. Уже отработано начала отвечать: «1, 3, 2. Так как хоть js и асинхронен, но внутри его есть очередь выполнения и setTimeout и setInterval, если им указан 0, помещают вызов функции в конец очереди.»
    Тут надо сказать ребята зафейлились, заявив, что я ответила правильно, про 132, но не объяснила почему.

    (20)Вообще вопросы на setTimeout и setInterval весьма актуальны.Меня спрашивали: «Какое минимальное время можно задать?»

    Ответ
    В каждом браузере есть свой минимум, если вы указываете меньше него, то все равно задержка будет не меньше минимуму. Иногда даже и больше указанного времени, так как задача попадает в очередь и время складывается из заданного плюс затраты в на выполнение на задач в очереди перед ней.

    Куда же без замыканий


    Не давно выделили целую статью для этого примера(тут), читатели в комментариях расписывали всевозможные способы решения, от традиционных до фантастических. Вот о которых я обычно рассказывала на собеседованиях.
    for (var i = 0; i < 10; i++) {
    	setTimeout(function () {
    		console.log(i);
    	}, 100);
    }

    21. Что будет выведено в консоль, как можно модифицировать пример что бы он возвращал правильный результат(назовите как можно больше способов)?

    Ответ
    Самый распространенный, обернуть в замыкание

    for (var i = 0; i < 10; i++) {
    	(function (i) {
    		setTimeout(function () {
    			console.log(i);
    		}, 100);
    	})(i)
    }
    

    Не все обращали внимание, что в i можно передать не только контекст

    for (var i = 0; i < 10; i++) {
    	setTimeout(function (i) {
    		console.log(i);
    	}.bind(this, i), 100);
    }
    

    Так же методам setInterval и setTimeout можно передать аргументы, которые будут прокинуты в качестве аргументов калбек-функции
    for (var i = 0; i < 10; i++) {
    	setTimeout(function (i) {
    		console.log(i);
    	}, 100, i);
    }
    

    es6

    for (let i = 0; i < 10; i++) {
    	setTimeout(function () {
    		console.log(i);
    	}, 100);
    }
    

    Одна из возможностей es6, в данном случае сработает несколько неожиданно, let не в блоке {}.

    Давайте что-нибудь похардкорнее.

    22. Надо написать функцию, которая вернет «hello world», но при этом в теле функции нельзя использовать ни цифры, ни буквы, а циклы, массивы, объекты можно, но без цифр.

    Ответ
    Увы, эти интересные люде не сказали мне как ее решать, поэтому, подумав дома, я могу только предположить.

    var zero = [].length,
         one = [{}].length,
         two = [,,].length,
        seven = [,,,,,,,].length;
    
    console.log(String.fromCharCode(Number(String(seven) + String(two))));
    

    Так я получила букву H, но это изврат еще тот, осталось сделать оставшиеся 10 знаков…

    (23) От них же. Числа от 1 до 100 лежат в массиве, они хаотично перемешанные, от туда изъяли одно число, надо найти, что это за число. алгоритм не должен превышать O(n^2) сложности.

    Ответ
    Пройти массив циклом и сложить все имеющиеся там цифры и вычесть из числа, полученного по формуле (n + 1) / (n / 2).

    Мне пришло в голову более экзотическое решение. Детям и слабонервным лучше не смотреть.

    var sum = 101*50,
         sumArr = eval([4, 2, ... 3, 7].join('+').replace('++', '+')),
         res;
    res = sum-sumArr;
    


    Просто мне вспомнилось, что когда-то спрашивали: «Как быстрее всего найти сумму элементов массива?»

    Ответ
    eval([4, 2, ... 3, 7].join('+')
    


    Вот на тот момент вспомнилось и не пришло ни чего лучше.

    (24) Вот еще фейл-задача. Приведу дословно, те напишу как написали мне.

    function Book(name, author) {
        this.name = name;
        this.author = author;
        return this;
    }
    
    function Foo(Book, 'Учебник javascript', 'Петр Сергеев')
    

    Реализовать Foo

    Ответ
    Меня сбила эта строчка function Foo(Book, 'Учебник javascript', 'Петр Сергеев'). Только я вижу, что здесь что-то не так? Мне предложили решать через Object.create(), но я не согласна. Свойства и методы, записаные в саму функцию-конструктор, не будут «скопированы» Object.create.

    function Book(name, author) {
        this.name = name;
        this.author = author;
        return this;
    } 
    
    function Foo(Cclass, name, author) {
      return Object.create(Cclass.prototype);
    }
    
    var book = Foo(Book, 'js', 'petr');
    
    console.log(book.name); -> undefined
    

    Конечно меня не взяли, а на последок посоветовали лучше учить теорию. Хнык-хнык.
    В любом случае, я бы предпочла решать так.

    function Book(name, author) {
        this.name = name;
        this.author = author;
        return this;
    }
    
    function Foo(Cclass, name, author) {
        return Cclass.call({}, name, author);
    }
    
    var book = Foo(Book, 'js', 'petr');
    console.log(book.name);
    

    Хочу посоветовать чувакам лучше готовиться к собеседованиям.

    Задача про палиндром


    (25) Да, до сих пор ее задают. Причем она попалась мне несколько раз. В первый раз я стала решать циклом, вроде бы получилось, только оставалась проблема с разными символами, писать для каждого символа replace — это не вариант, а в регулярках я не сильна, да и сработает он до первого подходящего вхождения. Я не привыкла оставлять за спиной что-то непонятное, поэтому разобралась как реализовать функцию.

    function isPalindrom1(str) {
        if (str.toLowerCase().replace(/[^а-яА-ЯёЁ]/g, '') === str.toLowerCase().replace(/[^а-яА-ЯёЁ]/g, 
        '').split('').reverse().join('')) {
            return true;
         } else {
            return false;
         }
    }
    

    Красиво, просто, изящно.

    Забавно, но где-то через год мне попался этот же вопрос. Я обрадовалась: «Свезло». Как оказалось, нет. Требовалось решить с помощью цикла, а регулярку можно было использовать только для одного символа. Собеседник мотивировал это тем, что replace с регуляркой по всей строке — слишком ресурсоемко.

    Подумав дома, у меня получилось вот так:
    function isPalindrom(str) {
        var str = str.toLowerCase(),
              lim = str.length - 1,
              i = 0,
              j = str.length - 1;
    
        while (i <= lim) {
            if (/[^а-яА-ЯёЁ]/.test(str[i])) {
                i += 1;
            }
            if (/[^а-яА-ЯёЁ]/.test(str[j])) {
                j -= 1;
            }
            if (str[i] != str[j]) {
                return false;
            }
            i += 1;
            j -= 1;
       }
       return true;
    }
    console.log(isPalindrom('А роза упала на лапу Азора'));
    

    26. Как подключить js, css? Плюсы, минусы разных способов?

    Ответ
    Можно с помощью тегов
    <script></script>
    <style></style>  
    

    прямо на странице или
    <script src="script.js"><script>
    <link rel="stylesheet" href="/css/style.css"> 
    

    подключаем из внешних файлов.

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

    27. Чем opacity отличается от visible: hidden и что это такое, отличие от overflow: hidden?

    Ответ
    opacity отвечает за прозрачность элемента. Принимает значения от 0 до 1, при 0 — элемент не виден, .5 — полупрозрачен, 1 — полностью виден. Даже при 0 занимает место на странице.
    Элемент со стилями visible: hidden так же занимает место, не видим. Но в отличие от элемента с opacity, js-события на нем не срабатывают.
    display: none — полностью скрывает элемент, он не видим и не занимает место на странице. javascript не может получить ни width, height.
    overflow: hidden; — скрывает все, что попадет за его пределы.

    Модное слово — каррирование


    28. Реализовать функцию f: f(2, 3) -> 5, при вызове f(2)(3), тоже вернет 5

    Ответ
     function f(a, b) {
     	if (b !== undefined) {
     		return a + b;
     	} else {
     	return function (b) {
     		return a + b;
     		}
     	}
     }
    

    Хоть данный шаблон упоминается в книге Стефанова, на практике я ни разу не видела, что бы кто-то его использовал.

    Более сложный вариант.
    f(1)(2)(3)() -> 6, f(0)(3)(1)(5)() -> 8

    Ответ
    function f(arg) {
    	var value = arg;
    
    	return function (arg) {
    		if (arg !== undefined) {
    			return f(value + arg);
    		} else {
    		return value;
    		}
    	}
    }
    


    Реализовать функцию, которая возвращает результаты

    foo(1)(2)(3) -> 6
    foo(1)(2)(3)(4) -> 10
    foo(-1)(2)(3)(4)(7) -> 15
    foo(1)(2)(3)...(n) вернет результатом сумму 1+2+3...+n

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

    В итоге получилось
    function foo(value) {
    	var acc = value;
    	function addNext(next) {
    		acc += next;
    		return addNext;
    	}
    	addNext.toString = addNext.valueOf = function() {
    		return acc;
    	}
    	return addNext;
    }
    


    29. На собесе на прошлую работу мне попался вопрос: 'Что такое live/die'

    Ответ
    Где то из глубины сознания всплыло, что это аналог on/off, с помощью них можно навешивать/удалять обработчики на события их. Но более старые методы, по сравнению on/off.
    В проекте я столкнулась с еще и с bind/unbind

    30. JSONP, как реализовать


    Ответ
    Мы не хотим находясь на одном сайте, получать данные с другого и как-то их обрабатывать. Что же делать? Может ajax, но у него есть ограничение по политике бозопасности. Надо что-то совпадали протокол, домен и порт, даже на поддомены мы не можем слать ajax-запросы.
    Все же разработчики нашли некий лайфхак для крос-доменных запросов.
    Если вы используете jquery, то всего-то надо указать в параметре «dataType» — «jsonp».
    Мало кто знает, что лежит в основе данного запроса, реализация нативным js приблизительно такая

    	var url = 'http://mydomen.com/news.php',
    		script = document.createElement('script'),
    		callbackName = 'jsonCallback' + Math.randome();
    
    	script.src = url + '?callback' + callbackName;
    	window[callbackName] = function(response){
    		console.log(response);
    	}
    
    	document.header.appendChild(script);
    

    тег script начинает выкачивать скрипт, лежащий по адресу в атрибуте src, а после закачки, происходит выполнение. Поэтому мы создаем тег script. Случайным образом генерируем имя функции. Формируем урл к ресурсу, где в качестве параметра передается имя нашей новой функции.
    В глобальную область, по ключу callbackName помещается функция, которая вызовется, при получение данных от ресурса, они станут доступны внутри через параметр.
    <script src='http://mydomen.com/news.php?callback0.90428777...'>
    

    На сервере ресурса сработает что-то в этом роде
    echo $_REQUEST[callback] + '(' + json_encode($arDate) + ')';
    

    В window попадет
     window.jsonCallback0.90428777 -> function (response) {
     	console.log(response);
     }
    

    Так как теги с атрибутом src способы посылать только GET запросы, то jsonp не поддерживает POST

    31. Заголовки CORS?

    Ответ
    Это альтернатива jsonp, в специальном заголовках перечисляются «доверенные» ресурсы, которые смогут получать данные от него, а если указать '*', то любые сайты, при обращение, станут получать данные.
    Так же как и с jsonp доступны только GET запросы.

    Когда я рассказывала про альтернативу jsonp интервьюер от этого вариант «отмахнулся», сказав, что не надежный. Я с ним не согласна. JSONP легче подменить, чем CORS-заголовки
    <script src="http://bla-bla/get?callback=f'></script>

    <? echo $GET['callback'].'('.$date.')';


    В date подпихнуть вут такую строчку
    ');alert(document.cookie);'


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

    32. Ускорение загрузки страницы.

    Ответ
    1 минимизировать и склеить в один все js-файлы
    2 то же и с css
    3 собрать изображения в спрайты
    4 кеширование
    а) файлы js и css кешируются навсегда( или на длительный период, к примеру на год), когда в них вносятся какие-то изменения, в результате разработки, меняется номер версии, браузер считает, что это новые файлы и закачивает их. Время кеширование содержится в заголовке expires.
    б) файл кешируется до тех пор, пока в нем не произошли изменения. Когда пользователь в первый раз заходит на сайт, у него еще нет кеша, файлы закачиваются и в следующий раз, когда происходит обмен заголовками происходит анализ ETag(хеш суммы содержимого содержимого файла или хеш последнего времени изменения, или номер версии) Если он изменился, то закачивается, в противном случае, берется из хеша.
    Так же можно брать заголовки с датой последней модификации(Last_Modifed), но это менее надежно.
    в) можно сжать данные перед отправкой, решается настройкой конфига в nginx. Пример. Content-Encoding: gzip
    г) можно разбить js на модули и на разных страницах подключать по мере необходимости.

    Можно найти еще несколько, но они менее популярны или устарели.

    33. CommonJS и AMD или модульность?

    Ответ
    Один принцип архетектры асинхронен, а второй синхронен. В качестве примера можно привести RequaerJs, по одному его виду можно сказать, что он асинхронен

    define([
    	mod1,
    	mod2,
    	mod3
    ], function (Mod1, Mod2, Mod3) {
    	new Mod1();
    	....
    });
    

    define — фактически простая функция, все, что написано за ее приделами будет выполняться без оглядки на то, что происходит в define, поэтому одним аргументом идет callbeck-функция. Как только подгрузятся все зависимости, перечисленные в массиве, так они станут доступны внутри через аргументы callbeck-функции.
    Система модулей в Node.Js наоборот синхронна. Мы пишем:

    var mod = requaer('modul');
    

    и сразу ниже с mod можно работать, все останавливается, пока модуль не загрузится

    34. Еще интересный пример. Реализовать методы seven, plus, one, five, minus, two. seven(plus(one())) -> 8. five(minus(two())) -> 3

    Ответ
    На собеседование я начала решать так:

    function one(arg){
    	if (typeof arg === 'function') {
    		return arg(1);
    	} else {
    		return 1;
    	}
    }
    
    function seven(arg) {
    	if (typeof arg === 'function') {
    		return arg(7);
    	} else {
    		return 7;
    	}
    }
    
    function plus(arg) {
    	return function (a) {
    		return a + arg;
    	}
    }
    

    Аналогично пишутся функции для five, minus, two. Уже дома, поразмышляв в спокойной обстановке, появилось такое решение

    function one(arg) {
    	return 1 + (arg || 0);
    }
    
    function two(arg) {
    	return 2 + (arg || 0);
    }
    
    function five(arg) {
    	return 5 + (arg || 0);
    }
    
    function seven(arg) {
    	return 7 + (arg || 0);
    }
    
    function plus(arg) {
    	return arg;
    }
    
    function minus(arg) {
    	return -arg;
    }
    


    35. Сортировка пузырьком.

    Да, да, ее еще спрашивают.

    Ответ
    var m = [1, 7, 5, 13, 8],
          count = m.length - 1,
          max;
    for (var i = 0; i < count; i++) {
        for (var j = 0; j < count - i; j++) {
            if (m[j] > m[j + 1]) {
                max = m[j];
                m[j] = m[j + 1];
                m[j + 1] = max;
            }
        }
    }
    


    36. Обратная польская нотация.

    Основной принцип. Дана строчка 23+1-, начинаем двигаться по ней, как только доходим до первого арифметического знака, берем две цифры перед ним и на их место, записываем результат вычисления. Получится 51-. Начинаем все с начала.
    Кому интересно, вот статья wikipedia

    Ответ
    var notation = '23+1-', notation1 = '7 2 3 * -', notation2 = '1 2 + 4 * 3 +';
    function getComputation(notation) {
        var queue = [], tmp, num1, num2;
        for (var i = 0; i < notation.length; i++) {
            if (/\d+/.test(notation[i]) === true) {
                queue.push(Number(notation[i]));
            }
            else {
                switch (notation[i]) {
                    case '+':
                        tmp = queue.pop() + queue.pop();
                        queue.push(tmp);
                        break;
                    case '-':
                        num1 = queue.pop();
                        num2 = queue.pop();
                        if (num1 > num2) {
                            tmp = num1 - num2;
                        }
                        else {
                            tmp = num2 - num1;
                        }
                        queue.push(tmp);
                        break;
                    case '*':
                        tmp = queue.pop() * queue.pop();
                        queue.push(tmp);
                        break;
                    case '/':
                        tmp = queue.pop() / queue.pop();
                        queue.push(tmp);
                        break;
                }
            }
        }
        return queue[0];
    }
    console.log(getComputation(notation));
    console.log(getComputation(notation1));
    console.log(getComputation(notation2));
    

    Мне рассказали ее принцип, поэтому только реализовать механизм.

    37. Есть div, в нем другой div, у второго задан padding 50%, как это все будет выглядеть?

    Ответ
    .wrap {
      width: 200px;
      border: 1px solid green;
    }
    
    .block {
      width: 200px;
      padding-bottom: 50%;
      border: 1px solid red;
    }
    



    Собеседник предложил мне посмотреть дома как оно сработает, хотя мне стало очень интересно.
    Как вы считаете, правильно ли на собеседование отвечать самому на вопрос, если кандидат с ним не справился?

    38. Есть строка, состоящая из разных скобок, проверить закрыты ли все.  Пример строки: "())({}}{()][]["

    Ответ
    function validBraces(str) {
    
    	var arrOpenSymbols = [],
    		result = false,
    		countOpenSymbols;
    	if (str.length > 0) {
    		for (var i = 0; i < str.length; i++) {
    			if (str[i] === '{' || str[i] === '[' || str[i] === '(') {
    				arrOpenSymbols.push(str[i]);
    			} else {
    				countOpenSymbols = arrOpenSymbols.length;
    				if ((str[i] === '}' && arrOpenSymbols[(countOpenSymbols-1)] === '{') ||
    					(str[i] === ']' && arrOpenSymbols[(countOpenSymbols-1)] === '[') ||
    					(str[i] === ')' && arrOpenSymbols[(countOpenSymbols-1)] === '(')
    					) {
    						arrOpenSymbols.pop();
    				}
    			}
    		}
    
    		if (arrOpenSymbols.length === 0) {
    			result = true;
    		} else {
    			result = false;
    		}
    	}
    	return result;
    }
    console.log('');
    console.log(validBraces('()'));
    console.log(validBraces('[)'));
    console.log(validBraces('{}[]()'));
    console.log(validBraces('([{}])'));
    console.log(validBraces('())({}}{()][]['));
    

    Если бы передавались строки из скобок '{', '[', ']', '}'

    function validBraces(str) {
    	try {
    	 	eval(str);
    	 	return true;
    	 } catch (err) {
    	 	return false;
    	 }
    }
    


    39. Напишите код, который при клике на любой div внутри root будет выводить в консоль его id.

    <div id="root" style="background: red;">
        root
        <span id="id1" style="background: lightblue;">id1</span>
        <div id="id2" style="background: green;">
            id2
            <div id="id3" style="background: yellow;">id3</div>
        </div>
    </div>
    

    Ответ
    $('#root').on('click', function (event) {
        event.stopPropogation();
        console.log($(event.target).attr('id'));
    })
    


    40. Напишите код, который сделает из массива объект
    // на входе массив
    var arr = [
     {name: 'width', value: 10}, 
     {name: 'height', value: 20}
    ]
    

    // на выходе объект
    {width: 10, height: 20}
    

    Ответ
    function getObj(arr) {
        var obj = {};
        
        arr.forEach(function(item){
            obj[item.name] = item.value;
        });
        
        return obj;
    }
    


    41. Что выведется в результате?

    var i = 10;
    var array = [];
    
    while (i--) {
        (function (i) {
            var i = i;
            array.push(function() {
                return i + i;
            });
        })(i);
    }    
    
    console.log([
        array[0](),
        array[1](),
    ])
    

    Ответ
    [18, 16], так как за счет функции

    (function (i) {})(i);

    создает замыкание, var i = i — уже принадлежат областям видимости в замыканиях.

    function() { return i + i; }

    в начале поищет в своей области видимости i, не найдя, подымется на уровень выше и там найдет его. Из функции вернется сумма, которая будет положена в массив последним элементом.

    42. Есть функция и объект. Напишите все известные вам способы, чтобы вывести в консоли значение x из объекта используя функцию

    function f() { console.log(this.x); }
    var obj = {x: 'bar'};
    

    Ответ
    f.call(obj, a, b);
    f.apply(obj, [a, b]);
    
    obj.funk = function f() { console.log(this.x); }
    obj.funk();
    
    function f() { console.log(this.x); }.bind(obj, a, b);
    f();
    


    43.
    function Book() {
        this.name = 'foo'
    }
    
    Book.prototype = {
        getName: function() {
            return this.name;
        }
    };
    
    var book = new Book();
    
    Book.prototype.getUpperName = function() {
        return this.getName().toUpperCase();
    }
    
    book.getUpperName();
    

    Что вернет метод?
    а) ошибку, т.к. метод объявлен позже, чем создание экземпляра
    б) вернется 'FOO'

    Ответ
    'FOO'

    44. В js переменные объявленные следующим образом:
    a=3; b=«hello»;
    Укажите правильные утверждения.
    а) создаются в локальном контексте
    б) создаются в глобальном контексте
    в) создание переменной без ключевого слова var — синтаксическая ошибка.

    Ответ
    б) и в)

    45. Что вернёт этот код — typeof (function(){})()
    а) callback
    б) method
    в) undefined
    г) function

    Ответ
    в)

    46. Что будет если задать margin: -10px;

    47. Почему 0.1 + 0.2 даст 0.30000000000000004

    Ответ
    Связано с системой представления десятичных чисел, не точностью их вычисления.

    48. Моему коллеге на должность php-разраба, предложили такую
    Есть два блока, второй скрытый, если в первом нет дочерних элементов, то показать второй.

    Представляю вашему вниманию мое решение
    <div class="block1">
      <div></div>
    </div>
    <div class="block2">
      <div></div>
    </div>
    

    .block1 {
      width: 150px;
      height: 20px;
      border: 1px solid red;
    }
    .block2 {
      display: none;
      width: 100px;
      height: 50px;
      border: 1px solid red;
    }
    

    function showBlock() {
      var block1 = document.getElementsByClassName('block1')[0],
          block2 = document.getElementsByClassName('block2')[0];
      if (!(block1.childNodes.length > 0 )) {
        block2.style.display = 'block';
      }
    }
    document.addEventListener("DOMContentLoaded", function () {
      showBlock();
    });
    


    Конечно это не все задания, которые мне довелось решать, какие-то я благополучно забыла, какие-то слишком банальные, масса вопросов, просто на теорию, остались за кадром.

    Прочее


    Вот еще парочка вопросов, они на прямую не касаются фронта, но, наверно не лишне знать.
    Идеальный интерфейс в вашем представление?
    Как вы бы сделали отказоустойчивый сайт?
    Какие типы уязвимостей знаете?
    Поделиться публикацией

    Похожие публикации

    Комментарии 201
      0

      Зачем вы в некоторых примерах в зависимости от выполнения условия возвращаете из функции булево значение, если можно сразу вернуть из функции условие?

        0
        вернуть из функции условие
        Хм, это как? Вы имели в виду вернуть другую функцию?
          +6
          Я имел ввиду, что например вместо
          arr.sort(function (a, b) {
            if (a.time - b.time < 0) {
                  return false;
                } else {
                  return true;
                }
          });
          


          Лучше сделать так
          arr.sort((a,b) => {
            return !(a.time - b.time < 0);
          })
          
            –9
            Довольно часто первый вариант кода — очевидней.
              +11

              Довольно часто это когда? Можно пример когда это будет очевидней?

                +8
                Более очевидный вариант
                bool IsBukva(char symbol)
                {
                switch(symbol)
                {
                case'a':return 1;break;
                case'b':return 1;break;
                case'c':return 1;break;
                case'd':return 1;break;
                case'e':return 1;break;
                case'f':return 1;break;
                case'g':return 1;break;
                case'h':return 1;break;
                case'i':return 1;break;
                case'j':return 1;break;
                case'k':return 1;break;
                case'l':return 1;break;
                case'm':return 1;break;
                case'n':return 1;break;
                case'o':return 1;break;
                case'p':return 1;break;
                case'q':return 1;break;
                case'r':return 1;break;
                case's':return 1;break;
                case't':return 1;break;
                case'u':return 1;break;
                case'v':return 1;break;
                case'w':return 1;break;
                case'x':return 1;break;
                case'y':return 1;break;
                case'z':return 1;break;
                case'A':return 1;break;
                case'B':return 1;break;
                case'C':return 1;break;
                case'D':return 1;break;
                case'E':return 1;break;
                case'F':return 1;break;
                case'G':return 1;break;
                case'H':return 1;break;
                case'I':return 1;break;
                case'J':return 1;break;
                case'K':return 1;break;
                case'L':return 1;break;
                case'M':return 1;break;
                case'N':return 1;break;
                case'O':return 1;break;
                case'P':return 1;break;
                case'Q':return 1;break;
                case'R':return 1;break;
                case'S':return 1;break;
                case'T':return 1;break;
                case'U':return 1;break;
                case'V':return 1;break;
                case'W':return 1;break;
                case'X':return 1;break;
                case'Y':return 1;break;
                case'Z':return 1;break;
                default:return 0;
                }
                }


                www.govnokod.ru/212
                  +2
                  гы-гы… напомнило вывод строки в лабе у одногруппника
                  Скрытый текст
                  for(int i=0; i<str_len; i++)
                  {
                     if(str[i] == 'a')
                     {
                          cout<<"a";
                      }
                     if(str[i] == 'b')
                     {
                          cout<<"b";
                      }
                      ....
                  }
                   

                    0
                    if ((a == b).ToString().Length > 4)…
                    переведите на любой язык, который нравится.
                      0
                      wut???
                      Это хоть на каком-то языке является валидным кодом?
                        +2
                        C# например.
                        То есть насколько он кривой это вопрос отдельный. Но валидным является и если я спросонья ничего не путаю, то выдаёт тоже самое что и «a!=b»
                        0
                        А что ему может помешать быть валидным кодом?
                          0
                          Как-то сразу не подумал что булевое значение может быть объектом. Слишком привык на сишке писать.
                            +1
                            C#, Javascript, Python — любое значение есть объект.
                              +2
                              А у меня наоборот. Настолько привык что всё объекты, что каждый раз когда лезу что-то делать в наши легаси-системы, то сначала впадаю в ступор и не могу понять почему всё не хочет так работать как я хочу :)
                      +8
                      Долго думал, что же не так с этим кодом. Потом понял — отступов не хватает.
                  +2
                  Или даже
                  arr.sort((a, b) => {
                    return a.time - b.time >= 0;
                  })
                  
                    +1
                    Или даже так :)
                    arr.sort((a, b) => a.time - b.time >= 0);
                      +8
                      А слона не приметили…
                      arr.sort((a, b) => a.time - b.time)
                        –3
                        А вот так делать нельзя.
                        Внезапно
                        >> [0, Number.MIN_VALUE].sort((a, b) => a - b)
                        Array [ 0, 5e-324 ]
                          +5
                          А что не так с массивом [ 0, 5e-324 ]?
                            0
                            Как минимум то, что он отсортирован по убыванию, тогда как компаратор предполагает обратное.
                              +3
                              Вообще-то 5e-324 — это положительное число…
                                0
                                Таки да, был неправ при выборе элементов массива.

                                [1<<31, 1].sort((x, y) => x-y)
                                  +1
                                  И опять все работает…

                                  > [1<<31, 1].sort((x, y) => x-y)
                                  < (2) [-2147483648, 1]
                                    0
                                    Сдаюсь. Видимо, действительно, javascript не подвержен переполнению.
                                      +1
                                      Поправка: не подвержен переполнению при выполнении арифметических операций. Или, еще точнее, арифметическое переполнение не приводит к некорректному знаку:

                                      > 1e200 * 1e200
                                      < Infinity

                                      А вот при выполнении побитовых операций переполнение еще как возможно:

                                      > 1 << 31
                                      < -2147483648

                                      Кстати, можете попытаться найти ошибки кинув в исходный массив несколько Infinity — их вычитание даст NaN у которого знак не определен. Или можно сразу NaN в массив положить и посмотреть что будет. Но тут результат может отличаться в разных браузерах.

                    +3

                    Вообще-то компаратор в sort должен отдавать число, поэтому достаточно только вычитания.

                +3
                Да, спасибо, не доглядела. Действительно, местами можно было короче.
                  +13

                  Треш, угар и содомия прости господи… Ну давайте уже давать людям нормальные тестовые задания на пару суток. Чтобы погуглить и подумать время было. А не эти все O-два-эН и бинарные деревья рисовать гуашью. Дурака всегда будет видно по явной копипасте, а умный даже если скопипастит, то это будет уместно.

                    +4
                    Всякий ли разработчик захочет тратить пару суток на решение «нормального» тестового задания? А если учесть, что он в поисках, и может рассматривать несколько вакансий?
                      +1

                      Это от разработчика зависит. Если он хочет на работе бинарные деревья рисовать то это его проблемы. По хорошему тестовому во первых понятно что разработчик из себя представляет, во вторых разработчик сразу для себя поймёт интересен ли ему стек с которым ему предстоит работать.

                        –11
                        Всякий ли разработчик захочет тратить пару суток на решение «нормального» тестового задания?

                        А какая, собственно, разница? Предложение на IT рынке труда сейчас очень сильно превышает спрос, этот не захочет — на его место будет десяток других, которые захотят.

                          +13

                          Вы на каком-то очень странном рынке IT живете. У меня все наоборот.
                          Удачи вам, держитесь.

                            0
                            Вы на каком-то очень странном рынке IT живете. У меня все наоборот.

                            На вполне себе обычном. Есть ведь статистика по динамике зарплат (рост которых в IT отстает от других отраслей) и по соотношению количества вакансий/резюме (каковое планомерно сдвигается в сторону резюме). А вы просто продолжаете жить в ~2005.

                              0
                              Как там было то? А, вот: «Не доверяй статистике кроме той, которую сфальсифицировал сам» :)
                              Ну и потом Россия далеко не единственная страна где нужны айтишники :)
                                0
                                Ну и потом Россия далеко не единственная страна где нужны айтишники :)

                                Я про мир говорю. Россия, как водится, слегка отстает от мировых тенденций :)

                                  +1
                                  Ну вот я сейчас в Германии в городе-миллионике с наличием индустрии, хорошими зарплатами и своими университетами. Айтишников не хватает катастрофически. Причём всех: программистов, админов и даже тестеров.

                                  У нас на фирме постоянно открытые вакансии и так у большинства фирм в городе. С другой стороны я 3-4 раза в месяц получаю из различных источников «ненавязчивые предложения» сменить работу.
                                    0

                                    Это для джунов или мидлов? Джунов как мне показалось, хватает, львиная доля всех резюме как раз от них. А вот мидлов и выше хотят забрать себе многие, т.к. их катастрофически не хватает, особенно на фоне кучи джунов. Хотя и среди джунов нет как таковых джунов.

                                      0
                                      Если честно я не уверен что разные люди подразумевают под «джуниорами». У нас это либо «птушники»(azubis, если название о чём-то говорит) на обучении, либо молодые ребята без опыта работы или с небольшим опытом. И от них всё равно ожидается что после окончания обучения(для птушников) или после года-полутора работы(для молодых) они будут нормально работать.
                                      И таких тоже не то чтобы много приходит на собеседования.

                                      П.С. А вообще в Германии официально нехватка 50000+ it-специалистов. А реально…
                                        0

                                        А что у вас за ниша? Web, Mobile, Desktop, Embedded? Джуны сейчас все в веб лезут.

                                          0

                                          Web, Mobile, Desktop, Embedded. Всего понемножку:)

                                      0
                                      Ну вот я сейчас в Германии в городе-миллионике с наличием индустрии, хорошими зарплатами и своими университетами. Айтишников не хватает катастрофически. Причём всех: программистов, админов и даже тестеров.

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


                                      Если бы в IT-индустрии была бы действительная нехватка специалистов, то это нашло бы отражение в ценах на труд IT-шников — средние зарплаты в отрасли росли бы с опережающими темпами, и это единственный объективный показатель нехватки специалистов на рынке. Мы этого не наблюдаем. И это если речь о мидлах/сениорах, джуны же скоро вообще будут готовы работать за еду опыт.


                                      У нас на фирме постоянно открытые вакансии и так у большинства фирм в городе. С другой стороны я 3-4 раза в месяц получаю из различных источников «ненавязчивые предложения» сменить работу.

                                      А это связано не с нехваткой айтишников, а с их огромной текучкой (по сравнению с другими отраслями).

                                        0
                                        Если бы в IT-индустрии была бы действительная нехватка специалистов, то это нашло бы отражение в ценах на труд IT-шников — средние зарплаты в отрасли росли бы с опережающими темпами, и это единственный объективный показатель нехватки специалистов на рынке. Мы этого не наблюдаем

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

                                        И это если речь о мидлах/сениорах, джуны же скоро вообще будут готовы работать за еду опыт.

                                        Я не знаю о каких стране-городе говорите вы, но у нас даже azubis получают доплаты с которыми им вполне себе комфортно живётся.
                                          –1
                                          Зарплаты до бесконечности расти тоже не могут. Потому что с какого-то момента становятся экономически невыгодными

                                          Если рост зарплат экономически невыгоден, то значит рынок достиг равновесия. То есть, любая добавочная рабочая сила приведет к избытку на рынке труда и падению зарплат.


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

                                          Так в том и дело, что нет. Если вы посмотрите на темпы роста зарплат в ИТ сфере то там нету никакого опережения по сравнению с зп в других отраслях (речь о квалифицированных кадрах, конечно). А значит никакой нехватки (по сравнению с другими отраслями) нет.


                                          Я не знаю о каких стране-городе говорите вы, но у нас даже azubis получают доплаты с которыми им вполне себе комфортно живётся.

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

                                            0
                                            Извините, но «средняя температура по больнице» меня не особо интересует. Но даже если всё так как вы говорите и среднемировые зарплаты в айти-отрасли действительно не растут, то это может быть связано с кучей других причин. Например с тем что многие страны третьего мира в последнее время начали усиленно развивать у себя айти-индустрию. И таким образом они во первых демпингуют цены, а во вторых уменьшают средние значения за счёт увеличения количества низкооплачиваемых айтишников. Но это не означает что одновременно не могут расти средние зарплаты айтишников в других отдельно взятых странах.

                                            И в Германии айтишников не хватает. Как скорее всего и в большинстве индустриально развитых стран. Во всяком случае меня бы сильно удивило если бы это было не так.

                                            Ну и насчёт требований к джунам и их зарплатам я тоже не особо согласен. Как минимум в плане Германии. Как там в других странах дела обстоят сказать не могу.

                                  +1
                                  по соотношению количества вакансий/резюме (каковое планомерно сдвигается в сторону резюме)

                                  Да это просто потому, что набежали "вайтишники". А на самом деле среди действительно квалифицированных специалистов — жуткий дефицит.

                                    0
                                    Ссылки на статистику — это ОК. Уточните, вы про какие страны говорите, про все IT вообще, включая «операторов ЭВМ» или про какие-то конкретные специальности? И можете продемонстрировать эту самую статистику?
                                    Просто наблюдаемая вокруг меня действительность ровно обратная, в моей области и всех смежных зарплаты растут хорошо, даже отлично, спрос сильно опережает предложение.

                                    Вы вроде упомянули «про мир». Ну я разработчик на golang — и следуя статистике stackoverflow это один из наиболее высокооплачиваемых языков. Прирост зарплат с 2005 года был с 0 до 110K USD по медиане.
                                  +2
                                  А вот у меня почему-то совсем другое восприятие. На мой взгляд как-раз таки айтишников очень сильно не хватает.
                                    0
                                    На мой взгляд как-раз таки айтишников очень сильно не хватает.

                                    По сравнению с кем? Хотите сказать, что найти хорошего айтишника проще, чем хорошего экономиста? Менеджера? Слесаря?

                                      0
                                      Хорошего айтишника? У нас ситуация такая что вообще никакого айтишника не найти. Мы уже готовы даже сами обучать.

                                      А экономисты у нас наоборот в очередь выстроились и ждут когда места освободятся. С менеджерами тоже проблем нет. Насчёт слесаря не знаю, не особо в теме. Но судя потому что зарплаты у них заметно ниже чем у айтишников и «плюшек» им никто не предлагает, то наверное с ними тоже не так всё плохо.
                                      Но да, я сейчас не в России работаю.
                                        0
                                        :) Возьмите, уже не плохо обучен, готов учиться дальше и стремиться к большему:)
                                          0
                                          А верстаете тоже с синтаксическими ошибками в словах? :P
                                            0

                                            Я развиваю в себе навыки правильного и безошибочного написания) но все сразу!

                                              0

                                              Вы же не просто так сказали, то может где-то подробней обсудим? Вдруг я вас заинтересую)

                                    +1

                                    А если за тестовое заплатить? :)

                                    0
                                    Хорошее собеседование как по мне — должно напоминать экзамен: «билет это только повод начать разговор»… =)
                                      +1

                                      А что делать, если я пишу код лучше чем говорю? Вот этот вопрос


                                      Как применяются скругленные углы для элементов и стили для текста(шрифт, тип шрифта, цветащте и тд)?
                                      Единственное, что я смогу ответить, это
                                      • А что конкретно вас интересует?

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

                                        +1
                                        Умение говорить — одно из самых необходимых качеств для разработчика. С помощью коммуникативных навыков многие проблемы решаются намного быстрее, а некоторые мгновенно.
                                          +2

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

                                            0

                                            О, это я! Не знаю, в негативном или позитивном ключе вы рассуждаете, но


                                            Пока собеседовался на разработчика, жутко угнетало.
                                            Причем на большинстве собеседований все равно сносил крышу и получал оффер.


                                            Если начинались тестовые задания… Пустота, в голове ни одной мысли.
                                            Пару раз попадал так, что тестовые задания были, но и принимающие были адекватны и позволяли описать алгоритм в процессе разговора — все сразу становилось на свои места.
                                            (в большинстве случаев это скорее Ад "нет, вам нельзя гуглить")


                                            Не знаю почему так. В разговорах — камень, ни испуга, ни волнения.
                                            А пишешь код и даже если у себя на ноутбуке, будто он не свой, а только украл у рекрутера и только думаешь, как свалить пока не заметили. Простейшие термины и приемы, скажем — рекурсия становятся нерешаемыми.


                                            Так и не справился с проблемой, слишком большой стресс оставался после провалов, в итоге немного сменил должность и в принципе, она мне подходит больше. Но осадок остался.

                                      +8
                                      Тестовые задания на пару суток могут расцениваться многими кандидатами как попытка реализовать что-то за бесплатно силами соискателя с последующим «извините, вы нам не подходите».
                                        0
                                        Таких контор полно, а нарисуйте логотип или интерфейс / кнопочки / панельки — а потом какие деньги?
                                        +1
                                        Ну давайте уже давать людям нормальные тестовые задания на пару суток

                                        Ну вот допустим, пригласили меня на 5 собеседований — на каждом дали по заданию на двое суток. Две недели сидеть все делать, только чтобы получить шанс устроиться в одну из компаний?

                                        По-моему как раз таки гораздо удобнее прийти на собеседование — и там на месте все решить, чем брать «домашнее задание»

                                        По своему опыту — когда дают тестовое задание — в 90% случаев просто забиваю на него и продолжаю собеседоваться в других компаниях.

                                          –1

                                          Компания, которой вы неинтересны, не даст вам тестовое задание. Максимум — "мы вам перезвоним". Для компаний, которые вам неинтересны, по результатам собеседования, вы не будете выполнять тестовые задания. Полный паритет и "благорастворение воздухов".
                                          Первое собеседование не должно быть экзаменом. Оно должно быть соглашением о намерениях. Впрочем, это всего лишь мое IMHO.

                                            0
                                            Полный паритет и «благорастворение воздухов».

                                            Не исключаю, что такое случается, но например мой опыт, когда я год назад искал работу — я прошел 8-10 собеседований. Где-то половина компаний была мне не интересна. Т.е. по итогу у меня на руках было 4 джоб офера, из которых было достаточно трудно выбрать т.к. даже после нескольких собеседований и кучи разговоров по скайпу трудно понять какая компания лучше (а предложения у всех ± одинаковые)

                                            Ни в одной из компаний, кроме Яндекса, тестовое задание мне не давали. Все определялось как-раз решением простых задачек на знание языка (без всяких сортировок) и разговорами с тех лидами.
                                            В Яндексе задание было буквально на пару часов и сама задача была очень простой, думаю смотрели скорее качество кода, напишу ли тесты и т.п. (если что, тестовое задание я прошел, но потом меня все-равно туда не взяли :) )

                                            ПС
                                            У меня тоже основной ЯП — JavaScript
                                            Задача с собеседования, которая больше всего мне запомнилась — попросили написать свою реализацию полифила функции `bind`
                                            Это, на мой взгляд, сразу проверяет знание многих аспектов языка.
                                            А такие вещи как умение пользоваться гитом, фрэймворком и т.п. довольно легко проверяются просто в диалоге.
                                        +1

                                        Кто сказал, что из js нельзя менять значения before и after?
                                        Для задач, выходящих за пределы возможностей инлайна, существует document.styleSheets

                                          0
                                          Можно даже просто создать тег style, записать туда всё, что надо, и вставить на страницу. А там вполне можно перекрыть before/after.
                                            0
                                            А не расскажите подробнее, как из атрибута style добраться до before/after? Или ссылку на почитать? Была бы очень благодарна, а то хоть и верстаю много, но не знаю как такое реализовать
                                              0
                                              codepen.io/alexiset/pen/LmQJbj так? Если я правильно поняла вопрос.
                                                0
                                                Спасибо, примерно таким подходом как вы показали я и пользуюсь.
                                                Но @Keten пишет о другом (я очень вдумчиво перечитала комментарий и поняла предлагаемый способ)
                                                Предлагается в скрипте создать тег с нужными стилями и встроить его на страницу (при не вдумчивом прочтении, я упустила, что речь идет о теге, а не об атрибуте)
                                                  0
                                                  Все равно, приведенный мной способ, можно назвать с большой натяжкой управлением псевдоэлементами js-м. Скорее финт ушами.
                                                    0
                                                    Йеп.
                                            +1
                                            46. Что будет если задать margin: -10px; -> Сдвинется вверх и влево на своих соседей

                                            Не факт. Зависит от того, какое значение display. Инлайновые элементы таки могут не поехать вверх.

                                            48. Моему коллеге на должность php-разраба, предложили такую
                                            Есть два блока, второй скрытый, если в первом нет дочерних элементов, то показать второй.

                                            Скрипты? А может быть...
                                            .b {
                                                display: none;
                                            }
                                            
                                            .a:empty + .b {
                                                display: block;
                                            }

                                              0
                                              Не факт. Зависит от того, какое значение display.

                                              Да, здесь я виновата, не корректно пересказала. Там речь шла о div с позиционированием static

                                              Скрипты? А может быть...

                                              С его слов надо было с использованием нативного js.
                                                +1
                                                27. ...overflow: hidden — полностью скрывает элемент, он не видим и не занимает место на странице. javascript не может получить ни width, height.

                                                Тут тоже что-то недосказано? Просто так от добавления overflow: hidden элемент никуда не исчезнет.
                                                  +1
                                                  никогда не делай на js то, что можно сделать на css
                                                  +1
                                                  Тоже подумал про вариант с псевдоселектором :empty первым делом, жаль только он не сработает если есть хотя бы пробел или перенос строки в тэге
                                                    0
                                                    в задаче стоит условие «нет потомков», при пробеле или переносе строки в потомках окажется текстовая нода
                                                  +1
                                                  Вопросы конечено интересные, если просто, чтобы подумать под настроение. Но такие интервью конкретно уже надоели.
                                                  Вариант с
                                                  function getStr() {
                                                  	return [].slice.call(arguments, 1).join(arguments[0])
                                                  }

                                                  красивый, безусловно, но что это говорит о кандидате, если он это решение выдал с пол-пинка или наоборот решил «в лоб»?
                                                    0
                                                    красивый, безусловно, но что это говорит о кандидате

                                                    Наверно по принципу: «Если решил такое, то и с другим справится». Вообще, я скучаю по тем временам, когда вопросы были типа: «Чем function Declaration отличается от Expression».
                                                      0
                                                      Ну если работодатель готов отсеивать много кандидатов, которые хорошо бы справлялись с реальной работой и брать по принципу если уж это смог — это его личное дело.
                                                        +1
                                                        Ну если работодатель готов отсеивать

                                                        Я тоже считаю, что такой тип вопросов не показатель. Как-то меня попросили набрать вопросов для собеса кандидатов в один проект mail. Я с энтузиазмом предложила те, что у меня были из яндекса + ряд в том же духе, для подготовки к нему. Но тим лид отверг этот принцип(просто в яндексе любят вопросы про сортировки, очереди, деревья и другие достаточно специфичные, не часто используемые на практике вещи)
                                                          +2
                                                          Такие вещи легко гуглятся, при возникновении необходимости.
                                                          Если такие штуки стоит давать на интервью, то наверное лучше в виде задач, чтобы за компом и не стояли над душой.
                                                          Тогда это приближённо к реальной работе и можно увидеть как человек справляется с такими вещами по мере необходимости.

                                                          Я вот не помню даже по названиям все общеизвестные алгоритмы сортировки, кроме пузырька самого, который на слуху. И если надо будет в реальной жизни использовать сортировку вместо Array.sort() я полезу гуглить естественно и найду, и сделаю. Но навскидку не помню и не понимаю зачем это помнить.
                                                      +1
                                                      function getStr(separator, ...args) { 
                                                          return args.join(separator);
                                                      }
                                                      
                                                        –1
                                                        Тогда уже так:
                                                        const getStr = (separator, ...args) => args.join(separator)
                                                        
                                                          +2
                                                          Как вариант, но я сознательно не стал использовать стрелочную функцию, т.к. у неё нет имени. Это плохо сказывается на стектрейсах.
                                                          Считаю, что стрелочные функции надо использовать только тогда, когда они создаются и используются в одном и том же месте. Хотя это достаточно спорное мнение.
                                                            +2
                                                            Вроде уже браузеры научились выводить имя переменной:
                                                            0
                                                            Рискну огрести ещё минусов, но если того, кто поставил минус не затруднит объяснить свою позицию — буду благодарен…
                                                              0
                                                              1 минус — не обращайте внимания. Кто-то даже промахнуться случайно мог
                                                                0
                                                                Насчёт промахнуться не подумал. Просто так интересно стало «аж кюшать не могу».
                                                        +3
                                                        Извините, если я неправильно понял, но мне кажется в 13 происходит что-то странное. Я плохо знаю JS, но, кажется, вы считаете сумму кодов символов для каждого слова? Если так, то это неверный подход. Кроме того, выглядит так, что для (arr.length-2) слов вы считаете эту сумму дважды.
                                                          +5

                                                          Есть несколько неверных ответов, к примеру
                                                          12 Колбек функции sort должен возвращать число, а не булево значение, это важно. Контр-пример:


                                                          [8,4,9,7,6,5,4,3,2,1,0].sort((a,b) => a > b); // [5,0,1,2,3,4,4,6,7,8,9] (в хроме)

                                                          13 Сумма кодов символов не сработает, пример


                                                          sameWords(['lnt', 'tok', 'okt']) // true

                                                          примитивное решение с сортировкой
                                                          function sameWords(arr) {
                                                              var firstSorted = arr[0].split('').sort().join('');
                                                          
                                                              for (var i = 1; i < arr.length; i++) {
                                                                  var sorted = arr[i].split('').sort().join('');
                                                                  if (firstSorted !== sorted) return false;
                                                              }
                                                          
                                                              return true;
                                                          }

                                                          38 Вариант с eval не сработает вот тут: {{}}

                                                            0

                                                            И сортировка провалится на


                                                            sameWords(['tokkkkkk', 'okttttttttttt'])

                                                            В нормальных языках это решается через структуру данных множество, или ее костыльную эмуляцию через мап или хэшмап. В js же сейчас по слухам тянут все на свете, "да косу еще впридачу, да лопату с мясорубкой" (С) А множества до сих пор не притянули?

                                                              0
                                                              И сортировка провалится на

                                                              Это ваши домыслы. Исходя из первоначальных условий задачи, вариант с сортировкой — один из простых, что приходит в голову, лаконичных и решающих задачу. Желание все усложнять на ровном месте — не есть хорошо. Особенно на интервью. Рискуете потратить время, не успеть решить нужную задачу в попытках порешать не ту, которую требовалось. В реальной жизни все ровно также.

                                                              Если интервьювер попросит или кандидат попросит уточнений, то можно порешать и второй вариант.

                                                              В нормальных языках это решается через структуру данных множество

                                                              После этих слов видно, что с JS вы далеко на «Вы». В чем смысл было комментировать, если с языком плохо знакомы?
                                                              Вот новомодный вариант: [...(new Set('okttttttttttt'.split('')))].sort()
                                                              Вот old school: h = {}; 'okttttttttttt'.split('').forEach(function(x) { return h[x] = 1; }); Object.keys(h).sort()
                                                              И это далеко не все варианты как убрать дубликаты, но с фокусом на использованием «структуры данных множество».
                                                                +1
                                                                После этих слов видно, что с JS вы далеко на «Вы». В чем смысл было комментировать, если с языком плохо знакомы?

                                                                Да, на Вы. Но все представленные задачки делятся условно на 2 класса — JS-специфичные и общеалгоритмические, допускающие решение на любом языке. Не вижу причин не комментировать вторые, даже если с языком на Вы. Особенно, если они в оригинале решены неправильно или неоптимально. Особенно, если я догадываюсь, что в JS все-таки есть множества, но о них никто не вспомнил при решении.

                                                                  0
                                                                  хилые там множества — я когда увидел в спецификации Set раскатал губу, решил, что будут всякие там пересечения, объединения и произведения множеств, а по факту сделали какую-то полумеру.
                                                                0

                                                                Формулировка задачи немного размыта, но судя по вот этим строчкам в решении это и требовалось


                                                                if (arr[i].length !== arr[i+1].length) {
                                                                        return false; 
                                                                0
                                                                Вариант 4 можно более лаконично описать)

                                                                function getStr(asterisk, ...rest) {
                                                                	return rest.join(asterisk);
                                                                }
                                                                
                                                                  +6
                                                                  if (...) { 
                                                                     return true;
                                                                  } else {
                                                                     return false;
                                                                  }

                                                                  Во мне каждый раз что-то умирает

                                                                    –4

                                                                    В таких случаях как минимум напрашивается тернарный оператор.

                                                                      +6
                                                                      Нет, в таких случаях напрашивается return и условие. Без лишних операторов.
                                                                      +1
                                                                      Это классика!
                                                                        –3
                                                                        if (...) { 
                                                                           return true + false == true;
                                                                        } else {
                                                                           return true + true == true;
                                                                        }
                                                                        +4
                                                                        Как вы бы сделали отказоустойчивый сайт?

                                                                        Ну вот и как на это отвечать? На ум приходит только что-то типа: «Я бы сначала хорошо всё обдумал, а потом закодил.»
                                                                          +1

                                                                          validBraces('(})') вернёт неправильный ответ

                                                                            0
                                                                            Да чего далеко ходить, достаточно просто '}' или ')'. Хотя там формулировка странная, так-то эти варианты подпадают под «все скобки закрыты».
                                                                            0
                                                                            const validBraces = (s) => {
                                                                              const z = s.replace('()','').replace('[]','').replace('{}','');
                                                                              return z==s ? z=='' : validBraces(z); 
                                                                            }
                                                                              +1
                                                                              Отлично, квадратичное время работы на пустом месте… А еще вы забыли что первый параметр replace — это регулярка, и скобки там надо экранировать. Вы свой код вообще проверяли?
                                                                                0
                                                                                Вы не правы: скобки, заключённые в кавычки, являются именно строкой, а не регулярным выражением, так что экранировать ничего не нужно.

                                                                                Однако, да, это не делает пример работоспособным, потому как в данном случае (указание строки, а не регулярного выражения в качестве аргумента) будет произведена только замена первого совпадения для каждого вида скобок.
                                                                                  0

                                                                                  Обожаю комментаторов с Хабра ) Я и не знал что принимает реплейс — поэтому просто посмотрел в документацию:


                                                                                  The replace() method searches a string for a specified value, or a regular expression, and returns a new string where the specified values are replaced.
                                                                                  Note: If you are replacing a value (and not a regular expression), only the first instance of the value will be replaced. To replace all occurrences of a specified value, use the global (g) modifier

                                                                                  А алгоритму фиолетово — онли ферст инстанс или все сразу. И да, я проверял свой код. А вы, похоже — нет. Просто сразу кинулись писать опровержение, не удосужившись проверить. Второй комментатор из той же серии ) Да, будет замена только первого совпадения. Да это делает алгоритм работоспособным, и это очевидно любому.


                                                                                  А про квадратичность — преждевременная оптимизация сами знаете что )

                                                                                    +1
                                                                                    Это хорошо что вы туда посмотрели. Потому что я просто знал что этот метод принимает — но знал неправильно. Самое смешное, что я ваш код запустил и увидел что он не работает, а теперь сижу и не могу вспомнить как же так хитро я его запускал :-)
                                                                                      0
                                                                                      То есть вы считаете, что функция, выполняющая по одной замене для каждого вида скобок, — самодостаточна?
                                                                                        0
                                                                                        Для примера пропустите эту строку: "({)}" — все скобки тут закрыты
                                                                                          0
                                                                                          Но они закрыты в неправильном порядке, так что правильной скобочной последовательностью ваш пример не является.
                                                                                            0
                                                                                            Тут вопрос в ТЗ.
                                                                                            С одной стороны о правильности порядка в ТЗ разговора не было.
                                                                                            А с другой стороны в данном примере:
                                                                                            "(qwerty)"

                                                                                            скобки закрыты, но функция работать не будет.

                                                                                            Поэтому я и не считаю ваш вариант действительно рабочим, однако признаю, что на собеседовании он прокатил бы и выглядел, как минимум, интересней варианта топикстартера)
                                                                                          0
                                                                                          выполняющая по одной замене для каждого вида скобок

                                                                                          Там не одна замена, она повторяется, пока не останется ничего, что можно заменить
                                                                                            0
                                                                                            То что там рекурсия — это видно. Я говорил о другом — выше примеры)
                                                                                              +1

                                                                                              Вы демонстрировали полное невежество и непонимание (у Хабра все посты записаны), неоднократно садясь в лужу, а сейчас пытаетесь "сохранить лицо", хотя уже давно всем все понятно ) Можете минусовать, ибо похвалы от вас я бы стыдился )


                                                                                              ЗЫ про кота с буквами — ну децкий сат же.


                                                                                              const validBraces = (s) => {
                                                                                                const go = (s) => {
                                                                                                  const z = s.replace('()','').replace('[]','').replace('{}','');
                                                                                                  return z==s ? z=='' : go(z);
                                                                                                  }
                                                                                                return go(s.replace(/[a-zA-Z0-9éèêëùüàâöïç \n\r]/g,''));
                                                                                              }
                                                                                                +1
                                                                                                За что минусовать? У вас есть мнение — я за вас рад, вполне)

                                                                                                Я правда не понял, когда это я неоднократно садился в лужу, если это первый пост в котором я отметился в комментах (у Хабра все посты записаны).
                                                                                                Да и конфликт только в треде с вами обнаружился.
                                                                                                Вы как-то близко всё к сердцу принимаете. Я написал комментарий, в котором защитил ваш код (в вопросе о регулярном выражении и стрингах) и позволил себе заметить, что функция всё равно неработоспособна, что позже оправдал глупостью самого ТЗ.

                                                                                                Где вы нашли невежество и непонимание? Почему похвала от меня — это стыдно? ХЗ)
                                                                                                Ну да и ладно, не обижайтесь)
                                                                                                  0

                                                                                                  А теперь исправьте алгоритм для общего случая :)


                                                                                                  validBraces("[안{녕(하(세(요)!)~)~}~]")
                                                                                                    0
                                                                                                    Можно ведь удалять все, кроме кавычек. Или сперва найти только кавычка и потом работать с ними:

                                                                                                    var getBraces = str => str.match(/[\[\]{}()]/g, '').join('')
                                                                                                    
                                                                                                    getBraces("[안{녕(하(세(요)!)~)~}~]");
                                                                                                    
                                                                                                    // =>
                                                                                                    
                                                                                                    [{((()))}]


                                                                                        0
                                                                                        s.replace('()','').replace('[]','').replace('{}','');
                                                                                        Интересный подход. А сможете адаптировать, чтобы при наличии других валидных символов не ломалось?

                                                                                        validBraces('{ab(cd)ef}'); // true
                                                                                          0

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

                                                                                          0

                                                                                          Дело в том, что вы просто не знали, что я на этой задачке пол-собаки съел в свое время ))) Вот например еще один выставочный специально селекцированный кот для нее — для эстетов:


                                                                                          const validBraces = (s) => {
                                                                                            var it = s[Symbol.iterator]();
                                                                                          
                                                                                            const f = (i, a) => {
                                                                                              const b = it.next().value; 
                                                                                              return !b ? i==0
                                                                                                     : '([{'.includes(b) ? f(i+1, b) && f(i, a)
                                                                                                     : ['()','[]','{}'].includes(a+b);     
                                                                                            }
                                                                                            return f (0, ' ');
                                                                                          }
                                                                                          +1

                                                                                          ЗЫ я не собеседую программистов (собеседовал лет 15 назад), но такой кот


                                                                                          var sum = 0;
                                                                                          
                                                                                          function getSum(obj) {
                                                                                              sum += obj.valueNode;
                                                                                              if (obj.next != null) {
                                                                                                  for (var i = 0; i < obj.next.length; i++) {
                                                                                                      getSum(obj.next[i]);
                                                                                                  }
                                                                                              }
                                                                                          
                                                                                              return sum;
                                                                                          }

                                                                                          скорее сработал бы в минус кандидату, чем в плюс. Не говоря уже про ипические "иф тру ретурн тру элсе ретурн фалс", по которым уже проехались выше.

                                                                                            0
                                                                                            а не могли бы вы рассказать, что конкретно тут плохо?
                                                                                              0
                                                                                              Как минимум, неоправданное использование глобальной переменной.
                                                                                                +3

                                                                                                Глобальная переменная, мутабельность, вызов функции как процедуры. И самое главное — это банальнейшая задачка на свертку, а решение показывает неумение автора кота решать даже простейшие задачи через чистые функции без побочных эффектов. Значит во всех подобных задачах будут возникать эти сложности и костыли в решении.

                                                                                                  0
                                                                                                  Можно правильный вариант кода?
                                                                                                    +3
                                                                                                    Хотя-бы так (чистая функция без побочных эффектов):
                                                                                                    function getSum(obj) {
                                                                                                       if (obj.next == null) return obj.valueNode;
                                                                                                    	
                                                                                                       var sum = obj.valueNode;
                                                                                                    	
                                                                                                       for (var i = 0; i < obj.next.length; i++) {
                                                                                                          sum += getSum(obj.next[i]);
                                                                                                       }
                                                                                                    
                                                                                                       return sum;
                                                                                                    }


                                                                                                    Можно в более ФП-стиле:

                                                                                                    const add = (a, b) => a + b;
                                                                                                    
                                                                                                    function getSum(obj) {
                                                                                                       const childrenValue = (obj.next || [])
                                                                                                          .map(getSum)
                                                                                                          .reduce(add);
                                                                                                    	
                                                                                                       return obj.valueNode + childrenValue;
                                                                                                    }
                                                                                                      +1
                                                                                                      для ФП стиля, нужно в reduce вторым аргументом передать 0, иначе на пустом массиве будет ошибка
                                                                                                        0
                                                                                                        Вы правы, спасибо
                                                                                              0
                                                                                              before / after да запросто
                                                                                              jsfiddle.net/Lv92r008
                                                                                                –1
                                                                                                Я ни разу не программист, но если бы был:
                                                                                                "… попап по центру…… что бы он прокручивался вместе со страницей..."
                                                                                                Если бы мне такое задание предложили я бы спросил серьёзно ли они собираются предлагать подобные задания или это исключительно для проверки знаний и если ответ был бы не в пользу знаний я бы молча встал и ушел.
                                                                                                *негодование*: Они бы ещё Infinite Scroll предложили продемонстрировать, и кнопку «Наверх» расположенную там куда обычно люди уводят мышку чтобы курсор не отвлекал.

                                                                                                Народ подскажите браузер который может такие попапы не скрывать, но делать не мешающими. Никогда не понимал логику производителей браузеров. Придумали стандарт который позволяет открывать новые окна — реализовали, народу не понравилась вечно лезящяя реклама — придумали предупреждение о всплывающих окнах (которое по умолчанию не работает если пользователь совершил клик). И как бы функция осталась и в тоже время не мешает (почти). Почему не реализовать подобное с попапами? Если браузер в котором можно было бы просто выключать определённые js возможности?
                                                                                                  0
                                                                                                  Попап — это не js возможность, это css возможность.
                                                                                                    +2

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

                                                                                                    0
                                                                                                    по спеке html5 таймаут не будет ниже 4 ms, но да, тут многое зависит от конкретной реализации
                                                                                                    www.w3.org/TR/2011/WD-html5-20110525/timers.html
                                                                                                      0
                                                                                                      Меня тут недавно поймали на переменной в замыкании — codepen.io/Fen1kz/pen/KRvNYP

                                                                                                      И ещё на утечке памяти при обработке асинхронных месседжей с вебсокетов. Так что я бы ещё в статью добавил какую-нибудь хитропридуманную задачу про утечки памяти.
                                                                                                        +1
                                                                                                        Ваш случай лечится элементарной заменой
                                                                                                        for (var i = 1; i <= 3; ++i)

                                                                                                        на
                                                                                                        for (let i = 1; i <= 3; ++i)
                                                                                                          0
                                                                                                          > лечится

                                                                                                          Так это не баг, это задачка на собеседовании =/

                                                                                                          И по-хорошему лечиться не должно даже с let, это просто транспиляторы делают

                                                                                                          var _loop = function _loop(i) {
                                                                                                            document.getElementById('lol' + i).onclick = function () {
                                                                                                              return alert(i);
                                                                                                            };
                                                                                                          };
                                                                                                          
                                                                                                          for (var i = 1; i <= 3; ++i) {
                                                                                                            _loop(i);
                                                                                                          }
                                                                                                            +1
                                                                                                            Не обязательно транспиляторы. Современные браузеры тоже let понимают.
                                                                                                              –1
                                                                                                              2018 год на дворе, все браузеры уже научились в let и const
                                                                                                                0
                                                                                                                Не все… Opera Mini все еще популярна
                                                                                                                  0
                                                                                                                  Ну в рунете у неё уже меньше процента, всё ж не популярна уже, так что можно смело заявлять, что все умеют)
                                                                                                                  –1
                                                                                                                  понабежало умников с 2018 года, все умеют в let и const, а вот объяснить что let в цикле в отличие от var создает новый лексический блок все так же не могут. Линка для тех кому интересно почему let работает, а var нет
                                                                                                                    0
                                                                                                                    Почему вы считаете что «умники с 2018 года» не могут объяснить что let создает новый лексический блок?
                                                                                                                      0
                                                                                                                      Потому что вы этого не сделали
                                                                                                                        0
                                                                                                                        А меня просили?
                                                                                                                          –2
                                                                                                                          А почему вы спrашиваете?
                                                                                                                      0
                                                                                                                      а вот объяснить что let в цикле в отличие от var создает новый лексический блок все так же не могут
                                                                                                                      Ну, допустим, не могут. И что?
                                                                                                                        +1
                                                                                                                        Казалось бы, причём здесь мы, если за развитием языка последние три года не следили именно вы)
                                                                                                                –1
                                                                                                                9. ресет стилей делается не для того что бы не делать каждый раз, а потому что в разных браузерах значения по умолчанию разные, раньше с этим была вообще беда.
                                                                                                                38. Совсем велосипед, зачем перебирать все? Зачем считать совпадения? Все проще же:
                                                                                                                function validBraces(str) {
                                                                                                                	var st = [];
                                                                                                                	return str.split('').every(function(br){
                                                                                                                		var idx = '[{(]})'.indexOf(br);
                                                                                                                		if(idx < 3){
                                                                                                                			st.push(idx + 3);
                                                                                                                			return true
                                                                                                                		}
                                                                                                                		return st.pop() == idx;
                                                                                                                	}) && st.length == 0;
                                                                                                                }

                                                                                                                49. Забудьте про eval, вообще. Это дорого, и не хилый шанс выстрелить себе в ногу.
                                                                                                                  0

                                                                                                                  По поводу 38. Код из статьи корявый, но по виду, а не по сути. По сравнению с вашим, обладает двумя преимуществами.


                                                                                                                  Во-первых он не создаёт дополнительного массива. Это мелкая придирка, но чем длинее строка, тем непрятнее этот дополнительный массив.


                                                                                                                  Во-вторых, ваш код использует every там, где его семантически быть не должно. every делает проверку для каждого элемента массива, но гарантий, что это будет делаться последовательно — строго говоря не даёт. Поэтому цикл тут уместнее, чем лямбда.

                                                                                                                    0

                                                                                                                    На самом деле стандартом предписан вполне конкретный алгоритм, и в нем every вызывается ровно 1 раз для каждого элемента до первого ложного значения.


                                                                                                                    Хотя я тоже считаю что цикл тут уместнее.

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

                                                                                                                      Во-вторых. every перебирает элементы именно последовательно от 0, и прекращается если результат для очередного элемента лож или достигнут конец. То есть «для каждого» только в худшем случае. Не измерял, и every действительно может оказаться хуже цикла, из за вызова коллбека в цикле, из за чего будет происходить дорогая смена контекста, но пример был направлен именно на то что не надо перебирать все, и такой код демонстрирует это лучше, правда только если вы знаете как работает every.
                                                                                                                        0

                                                                                                                        "Дополнительный массив" — это не st, а str.split('').

                                                                                                                          0
                                                                                                                          А, тут да, есть лишнее, согласен. У меня какая то своя не любовь в индексации строк как массивов именно в JS, наверное со времен когда с не латиницей было совсем туго, и длинна одной и той же строки в разных браузерах была разной, надо отучать себя.
                                                                                                                    +19
                                                                                                                    Чтобы провести собеседование с разработчиком, не надо его заваливать тонкостями и головоломками. Достаточно с ним поговорить на профессиональные темы минуть пять. Когда сам озадачен актуальными вопросами, коллега с большой вероятностью либо сам с ними уже когда-либо сталкивался, либо может прямо в беседе проконсультировать.

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

                                                                                                                    Пробелы в каких-то знаниях — не недостаток. Мы сейчас живем в условиях, когда то, что было еще полгода назад, — уже мало актуально. Для веба это особенно актуально — тут все меняется так серьезно, что все приходится изучать с нуля. И на готовых проектах. Ни разу в моем опыте не было такого, чтобы лично я что-то специально заучивал наизусть и требовал или ожидал заучивания от других. Абсолютно всегда приходилось быстро вникать в то, что видишь впервые в жизни. И нет времени на тонкости. Понимание тонкостей приходит с опытом. И чем больше кругозор и опыт разработчика, тем с большей правдой он, даже не зная новую для себя вещь, сможет быстро догадаться о потенциальных проблемах. Потому что все компьютерные технологие построены на примерно одинаковых вещах, где есть типовые недостатки и подводные камни.

                                                                                                                    И такой подход я получил от своих преподавателей еще советской школы. Специалист — это не тот кто все знает, а кто знает где найти справочник или того, у кого можно проконсультироваться. И эти мои преподаватели делали прорывы в технологиях и науке.

                                                                                                                    А то что я вижу сейчас в собеседованиях — это стыд и позор. Набирают, такое ощущение, — лишь кодировщиков, кто бы очень быстро кодировал все, что им прикажут сверху. Раньше такая профессия была — Оператор ЭВМ. Очень похоже.

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

                                                                                                                    Реальное обучение проходит напрямую в живом проекте, когда то что тебе нужо, находишь и применяешь. В этом деле через месяц уже станешь разбираться лучше абсолютного большинства тех, кто обучает на курсах. А если это станет твоей специализацией, так все тонкости раздобудешь и будешь в этих вопросах разбираться лучше чем большинство других программистов. Просто потому, что это тебе нужно и это твоя работа.

                                                                                                                    Если же ты уже опытный программист, все эти вопросы на собеседованиях раздражают. Если ваш собеседует живой человек, а не программа по отсеву программистов (бывает такая жесть — когда присылают ссылку на веб вопросник), он сразу оценивает тебя и переходит к твоему реальному уровню очень быстро. По крайней мере, у меня всегда было так. И меня брали с существенными пробелами в знаниях, потому что собеседующие были адекватными. Им нужен был не заучка и энциклопедист, а инженер.

                                                                                                                    Еще бывает такая вещь, как синдром вахтера. Когда HR работник лучше самого работодателя знает, кого надо нанять: высчитывает его психологическую карту, чуть ли не как на ТАРО строит твой почти гороскоп, загружая свою голову барахлом из псевдо-научных психологических верований. И занимается он такой фигней, искренне веря, что тем самым делает благое дело, не понимая, что его задача — поиск и первичный отсев тех, кто точно не подойдет. Не больше. Нормально собеседовать человека сможет прямой руководитель.

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

                                                                                                                    Лично мне коллеги-заучки не нужны.

                                                                                                                    Как быть, если вы заметили неадекватных собеседующих? Либо прямо про это им говорите либо молча уходите. Себе дороже терпеть этот бардак. Вам же с ними потом вместе работать. Но вы должны быть уверены в своих словах. Это не волшебная мантра, — вы должны готовы отстоять свои слова. Иначе не беритесь с кем-то спорить. Нет ничего смешнее человека, кто строит из себя крутого мачо, но на деле у него пшик. И не беритесь брать ответственность в тех вещах, где у вас немнного не хватает квалификации. Это ваша работа — уметь в условиях неизвестности решать трудные технические задачи. Мне такая тактика в свои годы позволила из только что окончившего ВУЗ птенца сразу перейти в разряд ключевых работников организации.

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

                                                                                                                    Не писал никогда на хабр, но последние перлы на хабре касаемо собеседований не оставили меня в стороне.
                                                                                                                      +2
                                                                                                                      Хотел написать подобное, но вы точно описали мои мысли, респект!

                                                                                                                      От себя ниже добавлю, что большинство вопросов, которые я прочитал в статье — никогда не понадобятся в реале на фронте. Больше 10 лет я работаю с JS. Когда вижу такие вопросы, задаю один вопрос — где у вас это применяется?

                                                                                                                      PS и еще, всегда умалял вопрос по поводу сортировки. Типа отсортируйте массив (конечно не используя sort) по каким-то критериям или алгоритмам. Ну серьезно, вы действительно на проектах не сортируете массивы с помощью sort? Если так, то это же глупо.
                                                                                                                        +1
                                                                                                                        Хотел написать подобное, но вы точно описали мои мысли, респект!

                                                                                                                        Не переживайте, "Достаточно с ним поговорить на профессиональные темы" пишут к каждой статье про собеседования.

                                                                                                                          +1
                                                                                                                          про сортировки, в большинстве случаев на вопрос о сортировке проходит: метод sort будет более читабельным и более быстрым, т.к. под капотом у него или qsort или ksort (в зависимости от движка)
                                                                                                                          однако, в бытность фрилансером-оутсорсером, собеседующие познакомили меня с сортировкой подсчетом, которая наиболее эффективна для больших массивов состоящих из небольшого набора возможных значений

                                                                                                                          к чему я это: если спрашивают какой-нибудь «пузырек» — это бред, но иногда у бизнеса могут быть специфические данные, задав вопрос про сортировку подсчетом и объяснив предпочитаемое решение, собеседующие заполнили мой пробел в знаниях критичный для предстоящей задачи
                                                                                                                          0
                                                                                                                          Еще бывает такая вещь, как синдром вахтера. Когда HR работник лучше самого работодателя знает, кого надо нанять: высчитывает его психологическую карту, чуть ли не как на ТАРО строит твой почти гороскоп, загружая свою голову барахлом из псевдо-научных психологических верований. И занимается он такой фигней, искренне веря, что тем самым делает благое дело, не понимая, что его задача — поиск и первичный отсев тех, кто точно не подойдет.

                                                                                                                          А статья-то тут как тут: https://habr.com/post/354696. Выбираем претендента по оформлению резюме)

                                                                                                                            0
                                                                                                                            Серьезная опечатка. Исправить в тексте не могу, нет полномочий. В конце следует читать так: И не беритесь бойтесь брать ответственность.
                                                                                                                            Дело в том, что всегда работаешь на свое развитие. Поэтому выход из своей зоны комфорта необходим. И это основное, что нужно в инженерных специальностях. Мы работаем с творчеством и неизвестностью. Здесь нужен результат.
                                                                                                                            +3

                                                                                                                            С каких это пор сумма арифметической прогрессии (задача 23) равна (n + 1) / (n / 2)?
                                                                                                                            Ну и как тут уже заметили, большинство примеров кода очень "не очень".

                                                                                                                              0
                                                                                                                              Забавная история с палиндромом, особенно если учитывать, что первый вариант не работает.
                                                                                                                              >> isPalindrom1(«12313331»)
                                                                                                                              << true
                                                                                                                              >> isPalindrom(«12313331»)
                                                                                                                              << false
                                                                                                                                +1
                                                                                                                                39. Напишите код, который при клике на любой div внутри root будет выводить в консоль его id.

                                                                                                                                <div id="root" style="background: red;">
                                                                                                                                    root
                                                                                                                                    <span id="id1" style="background: lightblue;">id1</span>
                                                                                                                                    <div id="id2" style="background: green;">
                                                                                                                                        id2
                                                                                                                                        <div id="id3" style="background: yellow;">id3</div>
                                                                                                                                    </div>
                                                                                                                                </div>



                                                                                                                                Ваша функция в ответе не совсем корректна.
                                                                                                                                1) при клике по span она так же вернет его ID.
                                                                                                                                2) клик по root — так же не должен отрабатывать так как он, согласно условию, не находится внутри самого себя
                                                                                                                                  0

                                                                                                                                  3) event.stopPropogation(); по условию делать не требовалось

                                                                                                                                  0
                                                                                                                                  Автору
                                                                                                                                  Не являюсь знатоком JavaScript, поэтому не берусь оценивать вопросы и ваши ответы. Но я здесь увидел ваше искреннее желание программировать, разбираться во всех тонкостях и учиться. Поэтому они зря вас не взяли — знание не предполагает желание учиться. Найдут себе всезнайку, будет он пальцы гнуть и никого не слушать.
                                                                                                                                    0
                                                                                                                                    В задаче 13 у вас неверное решение, попробуйте например на arr = ['kot', 'sol', 'okt']
                                                                                                                                      +1
                                                                                                                                      27. Чем opacity отличается от visible: hidden и что это такое, отличие от overflow: hidden?
                                                                                                                                      Ответ:
                                                                                                                                      overflow: hidden — полностью скрывает элемент, он не видим и не занимает место на странице. javascript не может получить ни width, height.

                                                                                                                                      Элемент со стилями visible: hidden так же занимает место, не видим. Но в отличие от элемента с opacity, js-события на нем не срабатывают.

                                                                                                                                      visible: hidden — нет такого свойства, есть visibility + дочернему можно дать visibility: visible и он станет видимым в скрытом родителе, с opacity такого не провернуть =)
                                                                                                                                      overflow: hidden — вообще из другой оперы. Обрезает контент, который вылазит за пределы блока + дополнительные скрытые эффекты типа «чистки» потока и др.
                                                                                                                                        0
                                                                                                                                        overflow: hidden — вообще из другой оперы
                                                                                                                                        Да, автор перепутал overflow: hidden и display: none
                                                                                                                                        0
                                                                                                                                        «Кем вы видите себя через 5 лет?»
                                                                                                                                        Когда-то меня бесил этот вопрос, но потом я нашёл на него ответ и хочу поделится.
                                                                                                                                        1. Если вас сейчас всё устраивает, вам нравится делать\работать то, что вы делаете\работаете (программировать, рисовать, играть на скрипке) и, в принципе, вы бы с радостью занимались этим до конца жизни (даже, возможно, после выхода на пенсию), то ответ на вопрос очевиден. Через 5 лет я хочу заниматься тем же самым и вижу себя в той же самой должности с теми же самыми обязанностями, что и сейчас, потому что я люблю то что я сейчас делаю.
                                                                                                                                        2. Моя зарплата сейчас X рублей, но я хочу 2X (3X… nX). Открываю hh, пишу свою настоящую должность, сортирую по зарплате и смотрю, ЧТО должен знать и уметь топ, который получает 2X\3X. Поэтому ответ будет такой: «Я сейчас умею рисовать карандашами, но я вижу что умение рисовать фломастерами оплачивается намного выше. Поэтому за эти 5 лет я хочу научится хорошо рисовать фломастерами, а потом перейти на эту должность.» Это называется карьерный рост.
                                                                                                                                        3. ЗП роли не играет, я устраиваюсь работать эникеем, но хочу быть директором завода: тут тоже, что и пункт 2. Открываем hh, смотрим что должен знать\уметь сотрудник в определённой должности и идём к этому.

                                                                                                                                        То есть вопрос то по сути простой: что вы хотите делать и кем хотите быть через какое то время. Пока никем не хотите? Хотите просто «закрепиться» после института? Так и надо отвечать: я хочу приобрести опыт, поработать в конторе, выполняя свои обязанности посмотрю что мне больше нравиться и буду развиваться (читать+учить+практика) в этом направлении.

                                                                                                                                        Опять же, если вы отвечаете что-то невнятное, то значит глобальной цели у вас нет и поэтому вы будете делать то что вам скажут. А как раз это и требуется, вы приняты ))
                                                                                                                                          0
                                                                                                                                          Задача 13 странно решена. Из того, что сумма совпадает, никак не следует, что слагаемые совпадают. 2 + 2 === 1 + 3

                                                                                                                                          Я бы как-то так написал:
                                                                                                                                          var arr = ['kot', 'tok', 'okt'],
                                                                                                                                          	arr1 = ['kot', 'tok', 'ott'];
                                                                                                                                          
                                                                                                                                          function sameWords(arr) {
                                                                                                                                            const [first, ...rest] = arr.map(word => [...word].sort().join(''))
                                                                                                                                            return rest.every(letters => letters === first)
                                                                                                                                          }
                                                                                                                                          
                                                                                                                                          console.log(sameWords(arr));
                                                                                                                                          console.log(sameWords(arr1));
                                                                                                                                          
                                                                                                                                            +1
                                                                                                                                            Давайте что-нибудь похардкорнее.

                                                                                                                                            22. Надо написать функцию, которая вернет «hello world», но при этом в теле функции нельзя использовать ни цифры, ни буквы, а циклы, массивы, объекты можно, но без цифр.

                                                                                                                                            А где хардкор?
                                                                                                                                            function f()
                                                                                                                                            {
                                                                                                                                              function hello_world(){}
                                                                                                                                              return hello_world.name.replace('_', ' ');
                                                                                                                                            }
                                                                                                                                            
                                                                                                                                              0
                                                                                                                                              А можно вообще еще круче (с помощью www.jsfuck.com) =)

                                                                                                                                              Длинный код
                                                                                                                                              function f() 
                                                                                                                                              {
                                                                                                                                               return [][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]][([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]]((!![]+[])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+!+[]]+(+[![]]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+!+[]]]+([][[]]+[])[+[]]+([][[]]+[])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(![]+[])[+!+[]]+(+(!+[]+!+[]+[+!+[]]+[+!+[]]))[(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(+![]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(+![]+[![]]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[!+[]+!+[]+[+[]]]](!+[]+!+[]+!+[]+[+!+[]])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]])()([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]][([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]]((!![]+[])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+!+[]]+(+[![]]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+!+[]]]+(!![]+[])[!+[]+!+[]+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(![]+[])[+!+[]]+(+(!+[]+!+[]+[+!+[]]+[+!+[]]))[(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(+![]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(+![]+[![]]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[!+[]+!+[]+[+[]]]](!+[]+!+[]+!+[]+[+!+[]])[+!+[]]+(!![]+[])[!+[]+!+[]+!+[]])()(([]+[])[([![]]+[][[]])[+!+[]+[+[]]]+(!![]+[])[+[]]+(![]+[])[+!+[]]+(![]+[])[!+[]+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(![]+[])[!+[]+!+[]+!+[]]]()[+[]])[+[]]+(!+[]+!+[]+!+[]+!+[]+[!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]+!+[]])+[])+(!![]+[])[!+[]+!+[]+!+[]]+(![]+[])[!+[]+!+[]]+(![]+[])[!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(+[![]]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+!+[]]]+(+(!+[]+!+[]+!+[]+[!+[]+!+[]]))[(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(+![]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([![]]+[][[]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(+![]+[![]]+([]+[])[([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+([][[]]+[])[+!+[]]+(![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[+!+[]]+([][[]]+[])[+[]]+([][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]])[!+[]+!+[]+[+[]]]](!+[]+!+[]+!+[]+[!+[]+!+[]+!+[]])+(!![]+[][(![]+[])[+[]]+([![]]+[][[]])[+!+[]+[+[]]]+(![]+[])[!+[]+!+[]]+(!![]+[])[+[]]+(!![]+[])[!+[]+!+[]+!+[]]+(!![]+[])[+!+[]]])[+!+[]+[+[]]]+(!![]+[])[+!+[]]+(![]+[])[!+[]+!+[]]+([][[]]+[])[!+[]+!+[]];
                                                                                                                                              }
                                                                                                                                              

                                                                                                                                                0
                                                                                                                                                или так
                                                                                                                                                function hello_world(){
                                                                                                                                                  return arguments.callee.name.replace('_', ' ');
                                                                                                                                                }
                                                                                                                                                0
                                                                                                                                                7. Вместить три блока 20X20px в ряд, в блок шириной 60px, при этом у блоков должны быть границы

                                                                                                                                                получается некорректный ответ поскольку используется outline, хотя можно использовать для вложенных блоков border + box-sizing: border-box
                                                                                                                                                  0
                                                                                                                                                  я думаю, что сейчас и флексы с бордером сработают. Увы, на этот вопрос на собесе я ответила с подсказками, там ждали именно использования outline.
                                                                                                                                                  0
                                                                                                                                                  Отличная статья!
                                                                                                                                                  Сборник задач 2018.
                                                                                                                                                    +1
                                                                                                                                                    Хорошо бы корректно формулировать вопросы.

                                                                                                                                                    «1. Есть некоторая строка (var str = 'fgfggg';), что будет, если мы возьмем str[0]?» — будет вычислено значение str[0].
                                                                                                                                                    «5. Дано дерево, надо найти сумму всех вершин.» — интересно, как можно складывать вершины? Например, в вершинах лежат функции.
                                                                                                                                                    «13. Есть несколько слов, определить состоят ли они из одних и тех же букв('кот', 'ток', 'окт')» — тоже кривая формулировка и неправильное решение 'ттт' и 'т' состоят из одних и тех же букв.
                                                                                                                                                    «21. Что будет выведено в консоль, как можно модифицировать пример что бы он возвращал правильный результат(назовите как можно больше способов)?» — что такое «правильный результа»? Почему текущий результат неправильныё неизвестно.
                                                                                                                                                    «22. Надо написать функцию, которая вернет «hello world», но при этом в теле функции нельзя использовать ни цифры, ни буквы, а циклы, массивы, объекты можно, но без цифр.» — решение полностью состоит из букв.

                                                                                                                                                    Ну и т.д.
                                                                                                                                                      0
                                                                                                                                                      Вы успешно прошли задание на выяснение дополнительных требований.
                                                                                                                                                      0
                                                                                                                                                      de
                                                                                                                                                        0
                                                                                                                                                        «35. Сортировка пузырьком.»
                                                                                                                                                        Зачем кто-то будет использовать пузырек неизвестно.
                                                                                                                                                          0
                                                                                                                                                          Про нее нужно знать только то, что она ненужна :)
                                                                                                                                                            +1
                                                                                                                                                            Не поверите, но есть ряд случаев, когда пузырёк более оптимален. Несмотря на квадратичную асимптотическую сложность, он имеет очень малый константный множитель, что может дать существенный выигрыш в быстродействии.

                                                                                                                                                            Пример 1: массив содержит малое (до 3..5..7) количество элементов. Используется например при медианной фильтрации каких-то входных данных. Если мы окном идём по входному потоку и выполняем медианную фильтрацию, то пузырёк будет эффективнее остальных методов до определённой критической длины, но и после неё он будет медленно уступать в производительности другим методам.
                                                                                                                                                            Пример 2: массив почти упорядочен или заведомо известно, что сортировка требует ограниченного количества проходов по массиву. Тут асимптотика вплоть до линейной будет.

                                                                                                                                                            Короче, надо будет как-нибудь побенчить и написать статью про преимущества пузырьковой сортировки.
                                                                                                                                                          0
                                                                                                                                                          Хорошая статья. Но разве не лучше указать в заголовке область?
                                                                                                                                                          скажем «Задачи с собеседований (web front-end)».

                                                                                                                                                          А то я уже приготовился читать TOP10-подборку маразматическо-смешных вопросов, которыми оные HR от излишнего рвения любят иногда грузить подателей резюме… а тут банальная js-ина)

                                                                                                                                                          — Кстати, про css-центрирование по горизонтали и вертикали разве ни разу не спросили?

                                                                                                                                                          А я бы спросил. Особенно после того, как полез я тут выяснять как это делать… и отгреб на 5 разных сайтах 25 разных вариантов, из которых у меня не получилось запустить ни один. Я не очень силен в css, да. А получилось, кстати, запустить код из комментариев.

                                                                                                                                                          Вот вы бы как сделали центрирование в ячейке (div) который преобразует внутреннюю модель таблицы в визуальное представление? В свойствах ячейки таблицы (в модели) есть свойства valign и halign со значениями 'start', 'middle' и 'end'. Размеры содержимого ячейки и внешнее обрамление (за границами вашего div) могут быть любые. Надо что бы ваше позиционирование работало всегда.
                                                                                                                                                          +1
                                                                                                                                                          1. Вместить три блока 20X20px в ряд, в блок шириной 60px, при этом у блоков должны быть границы.

                                                                                                                                                          Краше будет, если юзать


                                                                                                                                                          box-sizing: border-box;

                                                                                                                                                          Что, в принципе, из коробки идет во многих фреймворках

                                                                                                                                                            0
                                                                                                                                                            Объясните, пожалуйста, человеку ещё не очень хорошо разбирающемуся в JS, почему [].slice.call(arguments, 1) работает? Я понимаю, почему нельзя arguments.slice(1) — arguments это не Array, а объект и у него нет метода slice. Но при вызове [].slice.call(arguments, 1) arguments будет this для функции slice, т.е., по смыслу будет идентичен вызову arguments.slice(1) — который невозможен ))
                                                                                                                                                            Я не очень понимаю этот механизм.
                                                                                                                                                              0

                                                                                                                                                              Представьте, что this — это аргумент функции. Тогда код слайс выглядит как-то так:


                                                                                                                                                              Array.prototype.slice = function (this, index ...) {
                                                                                                                                                                // this - это массив
                                                                                                                                                              }

                                                                                                                                                              В прототипе массива эта функция есть, потому когда мы вызываем [].slice — функция берется из прототипа и аргумент подставляется языком автоматически.
                                                                                                                                                              arguments — странный объект и там нету этой функции в прототипе, но мы можем сказать JS-движку: "а подставь ка в эту функцию в качестве this что-то другое".
                                                                                                                                                              Именно это мы и делаем:


                                                                                                                                                              var sliceFn = Array.prototype.slice
                                                                                                                                                              sliceFn.call(arguments, index);
                                                                                                                                                              // теперь в качестве аргумента this в функции будет именно то, что нужно
                                                                                                                                                                0
                                                                                                                                                                Да, точно, надо воспринимать вызов array.slice(1) как вызов slice(array, 1), а не наоборот. Спасибо.