천 이상인 경우 숫자를 2.5K로 포맷하고 그렇지 않으면 900으로 포맷합니다
1000이 아닌 경우 1K 또는 1.1K, 1.2K, 1.9K 등의 1K 형식으로 통화 값을 표시해야합니다. 그렇지 않으면 천 미만이면 정상 500, 100, 250 등을 표시합니다. , 자바 스크립트를 사용하여 숫자를 형식화합니까?
이 같은 소리가 당신을 위해 작동해야합니다 :
function kFormatter(num) {
return Math.abs(num) > 999 ? Math.sign(num)*((Math.abs(num)/1000).toFixed(1)) + 'k' : Math.sign(num)*Math.abs(num)
}
console.log(kFormatter(1200)); // 1.2k
console.log(kFormatter(-1200)); // -1.2k
console.log(kFormatter(900)); // 900
console.log(kFormatter(-900)); // -900
보다 일반화 된 버전 :
function nFormatter(num, digits) {
var si = [
{ value: 1, symbol: "" },
{ value: 1E3, symbol: "k" },
{ value: 1E6, symbol: "M" },
{ value: 1E9, symbol: "G" },
{ value: 1E12, symbol: "T" },
{ value: 1E15, symbol: "P" },
{ value: 1E18, symbol: "E" }
];
var rx = /\.0+$|(\.[0-9]*[1-9])0+$/;
var i;
for (i = si.length - 1; i > 0; i--) {
if (num >= si[i].value) {
break;
}
}
return (num / si[i].value).toFixed(digits).replace(rx, "$1") + si[i].symbol;
}
/*
* Tests
*/
var tests = [
{ num: 1234, digits: 1 },
{ num: 100000000, digits: 1 },
{ num: 299792458, digits: 1 },
{ num: 759878, digits: 1 },
{ num: 759878, digits: 0 },
{ num: 123, digits: 1 },
{ num: 123.456, digits: 1 },
{ num: 123.456, digits: 2 },
{ num: 123.456, digits: 4 }
];
var i;
for (i = 0; i < tests.length; i++) {
console.log("nFormatter(" + tests[i].num + ", " + tests[i].digits + ") = " + nFormatter(tests[i].num, tests[i].digits));
}
nFormatter (33000)를 33.0K로 반환하므로 Salman 's Answer 개선
function nFormatter(num) {
if (num >= 1000000000) {
return (num / 1000000000).toFixed(1).replace(/\.0$/, '') + 'G';
}
if (num >= 1000000) {
return (num / 1000000).toFixed(1).replace(/\.0$/, '') + 'M';
}
if (num >= 1000) {
return (num / 1000).toFixed(1).replace(/\.0$/, '') + 'K';
}
return num;
}
이제 nFormatter (33000) = 33K
다음은 모든 if
문장 을 피하는 간단한 솔루션입니다 (의 힘으로 Math
).
var SI_SYMBOL = ["", "k", "M", "G", "T", "P", "E"];
function abbreviateNumber(number){
// what tier? (determines SI symbol)
var tier = Math.log10(number) / 3 | 0;
// if zero, we don't need a suffix
if(tier == 0) return number;
// get suffix and determine scale
var suffix = SI_SYMBOL[tier];
var scale = Math.pow(10, tier * 3);
// scale the number
var scaled = number / scale;
// format number and add suffix
return scaled.toFixed(1) + suffix;
}
보너스 밈
/**
* Shorten number to thousands, millions, billions, etc.
* http://en.wikipedia.org/wiki/Metric_prefix
*
* @param {number} num Number to shorten.
* @param {number} [digits=0] The number of digits to appear after the decimal point.
* @returns {string|number}
*
* @example
* // returns '12.5k'
* shortenLargeNumber(12543, 1)
*
* @example
* // returns '-13k'
* shortenLargeNumber(-12567)
*
* @example
* // returns '51M'
* shortenLargeNumber(51000000)
*
* @example
* // returns 651
* shortenLargeNumber(651)
*
* @example
* // returns 0.12345
* shortenLargeNumber(0.12345)
*/
function shortenLargeNumber(num, digits) {
var units = ['k', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y'],
decimal;
for(var i=units.length-1; i>=0; i--) {
decimal = Math.pow(1000, i+1);
if(num <= -decimal || num >= decimal) {
return +(num / decimal).toFixed(digits) + units[i];
}
}
return num;
}
의견을 위해 Thx @Cos, Math.round10 종속성을 제거했습니다.
당신이 좋아하면 Waylon Flinn에게 신용을 줘
음수 및 ".0"사례를 처리하기 위해보다 세련된 방식으로 개선되었습니다.
루프가 적고 "if"사례가 많을수록 IMO가 더 좋습니다.
function abbreviateNumber(number) {
var SI_POSTFIXES = ["", "k", "M", "G", "T", "P", "E"];
var tier = Math.log10(Math.abs(number)) / 3 | 0;
if(tier == 0) return number;
var postfix = SI_POSTFIXES[tier];
var scale = Math.pow(10, tier * 3);
var scaled = number / scale;
var formatted = scaled.toFixed(1) + '';
if (/\.0$/.test(formatted))
formatted = formatted.substr(0, formatted.length - 2);
return formatted + postfix;
}
테스트 케이스가있는 jsFiddle-> https://jsfiddle.net/xyug4nvz/7/
이것은 매우 우아합니다.
function formatToUnits(number, precision) {
const abbrev = ['', 'k', 'm', 'b', 't'];
const unrangifiedOrder = Math.floor(Math.log10(Math.abs(number)) / 3)
const order = Math.max(0, Math.min(unrangifiedOrder, abbrev.length -1 ))
const suffix = abbrev[order];
return (number / Math.pow(10, order * 3)).toFixed(precision) + suffix;
}
formatToUnits(12345, 2)
==> "12.35k"
formatToUnits(0, 3)
==> "0.000"
이 스레드에 대한 많은 답변은 Math 객체, 맵 객체, for-loops, 정규 표현식 등을 사용하여 다소 복잡해집니다. 그러나 이러한 접근법은 코드의 가독성이나 성능을 실제로 향상시키지 않습니다. 직접적인 접근 방식은 최고의 디자인을 제공하는 것으로 보입니다.
K를 사용하여 현금 가치 형식화
const formatCash = n => {
if (n < 1e3) return n;
if (n >= 1e3) return +(n / 1e3).toFixed(1) + "K";
};
console.log(formatCash(2500));
KMBT를 사용하여 현금 가치 서식
const formatCash = n => {
if (n < 1e3) return n;
if (n >= 1e3 && n < 1e6) return +(n / 1e3).toFixed(1) + "K";
if (n >= 1e6 && n < 1e9) return +(n / 1e6).toFixed(1) + "M";
if (n >= 1e9 && n < 1e12) return +(n / 1e9).toFixed(1) + "B";
if (n >= 1e12) return +(n / 1e12).toFixed(1) + "T";
};
console.log(formatCash(1235000));
음수 지원으로 @Yash의 답변을 더욱 향상시킵니다.
function nFormatter(num) {
isNegative = false
if (num < 0) {
isNegative = true
}
num = Math.abs(num)
if (num >= 1000000000) {
formattedNumber = (num / 1000000000).toFixed(1).replace(/\.0$/, '') + 'G';
} else if (num >= 1000000) {
formattedNumber = (num / 1000000).toFixed(1).replace(/\.0$/, '') + 'M';
} else if (num >= 1000) {
formattedNumber = (num / 1000).toFixed(1).replace(/\.0$/, '') + 'K';
} else {
formattedNumber = num;
}
if(isNegative) { formattedNumber = '-' + formattedNumber }
return formattedNumber;
}
nFormatter(-120000)
"-120K"
nFormatter(120000)
"120K"
Python Advanced String Formatting PEP3101 이후에 모델링 된 d3 형식 패키지를 사용할 수 있습니다 .
var f = require('d3-format')
console.log(f.format('.2s')(2500)) // displays "2.5k"
이 게시물은 꽤 오래되었지만 어떻게 든이 게시물을 찾고 있습니다. 그래서 내 입력을 추가하는 Numeral js는 이제 하루 만에 원 스톱 솔루션입니다. 숫자 서식을 지정하는 데 도움이되는 많은 방법을 제공합니다.
상단 답변에 추가하면 1.0k 대신 1000에 1k가 제공됩니다.
function kFormatter(num) {
return num > 999 ? num % 1000 === 0 ? (num/1000).toFixed(0) + 'k' : (num/1000).toFixed(1) + 'k' : num
}
- 음수 지원
- 확인 중
!Number.isFinite
- 변경
' K M G T P E Z Y'
에' K M'
당신이 최대 단위는 원하는 경우M
아래 코드는 1K = 1024이며 1K = 1000을 원하면 모든 1024를 1000으로 변경하십시오.
Number.prototype.prefix = function (precision = 2) {
var units = ' K M G T P E Z Y'.split(' ');
if (this < 0) {
return '-' + Math.abs(this).prefix(precision);
}
if (this < 1) {
return this + units[0];
}
var power = Math.min(
Math.floor(Math.log(this) / Math.log(1024)),
units.length - 1
);
return (this / Math.pow(1024, power)).toFixed(precision) + units[power];
}
console.log('10240 = ' + (10240).prefix()) // 10.00K
console.log('1234000 = ' + (1234000).prefix(1)) // 1.2M
console.log('10000 = ' + (-10000).prefix()) // -9.77K
소수점 이하 자릿수를 형식화하기 위해 @tfmontague의 답변을 향상시킵니다. 33.0k에서 33k
largeNumberFormatter(value: number): any {
let result: any = value;
if (value >= 1e3 && value < 1e6) { result = (value / 1e3).toFixed(1).replace(/\.0$/, '') + 'K'; }
if (value >= 1e6 && value < 1e9) { result = (value / 1e6).toFixed(1).replace(/\.0$/, '') + 'M'; }
if (value >= 1e9) { result = (value / 1e9).toFixed(1).replace(/\.0$/, '') + 'T'; }
return result;
}
/*including negative values*/
function nFormatter(num) {
let neg = false;
if(num < 0){
num = num * -1;
neg = true;
}
if (num >= 1000000000) {
if(neg){
return -1 * (num / 1000000000).toFixed(1).replace(/\.0$/, '') + 'G';
}
return (num / 1000000000).toFixed(1).replace(/\.0$/, '') + 'G';
}
if (num >= 1000000) {
if(neg){
return -1 * (num / 1000000).toFixed(1).replace(/\.0$/, '') + 'M';
}
return (num / 1000000).toFixed(1).replace(/\.0$/, '') + 'M';
}
if (num >= 1000) {
if(neg){
return -1 * (num / 1000).toFixed(1).replace(/\.0$/, '') + 'K';
}
return (num / 1000).toFixed(1).replace(/\.0$/, '') + 'K';
}
return num;
}
음수 지수를 지원하는 Waylon Flinn의 답변 수정 버전 :
function metric(number) {
const SI_SYMBOL = [
["", "k", "M", "G", "T", "P", "E"], // +
["", "m", "μ", "n", "p", "f", "a"] // -
];
const tier = Math.floor(Math.log10(Math.abs(number)) / 3) | 0;
const n = tier < 0 ? 1 : 0;
const t = Math.abs(tier);
const scale = Math.pow(10, tier * 3);
return {
number: number,
symbol: SI_SYMBOL[n][t],
scale: scale,
scaled: number / scale
}
}
function metric_suffix(number, precision) {
const m = metric(number);
return (typeof precision === 'number' ? m.scaled.toFixed(precision) : m.scaled) + m.symbol;
}
for (var i = 1e-6, s = 1; i < 1e7; i *= 10, s *= -1) {
// toggles sign in each iteration
console.log(metric_suffix(s * (i + i / 5), 1));
}
console.log(metric(0));
예상 출력 :
1.2μ
-12.0μ
120.0μ
-1.2m
12.0m
-120.0m
1.2
-12.0
120.0
-1.2k
12.0k
-120.0k
1.2M
{ number: 0, symbol: '', scale: 1, scaled: 0 }
이 함수는 정밀도를 잃지 않으면 서 많은 수 (양수와 음수 모두)를 독자 친화적 형식으로 변환 할 수 있습니다.
function abbrNum(n) {
if (!n || (n && typeof n !== 'number')) {
return '';
}
const ranges = [
{ divider: 1e12 , suffix: 't' },
{ divider: 1e9 , suffix: 'b' },
{ divider: 1e6 , suffix: 'm' },
{ divider: 1e3 , suffix: 'k' }
];
const range = ranges.find(r => Math.abs(n) >= r.divider);
if (range) {
return (n / range.divider).toString() + range.suffix;
}
return n.toString();
}
/* test cases */
let testAry = [99, 1200, -150000, 9000000];
let resultAry = testAry.map(abbrNum);
console.log("result array: " + resultAry);
이 기능을 사용하고 있습니다. php
와 모두 작동합니다 javascript
.
/**
* @param $n
* @return string
* Use to convert large positive numbers in to short form like 1K+, 100K+, 199K+, 1M+, 10M+, 1B+ etc
*/
function num_format($n) {
$n_format = null;
$suffix = null;
if ($n > 0 && $n < 1000) {
$n_format = Math.floor($n);
$suffix = '';
}
else if ($n == 1000) {
$n_format = Math.floor($n / 1000); //For PHP only use floor function insted of Math.floor()
$suffix = 'K';
}
else if ($n > 1000 && $n < 1000000) {
$n_format = Math.floor($n / 1000);
$suffix = 'K+';
} else if ($n == 1000000) {
$n_format = Math.floor($n / 1000000);
$suffix = 'M';
} else if ($n > 1000000 && $n < 1000000000) {
$n_format = Math.floor($n / 1000000);
$suffix = 'M+';
} else if ($n == 1000000000) {
$n_format = Math.floor($n / 1000000000);
$suffix = 'B';
} else if ($n > 1000000000 && $n < 1000000000000) {
$n_format = Math.floor($n / 1000000000);
$suffix = 'B+';
} else if ($n == 1000000000000) {
$n_format = Math.floor($n / 1000000000000);
$suffix = 'T';
} else if ($n >= 1000000000000) {
$n_format = Math.floor($n / 1000000000000);
$suffix = 'T+';
}
/***** For PHP ******/
// return !empty($n_format . $suffix) ? $n_format . $suffix : 0;
/***** For Javascript ******/
return ($n_format + $suffix).length > 0 ? $n_format + $suffix : 0;
}
@Novellizator의 답변을 많이 확장하여 내 요구를 충족하기로 결정했습니다. 외부 라이브러리없이 대부분의 서식 요구를 처리 할 수있는 유연한 기능을 원했습니다.
풍모
- 주문 접미사 (k, M 등)를 사용하는 옵션
- 사용할 주문 접미사 목록을 지정하는 옵션
- 최소 및 최대 순서를 제한하는 옵션
- 소수점 이하 자릿수 제어
- 자동 주문 분리 쉼표
- 선택적 퍼센트 또는 달러 형식
- 숫자가 아닌 입력의 경우 반환 할 내용 제어
- 음수 및 무한 수에서 작동
예
let x = 1234567.8;
formatNumber(x); // '1,234,568'
formatNumber(x, {useOrderSuffix: true}); // '1M'
formatNumber(x, {useOrderSuffix: true, decimals: 3, maxOrder: 1}); // '1,234.568k'
formatNumber(x, {decimals: 2, style: '$'}); // '$1,234,567.80'
x = 10.615;
formatNumber(x, {style: '%'}); // '1,062%'
formatNumber(x, {useOrderSuffix: true, decimals: 1, style: '%'}); // '1.1k%'
formatNumber(x, {useOrderSuffix: true, decimals: 5, style: '%', minOrder: 2}); // '0.00106M%'
formatNumber(-Infinity); // '-∞'
formatNumber(NaN); // ''
formatNumber(NaN, {valueIfNaN: NaN}); // NaN
함수
/*
* Return the given number as a formatted string. The default format is a plain
* integer with thousands-separator commas. The optional parameters facilitate
* other formats:
* - decimals = the number of decimals places to round to and show
* - valueIfNaN = the value to show for non-numeric input
* - style
* - '%': multiplies by 100 and appends a percent symbol
* - '$': prepends a dollar sign
* - useOrderSuffix = whether to use suffixes like k for 1,000, etc.
* - orderSuffixes = the list of suffixes to use
* - minOrder and maxOrder allow the order to be constrained. Examples:
* - minOrder = 1 means the k suffix should be used for numbers < 1,000
* - maxOrder = 1 means the k suffix should be used for numbers >= 1,000,000
*/
function formatNumber(number, {
decimals = 0,
valueIfNaN = '',
style = '',
useOrderSuffix = false,
orderSuffixes = ['', 'k', 'M', 'B', 'T'],
minOrder = 0,
maxOrder = Infinity
} = {}) {
let x = parseFloat(number);
if (isNaN(x))
return valueIfNaN;
if (style === '%')
x *= 100.0;
let order;
if (!isFinite(x) || !useOrderSuffix)
order = 0;
else if (minOrder === maxOrder)
order = minOrder;
else {
const unboundedOrder = Math.floor(Math.log10(Math.abs(x)) / 3);
order = Math.max(
0,
minOrder,
Math.min(unboundedOrder, maxOrder, orderSuffixes.length - 1)
);
}
const orderSuffix = orderSuffixes[order];
if (order !== 0)
x /= Math.pow(10, order * 3);
return (style === '$' ? '$' : '') +
x.toLocaleString(
'en-US',
{
style: 'decimal',
minimumFractionDigits: decimals,
maximumFractionDigits: decimals
}
) +
orderSuffix +
(style === '%' ? '%' : '');
}
와우 여기에 너무 많은 답변이 있습니다. 나는 가장 읽기 쉬운 것처럼 보였고 음수를 처리하며 JavaScript의 킬로 숫자 범위에서 훨씬 멀어지기 때문에 어떻게 해결할 수 있다고 생각했습니다. 또한 원하거나 더 멀리 확장 한 것으로 쉽게 변경 될 수 있습니다.
const symbols = [
{ value: 1, symbol: '' },
{ value: 1e3, symbol: 'k' },
{ value: 1e6, symbol: 'M' },
{ value: 1e9, symbol: 'G' },
{ value: 1e12, symbol: 'T' },
{ value: 1e15, symbol: 'P' },
{ value: 1e18, symbol: 'E' }
];
function numberFormatter(num, digits) {
const numToCheck = Math.abs(num);
for (let i = symbols.length - 1; i >= 0; i--) {
if (numToCheck >= symbols[i].value) {
const newNumber = (num / symbols[i].value).toFixed(digits);
return `${newNumber}${symbols[i].symbol}`;
}
}
return '0';
}
const tests = [
{ num: 1234, digits: 1 },
{ num: 100000000, digits: 1 },
{ num: 299792458, digits: 1 },
{ num: 759878, digits: 1 },
{ num: -759878, digits: 0 },
{ num: 123, digits: 1 },
{ num: 123.456, digits: 1 },
{ num: -123.456, digits: 2 },
{ num: 123.456, digits: 4 }
];
for (let i = 0; i < tests.length; i++) {
console.log(`numberFormatter(${tests[i].num}, ${tests[i].digits})=${numberFormatter(tests[i].num, tests[i].digits)}`);
}
게시 된 솔루션 중 어느 것도 만족하지 않으므로 여기 내 버전이 있습니다.
- 양수 및 음수 지원
- 음의 지수를 지원합니다
- 가능하면 다음 지수로 올림
- 범위 검사를 수행합니다 (매우 크거나 작은 숫자에 대해서는 오류가 발생하지 않습니다).
- 후행 0 / 공백 제거
정밀 파라미터 지원
function abbreviateNumber(number,digits=2) { var expK = Math.floor(Math.log10(Math.abs(number)) / 3); var scaled = number / Math.pow(1000, expK); if(Math.abs(scaled.toFixed(digits))>=1000) { // Check for rounding to next exponent scaled /= 1000; expK += 1; } var SI_SYMBOLS = "apμm kMGTPE"; var BASE0_OFFSET = SI_SYMBOLS.indexOf(' '); if (expK + BASE0_OFFSET>=SI_SYMBOLS.length) { // Bound check expK = SI_SYMBOLS.length-1 - BASE0_OFFSET; scaled = number / Math.pow(1000, expK); } else if (expK + BASE0_OFFSET < 0) return 0; // Too small return scaled.toFixed(digits).replace(/(\.|(\..*?))0+$/,'$2') + SI_SYMBOLS[expK+BASE0_OFFSET].trim(); } ////////////////// const tests = [ [0.0000000000001,2], [0.00000000001,2], [0.000000001,2], [0.000001,2], [0.001,2], [0.0016,2], [-0.0016,2], [0.01,2], [1,2], [999.99,2], [999.99,1], [-999.99,1], [999999,2], [999999999999,2], [999999999999999999,2], [99999999999999999999,2], ]; for (var i = 0; i < tests.length; i++) { console.log(abbreviateNumber(tests[i][0], tests[i][1]) ); }
'development' 카테고리의 다른 글
div 안에 이미지 (img)를 맞추고 종횡비를 유지하려면 어떻게합니까? (0) | 2020.07.07 |
---|---|
요소에서 ': hover'CSS 동작 제거 (0) | 2020.07.07 |
Android EditText에서 대문자를 강제로 쓰는 방법은 무엇입니까? (0) | 2020.07.07 |
AngularJs에서 첫 번째 문자열을 대문자로 (0) | 2020.07.07 |
SQLite 대신 MySQL을 사용하여 새로운 Ruby on Rails 애플리케이션 만들기 (0) | 2020.07.07 |