Численные тысячные, 6 методов и сравнение производительности, стоит посмотреть

внешний интерфейс JavaScript
Численные тысячные, 6 методов и сравнение производительности, стоит посмотреть

Это 28-й день моего участия в августовском испытании обновлений. Узнайте подробности события:Испытание августовского обновления.

помещение

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

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

Я люблю прямое и плотное дерьмо. Хорошо, давайте перейдем к тексту.

выполнить

Числовой обход строки

function format_with_array(number) {
    var arr = (number + '').split('.');
    var int = arr[0].split('');
    var fraction = arr[1] || '';
    var r = "";
    var len = int.length;
    int.reverse().forEach(function (v, i) {
        if (i !== 0 && i % 3 === 0) {
            r = v + "," + r;
        } else {
            r = v + r;
        }
    })
    return r + (!!fraction ? "." + fraction : '');
}

substring

function format_with_substring(number) {
    var arr = (number + '').split('.');
    var int = arr[0] + '';
    var fraction = arr[1] || '';
    var f = int.length % 3;
    var r = int.substring(0, f);

    for (var i = 0; i < Math.floor(int.length / 3); i++) {
        r += ',' + int.substring(f + i * 3, f + (i + 1) * 3)
    }

    if (f === 0) {
        r = r.substring(1);
    }
    return r + (!!fraction ? "." + fraction : '');
}

деление + модуль

function format_with_mod(number) {
    var n = number;
    var r = ""; 
    var temp;
    do {
        mod = n % 1000;
        n = n / 1000;
        temp = ~~mod;
        r =  (n >= 1 ?`${temp}`.padStart(3, "0"): temp) + (!!r ? "," + r : "")
    } while (n >= 1)

    var strNumber = number + "";
    var index = strNumber.indexOf(".");
    if (index > 0) {
        r += strNumber.substring(index);
    }
    return r;
}

Обычный

function format_with_regex(number) {
    var reg = /\d{1,3}(?=(\d{3})+$)/g;
    return (number + '').replace(reg, '$&,');
}

function format_with_regex(number) {
    var reg = /(\d)(?=(?:\d{3})+$)/g   
    return (number + '').replace(reg, '$1,');
}

toLocaleString

function format_with_toLocaleString(number, minimumFractionDigits, maximumFractionDigits) {
    minimumFractionDigits = minimumFractionDigits || 2;
    maximumFractionDigits = (maximumFractionDigits || 2);
    maximumFractionDigits = Math.max(minimumFractionDigits, maximumFractionDigits);

    return number.toLocaleString("en-us", {
        maximumFractionDigits: maximumFractionDigits || 2,
        minimumFractionDigits: minimumFractionDigits || 2
    })
}

Intl.NumberFormat

function format_with_Intl(number, minimumFractionDigits, maximumFractionDigits) {
    minimumFractionDigits = minimumFractionDigits || 2;
    maximumFractionDigits = (maximumFractionDigits || 2);
    maximumFractionDigits = Math.max(minimumFractionDigits, maximumFractionDigits);

    return new Intl.NumberFormat('en-us', {
        maximumFractionDigits: maximumFractionDigits || 2,
        minimumFractionDigits: minimumFractionDigits || 2
    }).format(number)
}

представление

Адрес теста:тысячный тест производительности
Подготовьте код для тестирования производительности, чтобы протестировать с десятичными знаками и без них, когда getData, если случайное значение больше 0,5, десятичный знак будет удален.

function getData(count) {
    var data = new Array(count).fill(0).map(function (i) {
        var rd = Math.random();
        var r = rd * Math.pow(10, 10);
        if (rd > 0.5) {
            r = ~~r;
        }
        return r
    })
    return data;
}

function test(data, fn, label) {
    var start = performance.now();
    for (var i = 0; i < data.length; i++) {
        fn(data[i]);
    }
    var time = performance.now() - start;

    message((fn.name || label) + ":" + time + "ms");
}


function executeTest() {
    var data = getData(+textCount.value);
    test(data, format_with_array);
    test(data, format_with_mod);
    test(data, format_with_substring);
    test(data, format_with_regex);
    test(data, format_with_toLocaleString);
    test(data, format_with_Intl);
}

function message(msg) {
    var el = document.createElement("p");
    el.innerHTML = msg;
    messageEl.appendChild(el);
}

Тестовые данные 50000

1. версия Chrome 74.0.3729.131 (официальная версия) (32-разрядная версия)

format_with_array:59.13ms

format_with_mod:23.96ms

format_with_substring:44.04ms

format_with_regex:53.54ms

format_with_toLocaleString:1813.61ms

format_with_Intl:1973.45ms

2. 360-скоростной браузер 11.0.2052.0
Скоростной режим

format_with_array:63.30ms

format_with_mod:37.80ms

format_with_substring:41.40ms

format_with_regex:51.20ms

format_with_toLocaleString:3334.30ms

format_with_Intl:3485.80ms

Режим совместимости не поддерживает Array.fill Pass

3. Высокоскоростной браузер Sogou 8.5.10.30358

format_with_array:75.29ms

format_with_mod:35.47ms

format_with_substring:40.79ms

format_with_regex:49.86ms

format_with_toLocaleString:2418.04ms

format_with_Intl:2474.30ms

4. firefox 66.0.3

format_with_array:41.00ms

format_with_mod:25.00ms

format_with_substring:28.00ms

format_with_regex:43.00ms

format_with_toLocaleString:1799.00ms

format_with_Intl:2239.00ms

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

format_with_mod > format_with_substring > format_with_regex > format_with_array > format_with_toLocaleString > format_with_Intl

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

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

напиши в конце

Если вы считаете, что это хорошо, ваши лайки и комментарии — самая большая мотивация для меня двигаться дальше.

Пожалуйста, посетите группу технического обменаиди сюда. Или добавьте мое облако похорон WeChat и учитесь вместе.

Категории