CODEWITHSUNDEEP
javascriptscopefractions
ryanve
ryanve

Reputation: 52581

Convert Fraction String to Decimal?

I'm trying to create a javascript function that can take a fraction input string such as '3/2' and convert it to decimal—either as a string '1.5' or number 1.5

function ratio(fraction) {
    var fraction = (fraction !== undefined) ? fraction : '1/1',
    decimal = ??????????;
    return decimal;
});

Is there a way to do this?

Upvotes: 39

Views: 38007

Answers (19)

machineghost
machineghost

Reputation: 35821

With modern destructuring syntax, the best/safest answer can be simplified to:

const parseFraction = fraction => {
  const [numerator, denominator] = fraction.split('/').map(Number);
  return numerator / denominator;
}

// example
parseFraction('3/2'); // 1.5

In other words, split the faction by its / symbol, turn both resulting strings into numbers, then return the first number divided by the second ...

... all with only two (very readable) lines of code.

EDIT

The above assumes that for 1.5 you will only get 3/2 ... and not 1 1/2. But, as @Aro Parada noted in a comment, you might need to handle such whole numbers.

If so, you could use a very similar split-based approach, but with a reverse to handle the fact that we only sometimes have a whole number:

const parseFraction = fractionString => {
  const [fraction, wholeNumber = 0] = fractionString.trim().split(' ').reverse();
  const [numerator, denominator] = fraction.split('/').map(Number);
  return Number(wholeNumber) + numerator / denominator;
}

You might not even need the trim in there; strings like 1 1/2 will work even without it, but if you can have 1 1/2 you'll want to keep the trim.

Upvotes: 4

James Furey
James Furey

Reputation: 198

Function (ES6):

function fractionToDecimal(fraction) {
  return fraction
    .split('/')
    .reduce((numerator, denominator, i) =>
      numerator / (i ? denominator : 1)
    );
}

Function (ES6, condensed):

function fractionToDecimal(f) {
  return f.split('/').reduce((n, d, i) => n / (i ? d : 1));
}

Examples:

fractionToDecimal('1/2');     // 0.5
fractionToDecimal('5/2');     // 2.5
fractionToDecimal('1/2/2');   // 0.25
fractionToDecimal('10/5/10'); // 0.2
fractionToDecimal('0/1');     // 0
fractionToDecimal('1/0');     // Infinity
fractionToDecimal('cat/dog'); // NaN
fractionToDecimal('42');      // 42

Upvotes: 5

Ramkumar G
Ramkumar G

Reputation: 461

You can use eval() with regex to implement a secure method to calculate fraction

var input = "1/2";
return input.match(/^[0-9\/\.]+$/) != null ? eval(input) : "invalid number";

Upvotes: 1

Janine White
Janine White

Reputation: 499

I developed a function to convert a value using a factor that may be passed as a fraction of integers or decimals. The user input and conversion factor might not be in the correct format, so it checks for the original value to be a number, as well as that the conversion can be converted to a fraction assuming that /number means 1/number, or there are a numerator and a denominator in the format number/number.

/**
 * Convert value using conversion factor
 * @param {float} value - number to convert
 * @param {string} conversion - factor
 * @return {float} converted value
 */
function convertNumber(value, conversion) {
  try {
    let numberValue = eval(value);
    if (isNaN(numberValue)) {
      throw value + " is not a number.";
    }
    let fraction = conversion.toString();
    let divider = fraction.indexOf("/");
    let upper = 1;
    let denominator = 1;
    if (divider == -1) {
      upper = eval(fraction);
    } else {
      let split = fraction.split("/");
      if (split.length > 2) {
        throw fraction + " cannot be evaluated to a fraction.";
      } else {
        denominator = eval(split[1]);
        if (divider > 0) {
          upper = eval(split[0]);
        }
      }
    }
    let factor = upper/denominator;
    if (isNaN(factor)) {
      throw fraction + " cannot be converted to a factor.";
    }
    let result = numberValue * factor;
    if (isNaN(result)) {
      throw numberValue + " * " + factor + " is not a number.";
    }
    return result
  } catch (err) {
    let message = "Unable to convert '" + value + "' using '" + conversion + "'. " + err;
    throw message;
  }
}

Upvotes: 1

Christopher Fahey
Christopher Fahey

Reputation: 36

From a readability, step through debugging perspective, this may be easier to follow:

// i.e. '1/2' -> .5
// Invalid input returns 0 so impact on upstream callers are less likely to be impacted
function fractionToNumber(fraction = '') {
    const fractionParts = fraction.split('/');
    const numerator = fractionParts[0] || '0';
    const denominator = fractionParts[1] || '1';
    const radix = 10;
    const number = parseInt(numerator, radix) / parseInt(denominator, radix);
    const result = number || 0;

    return result;
}

Upvotes: 2

nonopolarity
nonopolarity

Reputation: 151166

const fractionStringToNumber = s => s.split("/").map(s => Number(s)).reduce((a, b) => a / b);

console.log(fractionStringToNumber("1/2"));
console.log(fractionStringToNumber("1/3"));
console.log(fractionStringToNumber("3/2"));
console.log(fractionStringToNumber("3/1"));
console.log(fractionStringToNumber("22/7"));
console.log(fractionStringToNumber("355 / 113"));
console.log(fractionStringToNumber("8/4/2"));

console.log(fractionStringToNumber("3")); // => 3, not "3"

Upvotes: 2

Muks123
Muks123

Reputation: 19

This too will work:

let y = "2.9/59"
let a = y.split('')
let b = a.splice(a.indexOf("/"))
console.log(parseFloat(a.join('')))
a = parseFloat(a.join(''))
console.log(b)
let c = parseFloat(b.slice(1).join(''))
let d = a/c
console.log(d) // Answer for y fraction

Upvotes: 1

AverageChau
AverageChau

Reputation: 103

safer eval() according to MDN

const safeEval = (str) => {
   return Function('"use strict";return (' + str + ")")();
}

safeEval("1 1/2") // 1.5

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval#Do_not_ever_use_eval!

Upvotes: 1

Canis
Canis

Reputation: 4430

Also a bit late to the party, but an alternative to eval() with less security issues (according to MDN at least) is the Function() factory.

var fraction = "3/2";
console.log( Function("return (" + fraction + ");")() );

This would output the result "1.5" in the console.

Also as a side note: Mixed fractions like 1 1/2 will not work with neither eval() nor the solution with Function() as written as they both stumble on the space.

Upvotes: 1

E-comm
E-comm

Reputation: 106

I created a nice function to do just that, everything was based off of this question and answers but it will take the string and output the decimal value but will also output whole numbers as well with out errors

https://gist.github.com/drifterz28/6971440

function toDeci(fraction) {
    fraction = fraction.toString();
    var result,wholeNum=0, frac, deci=0;
    if(fraction.search('/') >=0){
        if(fraction.search('-') >=0){
            wholeNum = fraction.split('-');
            frac = wholeNum[1];
            wholeNum = parseInt(wholeNum,10);
        }else{
            frac = fraction;
        }
        if(fraction.search('/') >=0){
            frac =  frac.split('/');
            deci = parseInt(frac[0], 10) / parseInt(frac[1], 10);
        }
        result = wholeNum+deci;
    }else{
        result = fraction
    }
    return result;
}

/* Testing values / examples */
console.log('1 ',toDeci("1-7/16"));
console.log('2 ',toDeci("5/8"));
console.log('3 ',toDeci("3-3/16"));
console.log('4 ',toDeci("12"));
console.log('5 ',toDeci("12.2"));

Upvotes: 7

Fabricio Mendonça
Fabricio Mendonça

Reputation: 71

Too late, but can be helpful:

You can use Array.prototype.reduce instead of eval https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

ES6

const fractionStrToDecimal = str => str.split('/').reduce((p, c) => p / c);
console.log(fractionStrToDecimal('1/4/2')); // Logs 0.125
console.log(fractionStrToDecimal('3/2')); // Logs 1.5

CJS

function fractionStrToDecimal(str) {
  return str.split('/').reduce((p, c) => p / c);
}
console.log(fractionStrToDecimal('1/4')); // Logs 0.25

[EDIT] Removed reducer initial value and now the function works for numerators greater than 1. Thanks, James Furey.

Upvotes: 6

Alfred Waligo
Alfred Waligo

Reputation: 2909

If you don't mind using an external library, math.js offers some useful functions to convert fractions to decimals as well as perform fractional number arithmetic.

console.log(math.number(math.fraction("1/3"))); //returns 0.3333333333333333
console.log(math.fraction("1/3") * 9) //returns 3
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/3.20.1/math.js"></script>

Upvotes: 2

Robert Eisele
Robert Eisele

Reputation: 115

If you want to use the result as a fraction and not just get the answer from the string, a library like https://github.com/infusion/Fraction.js would do the job quite well.

var f = new Fraction("3/2");
console.log(f.toString()); // Returns string "1.5"
console.log(f.valueOf()); // Returns number 1.5

var g = new Fraction(6.5).div(.5);
console.log(f.toString()); // Returns string "13"

Upvotes: 1

Jake Boone
Jake Boone

Reputation: 1380

I have a function I use to handle integers, mixed fractions (including unicode vulgar fraction characters), and decimals. Probably needs some polishing but it works for my purpose (recipe ingredient list parsing).

Inputs "2 1/2", "2½", "2 ½", and "2.5" will all return 2.5. Examples:

var numQty = require("numeric-quantity");

numQty("1 1/4") === 1.25;  // true
numQty("3 / 4") === 0.75;  // true
numQty("¼" ) === 0.25;     // true
numQty("2½") === 2.5;      // true
numQty("¾") === 0.75;      // true
numQty("⅓") === 0.333;     // true
numQty("⅔") === 0.667;     // true

One thing it doesn't handle is decimals within the fraction, e.g. "2.5 / 5".

Upvotes: 10

Kaloyan Stamatov
Kaloyan Stamatov

Reputation: 4024

It works with eval() method but you can use parseFloat method. I think it is better! Unfortunately it will work only with that kind of values - "12.2" not with "5/8", but since you can handle with calculation I think this is good approach!

Upvotes: 1

DDPWNAGE
DDPWNAGE

Reputation: 21

To convert a fraction to a decimal, just divide the top number by the bottom number. 5 divided by 3 would be 5/3 or 1.67. Much like:

function decimal(top,bottom) {
    return (top/bottom)
}

Hope this helps, haha

Upvotes: 1

user415715
user415715

Reputation:

Since no one has mentioned it yet there is a quick and dirty solution:

var decimal = eval(fraction);

Which has the perks of correctly evaluating all sorts of mathematical strings. 

eval("3/2")    // 1.5
eval("6")      // 6
eval("6.5/.5") // 13, works with decimals (floats)
eval("12 + 3") // 15, you can add subtract and multiply too

People here will be quick to mention the dangers of using a raw eval but I submit this as the lazy mans answer.

Upvotes: 56

Coomie
Coomie

Reputation: 4868

Something like this:

bits = fraction.split("/");
return parseInt(bits[0],10)/parseInt(bits[1],10);

Upvotes: 7

Matt Greer
Matt Greer

Reputation: 62057

Here is the bare bones minimal code needed to do this:

var a = "3/2";
var split = a.split('/');
var result = parseInt(split[0], 10) / parseInt(split[1], 10);
alert(result); // alerts 1.5

JsFiddle: http://jsfiddle.net/XS4VE/

Things to consider:

  • division by zero
  • if the user gives you an integer instead of a fraction, or any other invalid input
  • rounding issues (like 1/3 for example)

Upvotes: 23

Related Questions