首先要实现分数形式显示，要懂得几个重点原理

1 最大公约数
最大公因数，也称最大公约数、最大公因子，指两个或多个整数共有约数中最大的一个。a，b的最大公约数记为（a，b），同样的，a，b，c的最大公约数记为（a，b，c），多个整数的最大公约数也有同样的记号。

2 求最大公约数的几个算法
求最大公约数有多种方法，常见的有质因数分解法、短除法、辗转相除法、更相减损法。与最大公约数相对应的概念是最小公倍数，a，b的最小公倍数记为[a，b]。

选个算法用js实现

上述的方法中 资料最多实现最简单的就是 辗转相除法

辗转相除法(又名欧几里德算法😎)

原理

用较小数除较大数，再用出现的余数（第一余数）去除除数，再用出现的余数（第二余数）去除第一余数，如此反复，直到最后余数是0为止。求两个数的最大公约数，最后的除数就是这两个数的最大公约数。

欧几里德算法示意图

JavaScript实现

Fraction.js

var Fraction = {
    a : 0,
    b : 0,
    d : "",
    e : 0,
    fraction : function(num1, num2) {
        Fraction.a=num1; 
        Fraction.b=num2;
        Fraction.appointment();
    },
    gcd : function(a, b) { //欧几里德算法
        return b==0? a: Fraction.gcd(b,a%b);
    },
    appointment : function() { // 约分操作
        if (Fraction.a == 0 || Fraction.b == 1) return; // 如果分子是0或分母是1就不用约分了
        Fraction.e = Fraction.gcd(Fraction.a,Fraction.b);
        Fraction.a /= Fraction.e;
        Fraction.b /= Fraction.e;
    },
    toFraction : function(){
        Fraction.d = Fraction.a+"/"+Fraction.b;
    }

};

test.js直接在Chrome浏览器里就可运行

//引入代码
document.scripts[0].src="Fraction.js"
Fraction.fraction(2,4);
Fraction.toFraction()
console.log(Fraction.d)
结果
1/2

Snippets 示意图

本文部分文字直接复制的百度百科，仅作了解🙂，要是文章有不对的地方，欢迎大家在评论区指正，后面可能会写其他方式的实现方法。