Задать вопрос
Ответы пользователя по тегу JavaScript
  • Как получить токен вк из строки iframe?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Никак, не поднявшись «над» браузером:
    • установленное в браузер расширение;
    • полностью подконтрольный безголовый браузер типа PhantomJS;
    • web view в вашем приложении
    Ответ написан
    2 комментария
  • Говнокод или нет?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Код г-но неидеален, и вот, почему:
    см. комменты в коде
    let a = prompt("Enter a value", 10); // a, b, c дальше не меняются
    let b = prompt("Enter b value", 10); // поэтому можно
    let c = prompt("Enter c value", 10);  // const
    let result;
    let discr = (b * b ) - 4 * a * c;
    let sqrtDiscr = Math.sqrt(discr); // при отрицат. discr здесь NaN
    if(a === 0 && b === 0 && c === 0) { // проверяем уже после вычислений
      throw new Error("The values must be bigger than 0");
    } else if(discr < 0 ){ // проверяем уже после вычисления sqrtDiscr
      throw new Error("This Equation have not solution");
    } else if(discr === 0 ){
      console.log("This Equation have only 1 solution")
      result = (-b) / (2 * a);
    } else if (discr > 0){
      console.log("This Equation have 2 solution");
      result = (- b + sqrtDiscr) / (2 * a) + ";     " + (- b - sqrtDiscr) / (2 * a);
    }
    
    console.log(result);


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

    Ещё вы не проверили случай, когда a === 0: у вас будет деление на ноль.
    Ответ написан
    2 комментария
  • Как составить все возможные комбинации?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Рекурсивный алгоритм:
    1. На первой позиции должна побывать каждая из букв.
    2. Выбрали первую – надо всеми возможными способами перебрать оставшиеся. Смотрим на задачу точно так же: из (n - 1) букв надо перебрать все варианты. Go to 1)
    мопед – мой
    function permut8(arr, prepend) {
      var i, version, el, result = [];
      prepend = prepend || [];
      if(arr.length === 1) return [arr];
      for( i=0; i<arr.length; i++) {
        if( arr.length === 2) {
          result.push( prepend.concat( [arr[i], arr[(i+1)%2]] ));
        } else {
          version = arr.slice();
          el = version.splice(i,1);
          result = result.concat( permut8( version, prepend.concat(el)));
        }
      }  
      return result;
    }
    
    var test = permut8( 'abcd'.split('') );
    test.map( e=>e.join(' ')).join("\n")
    /*
    a b c d
    a b d c
    a c b d
    a c d b
    a d b c
    a d c b
    b a c d
    b a d c
    b c a d
    b c d a
    b d a c
    b d c a
    c a b d
    c a d b
    c b a d
    c b d a
    c d a b
    c d b a
    d a b c
    d a c b
    d b a c
    d b c a
    d c a b
    d c b a
    */
    Его минус в том, что он не учитывает значения элементов. Если встретятся повторяющиеся – создадутся дублирующиеся варианты. Например, из ["a", "a"] получим два одинаковых [["a", "a"], ["a", "a"]]

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

    Использовал известный с 14 века нерекурсивный алгоритм индуса Нарайана Пандита. Из любого порядка в массиве генерится следующая итерация, учитывая лексикографический (по алфавиту) порядок сортировки.
    Мопед – мой, мыт
    function nextLexInPlace(arr){
      var i, a = -1, b = -1;
      for( i = 0; i < arr.length-1; i++) if(arr[i] < arr[1+i]) a = i;
      if( !~a) return; // no more permutations
      for( i = a + 1; i < arr.length; i++) if(arr[a] < arr[i]) b = i;
      swap(arr, a, b);
      a++;
      b = arr.length - 1;
      while( a < b) swap(arr, a++, b--);
      return true;
    }
    
    function swap( arr, a, b) {
      var xx = arr[a];
      arr[a] = arr[b];
      arr[b] = xx;
    }
    
    function allMutations( source) {
      var result = [], arr = source.slice();
      result.push( arr.sort().slice());
      while( nextLexInPlace(arr)) result.push(arr.slice());
      return result;
    }
    
    var test = ['a','c','c']; JSON.stringify( allMutations(test))
    // [["a","c","c"],["c","a","c"],["c","c","a"]]

    И тот же мопед, но
    с генератором
    function* permutator(arr) {
      var i, a, b;
    
      function swap( arr, a, b) {
    		var xx = arr[a];
    		arr[a] = arr[b];
    		arr[b] = xx;
    	}
      
      yield arr.slice();
    
      while(true) {
        a = -1, b = -1;
    		for( i = 0; i < arr.length-1; i++) if(arr[i] < arr[1+i]) a = i;
    		if( !~a) return;
    		for( i = a + 1; i < arr.length; i++) if(arr[a] < arr[i]) b = i;
    		swap(arr, a++, b);
    		b = arr.length - 1;
    		while( a < b) swap(arr, a++, b--);
    		yield arr.slice();
      }
    }
    
    function allMutations( source) {
      var all = [], result, G = permutator(source.slice().sort());
      while(true) {
        result = G.next();
        if(result.done) break;
        all.push( result.value);
      }
      return all;
    }
    
    var test = ['a','c','c']; JSON.stringify( allMutations(test))
    // [["a","c","c"],["c","a","c"],["c","c","a"]]
    Ответ написан
    Комментировать
  • Как реализовать Вращение объекта за хвостик Javascript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Math.atan2() возвращает угол в радианах. Их же можно потом использовать в transform: rotate( 123rad);

    Потом, не забывайте, что изначально ваш угол больше на 1/8 оборота, поэтому из полученного угла надо вычесть PI/4.

    Сделал по-своему пример.

    Хотел было добавить transition: transform 0.08 для плавности, но появляется проблема перескок при пересечении нуля. Когда угол вдруг меняется с минус-Пи на плюс-Пи, глупый transition проводит крутилку через полный оборот.
    Ответ написан
    5 комментариев
  • Как перебрать массив?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Сделать объект, где ключами будут эти значения id (при повторном назначении дубля не возникает).
    Потом забрать ключи (как строки) и отдать их как массив чисел.
    Object
      .keys(
        groups.reduce((p,c) => { c.items_ids.map(e => p[e] = e); return p; }, {})
      )
      .map(
        s => parseInt(s)
      )
    Ответ написан
    Комментировать
  • Как правильней сложить дробные числа?

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

    Второй вариант, если бОльшая точность не понадобится, можно считать всё в центах, оперируя целочисленной арифметикой. И при выводе, опять же, делить на 100 и toFixed(2)
    Ответ написан
    Комментировать
  • Как сделать зацикленную бегущую строку без пробела между началом и концом?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Плагин jQuery marquee (демо)
    Ответ написан
    Комментировать
  • Замена iframe на js?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Попробуйте сохранять вид сайта в картинку через PhantomJS – по ссылке пример, как сохранить главную страницу github в файл png.

    Нужно скачать PhantomJS, создать js-файл с 5 строчками из примера, и запустить из командной строки примерно так: phantomjs github.js

    PhantomJS – это не JS-библиотека, это Webkit браузер, управляемый через JavaScript API. Как заметил hOtRush Google также анонсировал «безголовую» версию своего браузерного движка Chromium, в связи с чем проект PhantomJS может потерять актуальность. Тем не менее, пока он вполне рабочий, и обновляется сообществом разработчиков (последний коммит на сегодня – двухмесячной давности, от 25 июня 2017).

    Вы можете установить PhantomJS на своем сервере и вызывать его через exec() из php-скрипта, принимающего URL сайта, который надо перевести в картинку. Это самый простой вариант. Минус – в том, что PhantomJS жрёт много памяти, и если несколько посетителей запросят одновременно несколько заданий, памяти на всех может не хватить. В таком случае организуйте асинхронную очередь задач. Поступающие запросы с URL ставьте в очередь, которая последовательно обрабатывается всего одним процессом phantomjs. По мере готовности, заказчики смогут забрать готовые картинки сайтов.
    Ответ написан
  • Можно ли написать код лаконичнее?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Переписать код короче – можно:
    $("a").click( function(e){ $(this).attr('href') || e.preventDefault() });


    Если поясните, чего добиваетесь таким кодом, можно предложить решение лучше.
    Ответ написан
    Комментировать
  • Каким образом свойство функции me i (me.i) получает доступ к значению цикла?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Этот вопрос и именно этот пример подробно разбирается на learn.javascript.ru в разделе Армия функций.

    Нажмите кнопку Решение там внизу.
    Ответ написан
    Комментировать
  • Заполнения массива на Javascript?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Можно просто перебирать по очереди все и проверять выполнение одного из условий:
    принадлежность диагонали, положение точно по середине оси X или Y:
    function makeStar(side) {
      var arr = new Array(side), x, y, mid = (side-1)/2;
      for( y = 0; y < side; y++) {
        row = arr[y] = new Array(side);
        for( x = 0; x < side; x++) {
          row[x] = (y===x || x===side-1-y || x===mid || y===mid) ? 1 : 0;
        }
      }
      return arr;
    }
    
    makeStar(4)
      .reduce((p,c)=>{ return p + c.join(',') + "\n"},'')
    
    /*
    1,0,0,1
    0,1,1,0
    0,1,1,0
    1,0,0,1
    */

    Наверняка, есть очень красивые решения этой же задачи (не искал). Можно использовать подобие – левая верхняя четверть равна нижней правой. Можно обыграть поворот вокруг центра.
    Ответ написан
    Комментировать
  • Как округлить число до сотых js?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Метод объекта Number .toFixed() округляет до заданного числа знаков после десятичной точки.

    var kof1 = <?php the_field('kof21'); ?>
      , kof2 = <?php the_field('kof22'); ?>
      , sum1 = <?php the_field('sum2'); ?>
      , total_Sum
    ;
       
    total_Sum = kof1 * kof2 * sum1
    
    document.body.appendChild( document.createTextNode( total_Sum.toFixed(2) );
    Ответ написан
    1 комментарий
  • Как отрисовать данные из одного массива по 6 строк в 3ех столбцах?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Остаток от деления порядкового номера элемента в массиве на число элементов в блоке принимает нулевое значение, когда пора создавать новый блок. А предыдущий готовый, если есть, вставлять в документ.

    var i
      , w
      , div
      , box
      , label
      , parent = document.body // к чему приклеивать блоки
      , perBlock = 5 // сколько в одном блоке
    ;
      
    for( i = 0; i < widgetSettings.length; i++) {
      w = widgetSettings[i];
    
      box = document.createElement('input');
      box.type = 'checkbox';
      box.id = box.name = w.id;
      box.value = w.value;
      
      label = document.createElement('label');
      label.appendChild(box);
      label.appendChild( document.createTextNode(w.text));
      
      if( i % perBlock === 0) {
        if(div) parent.appendChild(div);
        div = document.createElement('div');
      }
      div.appendChild(label);
    }
    if( (i-1) % perBlock) parent.appendChild(div);

    Fiddle
    Ответ написан
    Комментировать
  • Необычный hover эффект?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Событие mousemove или onEnterFrame(),
    пересчитать прозрачность каждой точки, как квадрат расстояния от позиции мыши.

    Сделал пример на canvas.
    upd. добавил инертности/плавности перехода цветов.
    Ответ написан
    3 комментария
  • Как можно получить массив дат от определенной даты?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Сделать объект даты на тот момент, и прибавлять по дню.

    var D = new Date("2017-08-27")
      , Till = new Date()
      , result = []
    ;
    
    function pad(s){ return ('00' + s).slice(-2)}
    
    while( D.getTime() < Till.getTime()) {
      result.push( '' + D.getFullYear() +'-'+ pad(D.getMonth()+1) +'-'+ pad(D.getDate()));
      D.setDate( D.getDate()+1);
    }
    //  2017-08-27,2017-08-28,2017-08-29,2017-08-30,2017-08-31
    Ответ написан
    Комментировать
  • Есть ли функция, которая сравнивает id и возвращает новый массив?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Fiddle
    function findDevice(id) {
      for( let i in devices) {
        if( devices.hasOwnProperty(i) && devices[i].id === id)
          return devices[i];
    	}
    }
    
    function addDevices(p) {
      p.devices = [];
    	for( let i = 0; i < p.devices_ids.length; i++)
    	  p.devices.push( findDevice( p.devices_ids[i]));
      return p;
    }
    
    var result = people.map(addDevices);
    Ответ написан
    Комментировать
  • Как собрать данные с инпута и завернуть их в ссылку?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Fiddle
    var $in = $('#input')
      , $check = $('#check')
    	, $links = $('#links')
    ;
    
    $check.on('click', function () {
    	var val = $in.val();
    	$in.val('');
      $links.append(
    	  "<a class='link' href='#'>%VALUE%</a>"
    		  .replace('%VALUE%', val)
    	);
    });


    То же на чистом JavaScript без jQuery:
    spoiler
    var els = {
    	input: document.getElementById('input'),
    	check: document.getElementById('check'),
    	links: document.getElementById('links'),
    	link: document.createElement('a')
    };
    
    els.link.className = 'link';
    els.link.href = '#';
    
    els.check.addEventListener('click', function(){
    	var a = els.link.cloneNode();
    	a.innerText = els.input.value;
    	els.input.value = '';
    	els.links.appendChild(a);
    });
    Fiddle
    Ответ написан
  • Как сделать подстановку текста в инпут по клику?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    document
      .getElementById('e-example')
      .addEventListener('click', function(){
        document.getElementById('search').value = this.innerText;
      });

    Fiddle
    ef748af96dc149ca8580c9fb97baa66a.png
    Ответ написан
    Комментировать
  • Есть ли способ "самоуничтожить" html документ?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    Надёжного / серьёзного способа нет. Миллион способов обойти это ограничение: от снимков экрана (в т.ч. буквальных, на телефон или фотоаппарат), до консоли разработчика, где видны все сетевые запросы и ответы.

    Можно «секретную» часть подгружать через ajax POST-запрос. Пользователь должен быть авторизован на вашем сайте. На сервере проверять, что именно этот пользователь ещё не получал эту инфу, и пометить, что он её получил.

    AJAX-запрос невозможен при выключенном JavaScript. Так что положимся на него же (на JS) для удаления подгруженного контента по таймауту.
    Ответ написан
    Комментировать
  • Как объединить два массива?

    sergiks
    @sergiks Куратор тега JavaScript
    ♬♬
    У вас не массивы [] а объекты {}.

    В Underscore.js есть метод extend()
    исходник
    _.extend = createAssigner(_.allKeys);
    
      var createAssigner = function(keysFunc, undefinedOnly) {
        return function(obj) {
          var length = arguments.length;
          if (length < 2 || obj == null) return obj;
          for (var index = 1; index < length; index++) {
            var source = arguments[index],
                keys = keysFunc(source),
                l = keys.length;
            for (var i = 0; i < l; i++) {
              var key = keys[i];
              if (!undefinedOnly || obj[key] === void 0) obj[key] = source[key];
            }
          }
          return obj;
        };
      };
    
      _.allKeys = function(obj) {
        if (!_.isObject(obj)) return [];
        var keys = [];
        for (var key in obj) keys.push(key);
        if (hasEnumBug) collectNonEnumProps(obj, keys);
        return keys;
      };



    В jQuery тоже есть extend().
    исходник
    jQuery.extend = jQuery.fn.extend = function() {
    	var options, name, src, copy, copyIsArray, clone,
    		target = arguments[ 0 ] || {},
    		i = 1,
    		length = arguments.length,
    		deep = false;
    
    	// Handle a deep copy situation
    	if ( typeof target === "boolean" ) {
    		deep = target;
    
    		// Skip the boolean and the target
    		target = arguments[ i ] || {};
    		i++;
    	}
    
    	// Handle case when target is a string or something (possible in deep copy)
    	if ( typeof target !== "object" && !jQuery.isFunction( target ) ) {
    		target = {};
    	}
    
    	// Extend jQuery itself if only one argument is passed
    	if ( i === length ) {
    		target = this;
    		i--;
    	}
    
    	for ( ; i < length; i++ ) {
    
    		// Only deal with non-null/undefined values
    		if ( ( options = arguments[ i ] ) != null ) {
    
    			// Extend the base object
    			for ( name in options ) {
    				src = target[ name ];
    				copy = options[ name ];
    
    				// Prevent never-ending loop
    				if ( target === copy ) {
    					continue;
    				}
    
    				// Recurse if we're merging plain objects or arrays
    				if ( deep && copy && ( jQuery.isPlainObject( copy ) ||
    					( copyIsArray = Array.isArray( copy ) ) ) ) {
    
    					if ( copyIsArray ) {
    						copyIsArray = false;
    						clone = src && Array.isArray( src ) ? src : [];
    
    					} else {
    						clone = src && jQuery.isPlainObject( src ) ? src : {};
    					}
    
    					// Never move original objects, clone them
    					target[ name ] = jQuery.extend( deep, clone, copy );
    
    				// Don't bring in undefined values
    				} else if ( copy !== undefined ) {
    					target[ name ] = copy;
    				}
    			}
    		}
    	}
    
    	// Return the modified object
    	return target;
    };
    Ответ написан
    Комментировать