كيف تقوم بإزالة الأصفار اللاحقة بعد الفاصلة العشرية؟
تحكم في وقت عرض الأرقام مع أو بدون أصفار لاحقة باستخدام خيارات أرقام الكسور.
مقدمة
عند تنسيق الأرقام، تحتوي بعض القيم بشكل طبيعي على أصفار لاحقة بعد الفاصلة العشرية. قد يظهر الرقم 1.5 كـ 1.50، أو قد يظهر 3 كـ 3.00. يمكن أن تكون هذه الأصفار اللاحقة منطقية للأسعار حيث تريد إظهار السنتات بشكل متسق، لكنها تبدو غير ضرورية عند عرض الإحصائيات أو القياسات.
يمنحك Intl.NumberFormat في JavaScript التحكم في ظهور الأصفار اللاحقة. يمكنك تكوين المنسق لإزالتها أو الاحتفاظ بها أو تطبيق قواعد مختلفة حسب احتياجاتك.
ما هي الأصفار اللاحقة
الأصفار اللاحقة هي أصفار تظهر في نهاية الرقم بعد الفاصلة العشرية. لا تغير القيمة الرياضية للرقم، لكنها تؤثر على كيفية ظهور الرقم عند عرضه.
// These numbers have the same value but different trailing zeros
1.5 // No trailing zeros
1.50 // One trailing zero
1.500 // Two trailing zeros
يمكن أن تظهر الأصفار اللاحقة عند تحديد عدد المنازل العشرية المراد عرضها. إذا كان الرقم يحتوي على أرقام معنوية أقل من عدد المنازل العشرية التي حددتها، يضيف المنسق أصفارًا لملء المواضع المتبقية.
كيف يعرض Intl.NumberFormat أرقام الكسور افتراضيًا
بشكل افتراضي، يعرض Intl.NumberFormat ما يصل إلى 3 أرقام كسرية ويزيل الأصفار اللاحقة. هذا يعني أن معظم الأرقام تظهر بدون أصفار غير ضرورية.
const formatter = new Intl.NumberFormat("en-US");
console.log(formatter.format(1.5));
// Output: "1.5"
console.log(formatter.format(1.50));
// Output: "1.5"
console.log(formatter.format(1.123456));
// Output: "1.123"
يتعامل المنسق مع 1.5 و1.50 كنفس القيمة ويعرضهما بشكل متطابق. يتم تقريب الأرقام التي تحتوي على أكثر من 3 منازل عشرية إلى 3 أرقام.
تعيين الحد الأدنى والأقصى لأرقام الكسور
يتحكم الخياران minimumFractionDigits و maximumFractionDigits في عدد الأرقام التي تظهر بعد الفاصلة العشرية. يعمل هذان الخياران معًا لتحديد ما إذا كانت الأصفار اللاحقة ستظهر.
const formatter = new Intl.NumberFormat("en-US", {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
console.log(formatter.format(1.5));
// Output: "1.50"
console.log(formatter.format(1));
// Output: "1.00"
console.log(formatter.format(1.234));
// Output: "1.23"
عندما يتم تعيين minimumFractionDigits و maximumFractionDigits على نفس القيمة، يعرض كل رقم بالضبط بهذا العدد من المنازل العشرية. الأرقام ذات الأرقام الأقل تحصل على أصفار لاحقة مضافة، والأرقام ذات الأرقام الأكثر يتم تقريبها.
إزالة الأصفار الزائدة
لإزالة الأصفار اللاحقة، اضبط minimumFractionDigits على 0 و maximumFractionDigits على الحد الأقصى لعدد المنازل العشرية التي تريد السماح بها. يخبر هذا التكوين المنسق بعرض ما بين 0 و N من المنازل العشرية، باستخدام العدد المطلوب فقط.
const formatter = new Intl.NumberFormat("en-US", {
minimumFractionDigits: 0,
maximumFractionDigits: 2
});
console.log(formatter.format(1));
// Output: "1"
console.log(formatter.format(1.5));
// Output: "1.5"
console.log(formatter.format(1.50));
// Output: "1.5"
console.log(formatter.format(1.23));
// Output: "1.23"
يعرض المنسق الأرقام الصحيحة بدون فاصلة عشرية، والأرقام ذات المنزلة العشرية الواحدة كما هي، ويزيل أي أصفار زائدة كانت ستظهر. لا تزال الأرقام مقربة إلى الحد الأقصى لعدد المنازل العشرية إذا تجاوزته.
تعيين حد أدنى أكبر من الصفر
يمكنك تعيين minimumFractionDigits على قيمة أكبر من الصفر مع السماح بإزالة الأصفار اللاحقة. يضمن هذا ظهور بعض المنازل العشرية على الأقل دائمًا، مع إزالة الأصفار بعد هذا الحد الأدنى.
const formatter = new Intl.NumberFormat("en-US", {
minimumFractionDigits: 1,
maximumFractionDigits: 3
});
console.log(formatter.format(1));
// Output: "1.0"
console.log(formatter.format(1.5));
// Output: "1.5"
console.log(formatter.format(1.50));
// Output: "1.5"
console.log(formatter.format(1.234));
// Output: "1.234"
console.log(formatter.format(1.2345));
// Output: "1.235"
يعرض الرقم 1 كـ 1.0 لأن الحد الأدنى هو منزلة عشرية واحدة. يعرض الرقم 1.5 كما هو. الرقم 1.50 تتم إزالة الصفر الزائد منه. الأرقام التي تحتوي على أكثر من 3 منازل عشرية يتم تقريبها إلى 3.
متى يتم الاحتفاظ بالأصفار الزائدة
احتفظ بالأصفار الزائدة عندما تحتاج إلى إظهار دقة متسقة عبر جميع الأرقام. هذا شائع للأسعار والمبالغ المالية والقياسات حيث يحمل عدد المنازل العشرية معنى.
// Prices should show consistent decimal places
const priceFormatter = new Intl.NumberFormat("en-US", {
style: "currency",
currency: "USD",
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
console.log(priceFormatter.format(5));
// Output: "$5.00"
console.log(priceFormatter.format(5.5));
// Output: "$5.50"
تستخدم منسقات العملات هذا النهج افتراضيًا. يعرض كلا المبلغين بالضبط بمنزلتين عشريتين، مما يجعلهما سهلي المقارنة ويعزز أن هذه قيم نقدية.
متى يجب إزالة الأصفار اللاحقة
قم بإزالة الأصفار اللاحقة عند عرض الإحصائيات أو النسب المئوية أو القياسات أو أي قيمة لا تضيف فيها الأصفار اللاحقة أي معلومات. يؤدي هذا إلى إنشاء مخرجات أكثر وضوحاً وسهولة في القراءة.
// Statistics look cleaner without trailing zeros
const statsFormatter = new Intl.NumberFormat("en-US", {
minimumFractionDigits: 0,
maximumFractionDigits: 2
});
console.log(`Average: ${statsFormatter.format(3.5)} items`);
// Output: "Average: 3.5 items"
console.log(`Total: ${statsFormatter.format(100)} items`);
// Output: "Total: 100 items"
// Percentages often work better without trailing zeros
const percentFormatter = new Intl.NumberFormat("en-US", {
style: "percent",
minimumFractionDigits: 0,
maximumFractionDigits: 1
});
console.log(percentFormatter.format(0.75));
// Output: "75%"
console.log(percentFormatter.format(0.755));
// Output: "75.5%"
تعرض الإحصائيات والنسب المئوية المنازل العشرية التي تحتاجها فقط. تظهر الأعداد الصحيحة بدون فواصل عشرية، وتظهر الأعداد ذات الأرقام العشرية المهمة بدون أصفار لاحقة غير ضرورية.
كيف تؤثر اللغة المحلية على عرض الأرقام العشرية
يختلف موضع الفاصلة العشرية وأحرف تجميع الأرقام حسب اللغة، لكن قواعد الأصفار اللاحقة تعمل بنفس الطريقة عبر جميع اللغات. يكون للخيارين minimumFractionDigits و maximumFractionDigits نفس التأثير بغض النظر عن اللغة التي تستخدمها.
const formatterEN = new Intl.NumberFormat("en-US", {
minimumFractionDigits: 0,
maximumFractionDigits: 2
});
const formatterDE = new Intl.NumberFormat("de-DE", {
minimumFractionDigits: 0,
maximumFractionDigits: 2
});
console.log(formatterEN.format(1234.5));
// Output: "1,234.5"
console.log(formatterDE.format(1234.5));
// Output: "1.234,5"
كلا المنسقين يزيلان الأصفار اللاحقة ويعرضان الرقم بمنزلة عشرية واحدة. الفرق هو أن تنسيق الإنجليزية الأمريكية يستخدم نقطة للفاصلة العشرية وفواصل للآلاف، بينما يستخدم التنسيق الألماني الاتفاقية المعاكسة.