flatmap using an array

[laurencefass]

i'm trying to wrap my head around around flatmaps. In the array example at https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/selectmany.md what is y and where does it come from?

/* Using an array */
var source = Rx.Observable.of(1,2,3)
.flatMap(
function (x, i) { return [x,i]; },
function (x, y, ix, iy) { return x + y + ix + iy; }
);

note i changed the output of the original code to ease understanding of the pushed data. my subscription callback looks like this now.

var subscription = source.subscribe(
function (x) {
trace('Next: x = ' + x.x + " y = " + x.y + " ix = " + x.ix + " iy = " + x.iy);
},
function (err) {
trace('Error: ' + err);
},
function () {
trace('Completed');
}
);

my result like this:

Next: x = 1 y = 1 ix = 0 iy = 0
Next: x = 1 y = 0 ix = 0 iy = 1
Next: x = 2 y = 2 ix = 1 iy = 0
Next: x = 2 y = 1 ix = 1 iy = 1
Next: x = 3 y = 3 ix = 2 iy = 0
Next: x = 3 y = 2 ix = 2 iy = 1

a plain english explanation of the result, and an explanation of the derivation of y would be very useful. Thank you, Laurence

[xgrommx]

Hello @laurencefass. Do you want that someone explain about Rx.Observable.flatMap?

[laurencefass]

i understand the other examples (range and promise) but the array example above not so obvious so really seeking an explanation of this specific example. knowing where y came from will help Im sure.

[xgrommx]

@laurencefass sorry but I don't understand what do u mean =(

[laurencefass]

where did y come from in this example as it was not specified in the observable?

var subscription = source.subscribe(
function (x) {
trace('Next: x = ' + x.x + " y = " + x.y + " ix = " + x.ix + " iy = " + x.iy);
},

[xgrommx]

@laurencefass I had created example from documentation and I got that expected http://jsbin.com/rureku/1/edit?js,console

[laurencefass]

i also get the same result. my question is: how is y derived from x and i?

[xgrommx]

Also u can use this book http://xgrommx.github.io/rx-book/content/core_objects/observable/observable_instance_methods/flatmap.html which has interactive redactor based on jsbin.

[xgrommx]

Maybe it help u https://github.com/Reactive-Extensions/RxJS/blob/master/src/core/linq/observable/selectmany.js#L38

[xgrommx]

Also that https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/selectmany.md#arguments (look on resultSelector)

[laurencefass]

thank you for your help xgrommx. ill read all material.

[xgrommx]

@laurencefass I did helped you?)

[laurencefass]

i still havent answered the question "what is 'y' and how is it derived?"...

[xgrommx]

@laurencefass I think flatMap in resultSelector to put previous and current value.

[paulpdaniels]

@laurencefass @xgrommx the second callback function in selectmany is called for each value of each inner sequence.

For instance:

//I picked some values so their powers wouldn't overlap
Rx.Observable.from([2, 3, 5])
.selectMany(function(outer) {
  //Receives:
  //2 -> [4, 8, 16]
  //3 -> [9, 27, 81]
  //5 -> [25, 225, 625]

  //Return x^2, x^3 and x^4
  return [x * x, 
             x * x * x, 
             x * x * x * x];
},
function(outer, inner, outerIndex, innerIndex)
{
  return { outer : outer, inner : inner };
}
).subscribe(function(next) {

  console.log('Outer: ' + next.outer + ' Inner: ' + next.inner);
});


//Output
//Outer: 2, Inner: 4
//Outer: 2, Inner: 8
//Outer: 2, Inner: 16
//Outer: 3, Inner: 9
//Outer: 3, Inner: 27
//Outer: 3, Inner: 81
//...etc

You can also think of it as a nested for-loop

var outer= [2, 3, 5];
var result = [];
for (var i = 0; i < outer.length; ++i) {
  var x = outer[i];
  var inner = [x * x, x * x *x, x * x * x * x];
  for (var j = 0; j < inner.length; ++j) {
    result.push({ outer : outer[i], inner : inner[j] });
  }
}

//Will have the same output as above (unless I made some typos).
result.forEach(function(next) {
  console.log('Outer: ' + next.outer + ' Inner: ' + next.inner);
});

[laurencefass]

clarity. much better example. thanks.