Как разобрать простые математические выражения, используя две переменные в JavaScript - PullRequest
0 голосов
/ 03 июня 2018

Я делаю проект для решения методов Рунге-Кутты (числовые методы)

Мне нужно проанализировать простые математические выражения с двумя переменными из входного текста и вставить в код js

ДляНапример, это один из методов:

var x = 1, // this is the firt variable
    y = 2, // this is the second variable
    yn, fun, h = 0.05;


var i = 0;

// This is Euler method
while (x < 2) {

    i += 1;
    // this is the funcion and depends to two variables
    //here is when I need to paste the function using global variables
    fun = ((1 + x) / (1 + y));
    yn = y + h * (fun);
    console.log(" # " + i + " Yn+1 = " + yn + " Yn = " + y + " x = " + x + "\n");
    x += h;
    y = yn;

}

Это моя идея для HTML, это только дизайн:

Мне нужно взять значение во входном тексте и проанализировать его в коде js

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>

    <link href="style.css" rel="stylesheet">
    <title>Document</title>
</head>

<body>
    <div class="container">
        <div class="col-lg-4 col-lg-offset-4">
            <h1 class="text-center">Runge-Kutta Methods</h1>
            <p class="text-center">Enter the function in the terms of X and Y:</p>
            <p class="help"></p>
            <input type="text" value="((1 + x) / (1 + y))" id="input" class="form-control" />
            <table class="table">
                <thead>

                </thead>
                <tbody id="tbody">
                        <tr>
                                <th>
                                    <p class="text-center">H:</p>
                                    <input type="number" value="H" id="input" class="form-control" />
                                </th>
                                <th>
                                    <p class="text-center">X:</p>
                                    <input type="number" value="X" id="input" class="form-control" />
                                </th>
                                <th>
                                    <p class="text-center">f(X):</p>
                                    <input type="number" value="Y" id="input" class="form-control" />
                                </th>
                            </tr>

                </tbody>
            </table>


            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default">Euler</button>
                </div>
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default">Euler improved</button>
                </div>
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default">Ralston</button>
                </div>
              </div>

              <br>

            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>Yn+1</th>
                        <th>Yn</th>
                        <th>X</th>
                    </tr>
                </thead>
                <tbody id="tbody">

                </tbody>
            </table>

            <script src="main.js"></script>
</body>

</html>

1 Ответ

0 голосов
/ 28 июня 2018

Если вы хотите разобрать простые математические выражения, вы должны использовать <script src="http://silentmatt.com/parser3.js"></script>, затем вы можете заменить свои 'x' и 'y' и использовать функцию, которую вы написали во входных данных.

Я использовал ваш пример, чтобы вычислить результат функции при нажатии на кнопку «эйлер». onclick

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
    <script src="http://silentmatt.com/parser3.js"></script>
    <script>
    var x = 1, // this is the firt variable
    y = 2, // this is the second variable
    yn, fun, h = 0.05;


    var i = 0;

    // This is Euler method
    while (x < 2) {

        i += 1;
        // this is the funcion and depends to two variables
        //here is when I need to paste the function using global variables
        fun = ((1 + x) / (1 + y));
        yn = y + h * (fun);
        console.log(" # " + i + " Yn+1 = " + yn + " Yn = " + y + " x = " + x + "\n");
        x += h;
        y = yn;

    }
    function euler(){
        var parser = new Parser();
        //parser.parse("2 * func(2; 2)").evaluate({ func:Math.pow });
        var x = document.getElementById("inputx").value;//'1'; //parseInt(document.getElementById("inputx").value);
        var y = document.getElementById("inputy").value;

        var fun = document.getElementById("fun").value;
            fun=fun.replace('x',x);
            fun=fun.replace('y',y);
            var result = parser.parse(fun).evaluate();
        document.getElementById("res").innerHTML="resultat : "+result;
        console.log(result);
    }
    </script>

    <link href="style.css" rel="stylesheet">
    <title>Document</title>
</head>

<body>
    <div class="container">
        <div class="col-lg-4 col-lg-offset-4">
            <h1 class="text-center">Runge-Kutta Methods</h1>
            <p class="text-center">Enter the function in the terms of X and Y:</p>
            <p class="help"></p>
            <input type="text" id="fun" value="((1 + x) / (1 + y))" id="input" class="form-control" />
            <table class="table">
                <thead>

                </thead>
                <tbody id="tbody">
                        <tr>
                                <th>
                                    <p class="text-center">H:</p>
                                    <input type="number" value="0" id="inputh" class="form-control" />
                                </th>
                                <th>
                                    <p class="text-center">X:</p>
                                    <input type="number" value="0" id="inputx" class="form-control" />
                                </th>
                                <th>
                                    <p class="text-center">f(X):</p>
                                    <input type="number" value="0" id="inputy" class="form-control" />
                                </th>
                            </tr>

                </tbody>
            </table>


            <div class="btn-group btn-group-justified" role="group" aria-label="...">
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default" onclick="euler()">Euler</button>
                </div>
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default">Euler improved</button>
                </div>
                <div class="btn-group" role="group">
                  <button type="button" class="btn btn-default">Ralston</button>
                </div>
              </div>

              <br>

            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>Yn+1</th>
                        <th>Yn</th>
                        <th>X</th>
                    </tr>
                </thead>
                <tbody id="tbody">

                </tbody>
            </table>
            <div id="res"></div>

            <script src="main.js"></script>
</body>

</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...