使地图中的函数无点

时间:2019-10-11 04:25:47

标签: javascript functional-programming

我遇到这样的情况:

const fun = (x,y) => fun1(fun2(x,y), fun3(x,y), fun4(x,y));
const a = [ 1, 2, 3, 4 ].map(fun);

我到处都看到xy。有什么办法可以做到这一点?

更新:

现实生活中的示例:

data.map((gist, index) =>
  ifElse(
    checkForSingleFile(gist, index),
    toGistFile(gist, index),
    toGistFolder(gist, index)
  )
);

我正在使用Ramda的IfElse

2 个答案:

答案 0 :(得分:1)

您可以将参数传递给ifElse,因为它返回apt函数,该函数将具有toGistFiletoGistFolder的参数,这两种情况在您的情况下是相同的:< / p>

const {
  ifElse
} = R;

const data = [1, 2, 3, 4];

const checkForSingleFile = () => {
  return Math.random() > 0.5;
}

const toGistFile = (gist, index) => {
  console.log('file');
  //return function(gist, index) {};
}

const toGistFolder = (gist, index) => {
  console.log('folder');
  //return function(gist, index) {};
}

data.map(
  ifElse(
    checkForSingleFile,
    toGistFile,
    toGistFolder
  )
);
<script src="//cdn.jsdelivr.net/npm/ramda@0.25/dist/ramda.min.js"></script>

答案 1 :(得分:0)

好吧,第一个片段向您展示如何使用Vanilla JS:

const compose = (points, fns) => {
  let output = points;
  points.map( (p,i) => {
    fns.map( fn => output[i] = fn(output[i]) );
  });
  return output;
}

const funA = ({x,y}) => ({x: x*2, y: y*2});
const funB = ({x,y}) => ({x: x*2, y: y*2});
const sqrt = ({x,y}) => ({x: Math.sqrt(x), y: Math.sqrt(y)});

const points = [{x:1, y:1}, {x:2, y:2}];

const res = compose(points, [funA, funB, sqrt]); // sqrt(funB(funA(points))) = funA ¤ funB ¤ sqrt

console.log(res);

现在有了一个专为函数编写而设计的库(ramda.js):

const funA = ({x,y}) => ({x: x*2, y: y*2});
const funB = ({x,y}) => ({x: x*2, y: y*2});
const sqrt = ({x,y}) => ({x: Math.sqrt(x), y: Math.sqrt(y)});

const points = [{x:1, y:1}, {x:2, y:2}];
const curryFun = R.compose(sqrt, funA, funB);
const resCurry = points.map( curryFun );

console.log(resCurry);
<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.26.1/ramda.min.js" integrity="sha256-43x9r7YRdZpZqTjDT5E0Vfrxn1ajIZLyYWtfAXsargA=" crossorigin="anonymous"></script>

实用EG:

在这里,我给出一个有关2D函数的示例,我们有一个直线空间abscicca,我们想绘制组成的fn:

// declare fn

const lin = x => x * 1.2 + 0.9;
const sin = x => Math.sin(x);
const cos = x => Math.cos(x);

// set the linspace

const linspace = [...new Array(50)].map((val,i) => i/10 );

// set the composed fn

const composed = R.compose(lin, sin, cos);
// we can write : composed = R.compose(lin, Math.sin, Math.cos)

// graph

var ctx = document.getElementById("myChart");
var data = {
	labels: linspace,
    datasets: [{
        label: "lin",
        function: lin,
        borderColor: "rgba(75, 192, 192, 1)",
        data: [],
        fill: false
    },
    {
        label: "sin",
        function: sin,
        borderColor: "rgba(153, 102, 255, 1)",
        data: [],
        fill: false
    },
    {
        label: "cos",
        function: cos,
        borderColor: "rgba(255, 206, 86, 1)",
        data: [],
        fill: false
    },
    {
        label: "composed",
        function: composed,
        borderColor: "rgba(255, 106, 86, 1)",
        data: [],
        fill: false
    }
    ]
};

Chart.pluginService.register({
    beforeInit: function(chart) {
        var data = chart.config.data;
        for (var i = 0; i < data.datasets.length; i++) {
            for (var j = 0; j < data.labels.length; j++) {
            	var fct = data.datasets[i].function,
                	x = data.labels[j],
                	y = fct(x);
                data.datasets[i].data.push(y);
            }
        }
    }
});

var myBarChart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});
   <script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.26.1/ramda.min.js" integrity="sha256-43x9r7YRdZpZqTjDT5E0Vfrxn1ajIZLyYWtfAXsargA=" crossorigin="anonymous"></script>
   
   <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js" integrity="sha256-Uv9BNBucvCPipKQ2NS9wYpJmi8DTOEfTA/nH2aoJALw=" crossorigin="anonymous"></script>
   
   <canvas id="myChart"></canvas>