Ответы пользователя по тегу JavaScript
  • Лексическое окружение, контекст вызова. Почему это разные понятия?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Лекс. окружение – это переменные, которые определены и "видны" функции.
    Контекст – это this.
    function outer() {
      var a = 1; // переменная в лексическом окружении ф-ии inner()
                 // внутри inner() можно использовать значение a
      return function inner() {
        console.log("a == ", a, "this == ", this);
      }
    }
    
    var f1 = outer(); // f1 - функция
    f1(); // a == 1, this == window или self
    
    var f2 = f1.bind({title: "Ololo"}); // f2 - новая функция
    f2(); // a == 1, this.title == "Ololo"
    Ответ написан
    1 комментарий
  • Небольшой вопрос по javascript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    textareaContent и coursorPosition задаются однажды при выполнении скрипта. На тот момент, наверное, textarea пуста, курсор в ней не находится.
    Ответ написан
  • Почему [] < {} сравниваются как строки? А [] < 1 как числа?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Во втором случае потому, что один из аргументов имеет примитивный тип Number, объект приводится к нему же.

    В первом сравниваются два объекта. При попытке привести их к числу сначала вызывается метод valueOf(), который для обоих возвращает не примитив (тогда бы сравнивали эти примитивы) а this, себя же, объект. Поэтому во вторую очередь вызывается метод toString(), который возвращает примитивы: пустую строку для массива и "[object Object]" для объекта.

    Upd. вот статья, раскрывающая глубины: Преобразование типов в JavaScript

    отрывок
    В общих чертах алгоритм выглядит следующим образом:
    • Если входящее значение уже является примитивом, ничего не делать и просто вернуть его.
    • Вызвать input.toString(), если результат примитив — вернуть его.
    • Вызвать input.valueOf(), если результат примитив — вернуть его.
    • Если ни один из методов не вернул примитив — бросить ошибку TypeError.

    При численном преобразовании сначала вызывается метод valueOf(), а уже затем toString(). При строковом преобразовании наоборот — сначала происходит вызов toString(), а уже потом valueOf().

    Большинство встроенных типов не имеют метода valueOf или же имеют valueOf, который возвращает свой собственный объект this, который игнорируется, так как this не является примитивом. Вот почему численное и строковое преобразование в большинстве случаев работает одинаково — оба в конечном итоге вызывают метод toString().

     
    Мало инфы в MDN
    См. правила преобразования типов:
    Когда происходит преобразование типов (т.е в случаях использования нестрогого сравнения), JavaScript преобразует типы String, Number, Boolean и Object, следующим образом:

    • При сравнении числа (Number) и строки (String), JavaScript пытается преобразовать числовой литерал строки в число. Затем полученное число округляется до ближайшего возможного значения типа Number.
    • Если один из операндов является логическим (Boolean), то он преобразуется в значение типа (Number). Если значение логического операнда равняется истине (true), то значение этого операнда преобразуется в 1. Иначе - в 0 (ложь / false).
    • Если объект сравнивается с числом или строкой, JavaScript пытается получить значение по умолчанию для данного объекта. Полученное значение преобразуется в примитив, посредством методов valueOf() и toString(). Если преобразовать объект не удается, генерируется ошибка времени выполнения.
    • Обратите внимание на то, что объект преобразуется в примитив, если, и только если, второй операнд является примитивом. В ином случае, операнды сравниваются как объекты, соответственно, операция сравнения вернет истину в том случае, если внутренние ссылки обоих объектов ссылаются на один и тот же объект в памяти.



    Там же рассматривают особобый случай объекта строки new String('foo'); по сравнению с простой строкой.
    Ответ написан
    2 комментария
  • Как сделать чтоб при клик на кнопку, должен открывать свой блок(должно работать без id и тк)?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Лучше без отрыва от разметки прямо в html записать, какая кнопка чем рулит. Например, в data-атрибутах:


    Не рекомендуется использовать атрибут hidden для скрытия/отображения табов. Лучше для этого задействовать класс, который временно прячет элемент. Например, Bootstrap'овский .d-none
    Ответ написан
    Комментировать
  • Выбор варианта из условия, с двойной переменной?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Надо хранить где-то выбранные значения. Например, в объекте, назовём его «состояние» state. При изменении select'а записывать выбранное значение и смотреть, если уже выбраны оба, можно обновить сумму.
    Ответ написан
    3 комментария
  • Связный список (или нет), как правильно в этом случае?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Если я правильно понял задачу, нужно описывать ветвящийся сценарий выбора вариантов. И динамически рендерить следующий вопрос после сделанного выбора.

    Можно описать всё дерево структурой с множеством уровней вложенности. Или придумать подобие адресации и добавлять / извлекать очередной вопрос с вариантами по «адресу»; тогда список будет без вложенностей, плоский.

    Тут не предусмотрел повторные клики по более высоким элементам в иерархии. По хорошему, они должны удалять все нижестоящие выборки.
    фиддл
    Ответ написан
    Комментировать
  • Как трансформировать object Object?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    var object = [
      {0:{text: "Abbeville", value: "230"}},
      {1:{text: "Abernant", value: "231"}}
    ];
    
    const option = object.reduce((p,c) => {
      const e = Object.values(c)[0];
      p.push({text: e.text, value: parseInt(e.value)});
      return p;
    }, []);
    Ответ написан
    Комментировать
  • Обращение к элементу константы находясь внутри этой константы?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Создаётся объект без имени. У объекта есть свойство src и потом вы добавляете свойство srcAssets.

    В форме const X = {...} сначала правая часть – создаётся объект без имени с указанными свойствами; потом ссылка на этот объект записыватся в константу X. Поэтому в правой части рано использовать X – он ещё не определён.

    Хорошие и правильные варианты уже предложили в ответах. Ещё можно создать X с известными и независимыми свойствами, а позже задать ему ещё свойства:
    const PATHS = {
      src: 'src'
    };
    PATHS.srcAssets = PATHS.src + '/assets';


    Это никак не противоречит «константности».
    Ответ написан
    Комментировать
  • This в JavaScript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Полно видео, выбирайте
    Ответ написан
    Комментировать
  • Как сгенерировать ссылки в div?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Вторым параметром можно передать объект свойств-событий-методов:
    $("<a>", {
        href: "#",
        onclick: () => addPrice(ui.item.valueX),
        title: "add"
    }).prependTo( "#hintPrice" );
    Ответ написан
  • Как сделать плавное хаотичное движение блоков?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Ответ написан
    Комментировать
  • Какой использовать генератор случайных чисел?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Наверное, вам подойдёт шум Перлина.

    Например, josephg/noisejs. Функции возвращают в диапазоне -1..1. Одинаковые seed и x, y всегда вернут одинаковое значение.
    Ответ написан
    1 комментарий
  • Какие существуют стили написания кода и как выбрать свой?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Читайте чужой код. Работайте в команде над проектом.
    Стиль кода как язык общения – нужен, чтобы быть понятным и удобным в группе людей.

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

    в каких случаях использовать тернарные операторы

    Если общая длина получается короткой, умещается в одну строку, не требует вложенности. См. примеры.
    Ответ написан
    Комментировать
  • Не могу разобраться с конструкторами ООП. Почему они не работают?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    У driver нет метода autoInfo()
    В function driver() {...} отсутствует определение this.autoInfo.

    Учитесь смотреть в консоль браузера на ошибки JavaScript.
    Ответ написан
    1 комментарий
  • Получить адрес?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Для безопасности пользователей нет возможности получить title страницы на чужом сайте, если сайт явно не прописал такую возможность для вашего домена. Google не прописал, поэтому title вы не получите.

    Чтобы это таки сделать, вам надо на вашем сервере настроить проксирование запросов. Т.е. скрипт ваш будет образаться именно к вашему сайту, например: https://vash-site.com/proxy/google.com – а все запросы к /proxy/* будут проксироваться на указанный после слеша домен.

    А проверку, что там ввёл пользователь, сделайте на регулярных выражениях.
    Ответ написан
    Комментировать
  • Как поменять элементы в массиве?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    // меняет два элемента массива in-place
    function swap(arr, a, b) {
      arr[a] = arr.splice(b, 1, arr[a])[0];
    }
    
    const Twelve = [1, 2, 3, 4, 5, 6, 7, 8 ,9 ,10 ,11 ,12];
    swap( Twelve, 2, 5); // индексы считаются от 0
    swap( Twelve, 7, 11);
    swap( Twelve, 9, 4);
    
    Twelve //  [1,2,6,4,10,3,7,12,9,5,11,8]
    Ответ написан
    Комментировать
  • Как проверить массив отсортирован ли он?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Попытаться найти первый элемент, меньший предыдущего (если сортировка по возрастанию).

    spoiler
    function isAscending(arr) {
      if (arr.length < 2) return true;
      let prev = arr[0];
      for (let i = 1; i < arr.length; i++) {
        if (arr[i] < prev) return false;
        prev = arr[i];
      }
      return true;
    }
    
    isAscending([1,2,3,4,5]) // true
    isAscending([1,2,1,4,5]) // false
    Ответ написан
    Комментировать
  • Как сделать счетчик на JavaScript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Выводимое число – это число дней с определённой даты.

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

    Примерно так для 15-го января (месяцы от 0 считаются) 2016-го года:
    const n = Math.floor(((new Date()) - (new Date(2016, 0, 15))) / 864e5);
    document.querySelector('div.statistic-block h2').innerText = n;
    Ответ написан
    Комментировать
  • Как собрать буквы по порядку в слово?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    В коде страницы слово пусть будет массивом кодов его символов. Тогда останется собрать по клику:

    Или, может, удобнее, прямо в HTML разметке в data-атрибуте держать скрытое слово задом наперёд и по таймайту обновлять.
    Ответ написан
    3 комментария
  • Как отправить post/get запрос через несколько секунд после открытия страницы?

    sergiks
    @sergiks Куратор тега PHP
    ♬♬
    Примерно так:
    setTimeout(() => {
      const url = 'https://api.vk.com/method/users.get';
      const data = 'Y=YparameterValue&Z=ZparameterValue';
      const xhr = new XMLHttpRequest();
    
      xhr.open('POST', url, true);
      xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
      xhr.send(data);
    
    }, 5000);
    Ответ написан
    4 комментария