@rock18 ноя 2014 в 11:57

Размышления о стандартной библиотеке JavaScript. Core.js

64 мин

107K

JavaScript * Node.JS * Веб-разработка *

+76

Комментарии 40

@TheSteelRat 18 ноя 2014 в 12:26

Вот что только люди не придумают лишь бы не пользоваться Dart (не воспринимайте эти слова всерьёз).

Там, кстати, многое из вами перечисленного есть из коробки.

@aen 18 ноя 2014 в 13:06

Вот только dart не поддерживается браузерами «из коробки».

@TheSteelRat 18 ноя 2014 в 13:11

Как и CofeeScript с TypeScript-ом. Но это не мешает транслировать их в JS.

@xGromMx 18 ноя 2014 в 13:30

Но то, во что транслируется Dart это совсем не то, во что Typescript + всегда можно юзать выше упомянутый проект 6to5. А вот сколько лишнего кода генерит Dart это просто ужасно.

@TheSteelRat 18 ноя 2014 в 14:34

Ну так и Dart не просто синтаксический сахар в отличие от TypeScript.

За возможности приходится платить лишним кодом. Но всё зависит от размера приложения. Если вам надо пару десятков строк на клиенте написать, то Dart будет оверхедом. А если вам нужен толстый клиент по типу GMail, то с ростом количества клиентского кода вы перестанете замечать размер кода ядра Dart-а.

@StreetStrider 18 ноя 2014 в 16:05

Чего только люди не придумают, лишь бы не учить JS.

@TheSteelRat 18 ноя 2014 в 17:33

Одно другому не мешает.

@TheSteelRat 18 ноя 2014 в 21:43

Вы хоть обосновывайте за что минусуете и карму сливаете. Пока похоже на борьбу с инакомыслящими.

@Borz 18 ноя 2014 в 21:47

дело не в инакомыслии, а в том, как вы эту мыслю до публики доносите ;)

@TheSteelRat 19 ноя 2014 в 05:59

Пожалуй вы правы. Стоило остановиться на первом комментарии и не продолжать дискуссию. И вставить всё-таки тег <irony>. Habr is so serious…

@forgotten 19 ноя 2014 в 05:29

Я просто оставлю это здесь: benchmarksgame.alioth.debian.org/u32/benchmark.php?test=all&lang=dart&lang2=v8&data=u32

@Jabher 18 ноя 2014 в 13:32

@Stepanow 18 ноя 2014 в 13:35

Вы не дочитали до #заключения?

@Jabher 19 ноя 2014 в 07:32

увы. посыпаю голову пеплом.

извиняюсь, был напуган.

@Aetet 18 ноя 2014 в 13:37

:offtop
А что за плагин для генерации статьи использовался? Я вижу markdown-подобную верстку, которая транслировалась в habra-разметку. Что за плагин?

@rock 18 ноя 2014 в 13:41

Никакого плагина — доступные теги + ctrl-c / ctrl-v :) Хотя к концу поднадоело, думал и правда что такое написать.

@poxvuibr 18 ноя 2014 в 13:58

Я вот пишу в markdown, конвертирую в html, потом руками правлю по необходимости. Тут тоже так?

@rock 18 ноя 2014 в 14:07

Нет, сразу html. Не особо напрягает.

@Zenitchik 18 ноя 2014 в 16:29

А я, когда припёрло, наскоро допилил node.js-ную реализацию шаблонизатора micro под свои нужды и собирал статью с её помощью.

@BuranLcme 19 ноя 2014 в 20:44

Заделитесь, пожалуйста)

@Zenitchik 20 ноя 2014 в 12:40

Да, знаете ли стыдно такую мелочь как достижение позиционировать. В общем-то наскороручная любительская поделка на десяток строк.
Но если интересно:

var fs = require('fs');
function tmpl(str){
      /* br */
	  var funcBody = "var _buffer=[],print=function(){_buffer.push.apply(_buffer,arguments);};" +
		"_buffer.push('" +
        str
          .replace(/[\n]/g, '/* br */')
		  .replace(/\\/g, "\\\\")
          .replace(/[\r]/g, "")
          .replace(/[\t]/g, "  ")
          .split("<%").join("\t")
          .replace(/((^|%>)[^\t]*)'/g, "$1\r")
          .replace(/\t=(.*?)%>/g, "',$1,'")
          .split("\t").join("');")
          .split("%>").join("_buffer.push('")
          .split("\r").join("\\'") 
      + "');return _buffer.join('');";
      
    return funcBody;
  };

var code = fs.readFileSync('source.txt', {encoding:'UTF-8'});
console.log('load ok');
var fnBody = tmpl(code);
fs.writeFileSync('function.js', fnBody);
console.log('convert ok');
var fn = new Function(fnBody);
console.log('compiled ok');
code = fn();
code = code.replace(/\/\*\sbr\s\*\//g, "\n");
fs.writeFileSync('result.txt', code);
console.log('finish');

Интерфейса не делал никакого, и как модуль тоже не оформлял. Для моих задач было достаточно запускать из командной строки и получать из одного файла другой.
По коду можно видеть, что я скопипастил основной код из micro и слегка допилил.
Файл function.js — это промежуточный вывод, он был мне нужен для отладки.

Для генерации годно оформленных километровых таблиц мне этого хватило. И для проведения вычислительного эксперимента прямо во время сборки статьи — тоже.

@Aetet 18 ноя 2014 в 14:12

Такой тулзовиной?
github.com/kriomant/markdown-habrahabr/blob/master/article.txt

@Delphinum 19 ноя 2014 в 15:37

Могу посоветовать Vim + UltiSnips + Vimperator.
Делается примерно так:
1. Устанавливаете фокус в окне ввода статьи
2. Нажимаете Ctrl+i, открывается Vim
3. Пишите статью с использованием заранее загатовленных сниппетов и всяческих плюшек Vim
4. Нажимаете ZZ и то что напишите, попадет на хабр

@StreetStrider 18 ноя 2014 в 15:52

И тут возникает проблема — fn(foo.bar.baz.bind(foo.bar)). Мы вынуждены писать foo.bar 2 раза, это явное нарушение принципа DRY.

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

@StreetStrider 18 ноя 2014 в 15:57

Почему вы использовали наименование Function#part вместо partial? Это ваше личное предпочтение, или для соответствия чему-то? В библиотеках обычно используется полный вариант.

@rock 18 ноя 2014 в 16:38

такое сложное обращение говорит о нарушении «закона Деметры».

Возможно. Но это просто пример. Дело не в сложных биндингах, а в простом извлечении метода из контекста. Например, посмотрите на передачу метода test регулярного выражения как коллбэка. Хотя без Proxy или abstract references это выглядит довольно топорно.

Почему вы использовали наименование Function#part вместо partial?

Личное предпочтение — чуть короче и вполне понятно. Тем более, никаких подвижек со стандартизацией подобного я не вижу. В Sugar это вообще fill.

@Mingun 18 ноя 2014 в 16:40

Кстати, если кто не знает, все ссылки на MDN по Array, Object, Number, Intl и частично String можно заменить на русскоязычные версии :).

Насчёт поддержки стандарта интернационализации в Firefox: сейчас он поддерживается не полностью, либо это просто баг (хотя на странице документации и сказано обратное). Например, следующая конструкция вылетает с ошибкой "Error: internal error while computing Intl data" (проблема в свойстве currencyDisplay, отличном от значения "symbol"):

console.log(new Intl.NumberFormat('ru-RU', { style: 'currency', currency: 'RUB', currencyDisplay: 'code' }).format(123456.789));

Chrome в этом случае правильно выводит строку «123 456,79 RUB».

@igorshubovych 18 ноя 2014 в 16:59

А выложите еще на bower пожалуйста

@rock 18 ноя 2014 в 17:56

Мдэ. А на bower имечко то занято… придётся ставить так:

bower install core.js

@dfuse 19 ноя 2014 в 11:39

Надо было такое выбрать, чтоб везде одинаково… запомнить не сложно, но OCD не дремлет.

@kalabro 18 ноя 2014 в 17:20

Вместо того, чтобы читать статью, залипла на сапёре на домашней страничке автора :(

@asavin 19 ноя 2014 в 06:25

Эммм… Как-то я привык считать, что маленькие модули — это хорошо, а подобные библиотеки всё-в-одном — не очень. «Делайте что-то одно, но делайте это хорошо».

@rock 19 ноя 2014 в 07:10

«Маленькие модули» — это хорошо, но только не в качестве стандартной библиотеки. На каждое телодвижение придётся думать — а подключен ли, например, модуль проверки вхождения подстроки в строку?

«Делать хорошо» в данном случае «маленьким библиотекам» мешает именно то, что они маленькие. Например, Promise. Обещания должны разрешаться асинхронно, для этого нужно эффективное отложенное исполнение, а это далеко не компактно. В итоге, во всех современных браузерах, кроме IE, native-promise-only использует только… setTimeout, разрешающий обещания через 4мс, а не сразу. Здесь же, в рамках модуля setImmediate, присутствует реализация эффективного отложенного исполнения другими способами, не имеющими ограничения в 4мс.

На практике эти «маленькие модули» не такие уж и меленькие, солянка из таких библиотек во много раз превышает размер данной библиотеки. Эталон компактности и минималистичности — Undescore — всего раза в 1,5 легче core.js. es6-shim, что не включает в себя даже полифила символов и weak-коллекций, даже тяжелее. А core.js сама по себе модульная — никто не мешает собрать необходимый вам минимум функционала в пару килобайт.

@dfuse 19 ноя 2014 в 11:38

rock, you rock. Респект за труд по созданию библиотеки и статьи. Безусловно приму к сведению и при возможность включу в какой-нибудь проект.

В копилку — база полифиллов polyfills.io

@forgotten 19 ноя 2014 в 12:00

Это просто самая офигительная статья ever на этом простигосподи ресурсе.

@mihmig 20 ноя 2014 в 10:59

Фундаментальный труд, я бы сказал.

@arXangel 29 ноя 2014 в 15:00

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

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

Спасибо за фундаментальный труд.

@CestLaVie 18 янв 2015 в 15:04

В свете ES6-синтаксиса, комменты вида "// => [1, 2, 3]" читаются несколько двусмысленно, лучше придумать другую форму отображения рез-тов в комментах. А в остальном статья хороша!

@CestLaVie 2 мар 2015 в 11:03

Метод Object.create создает объект из прототипа. Передав null, можно создать объект без прототипа, что сделать на базе ECMAScript 3 невозможно. Приходится использовать лютый трэш на базе iframe.

Очень хочется узнать подробности — что имеется в виду. Дело в том, что у меня тоже не получается сделать корректно:

Object.create = function create(prototype, descriptors) {
    if (this === Object || typeof this === 'undefined')
        switch (typeof prototype) {
            case 'object':
            case 'function':
                var /** @type * */ result = new create(create.prototype = prototype);
                return (typeof descriptors === 'undefined') ? result: Object.defineProperties(result, descriptors);
            default:
                throw new TypeError('Object prototype may only be an Object or null: ' + prototype);
        }
    else
        /* Если происходит внутренний вызов функции как конструктора - удаляем ссылку на прототип, что бы не
         * делать этого в основном коде (что бы его этим не захламлять). */
        create.prototype = null;
};

Object.defineProperty(Object, 'create', {enumerable: false});

/** @test */
(function(t){[
        ['создание объекта', function(){
            var p = Object.create({z:0}, {
                    x: { value: 1, writable: false, enumerable:true, configurable: true},
                    y: { value: 2, writable: false, enumerable:true, configurable: true}
            });
            return p.hasOwnProperty('x') && p.x === 1 && p.hasOwnProperty('y') && p.y === 2 &&
                   !p.hasOwnProperty('z') && ('z' in p) && p.z === 0;}],
        ['создание объекта без свойств', function(){
            var p = Object.create({z:0});
            return !p.hasOwnProperty('z') && ('z' in p) && p.z === 0;}],
        ['создание объекта без прототипа', function(){
            return Object.getPrototypeOf(Object.create(null)) === null;}]
    ].forEach(function(p){console.log('Object.create: тест на '+p[0]+' '+(t(p[1])?'':
                                   'НЕ (!!!) ')+'пройден');});})(function(t){try{return t()}catch(e){return false;}});

Третий тест слетает везде, в т.ч. на Chrom`е… :(((

@rock 2 мар 2015 в 11:29

Нельзя просто так взять и подставить null в качестве прототипа конструктора. iframe имеет своё собственное окружение, включая стандартные конструкторы. Так что создаём iframe, удаляем из его Object.prototype все свойства и когда нам нужно создать объект (якобы) без прототипа — создаём инстанс Object из iframe. Получаем объект без свойств в прототипе и не являющийся инстансом Object текущего окружения. Всегда можно посмотреть код на GitHub'е :)

Зарегистрируйтесь на Хабре, чтобы оставить комментарий