Discover the position within a two-dimensional array

Question

Discover the position within a two-dimensional array

Suppose I have an array that contains objects, and each object has its own id property. In this case, I can find the index by writing:

data.findIndex(x=>x.id === newData.id);

Now, if data is an array of arrays of objects, how can I efficiently get two indexes for this data structure? Meaning that data.findIndex would return both i and j conveniently.

javascript arrays ecmascript-6

Answer 1

Answer №1

To check for specific values in an array, you can utilize Array.includes within the findIndex method.

var data = [
  [1,2,3],
  [4,5,6],
  [7,8,9]
]
var searchParam = 8;
var index = data.findIndex(x=>x.includes(searchParam))
console.log(index)

If dealing with arrays of nested objects, recursion comes in handy to search through them.

var data = [
  [{id: 1},{id: 2},{id: 3}],
  [{id: 4},{id: 5},{id: 6}],
  [{id: 7},{id: 8},{id: 9}]
]
var searchValue = 8;
var index = data.findIndex(x=>{
  return searchInObject(x, searchValue);
})

function searchInObject(obj, searchValue){
  var _s = JSON.stringify(obj);
  if(_s.indexOf(searchValue)>-1){
     if(Array.isArray(obj)){
       return obj.some(function(o){
         if(searchInObject(o, searchValue)) return true;
       });
     }
    else if(typeof(obj) === 'object'){
      for(var k in obj){
        if(searchInObject(obj[k], searchValue)) return true;
      }
    }
    else{
      if(obj === searchValue) return true;
    }
  }
}
console.log(index)

Answer 2

To check for specific values in an array, you can utilize Array.includes within the findIndex method.

var data = [
  [1,2,3],
  [4,5,6],
  [7,8,9]
]
var searchParam = 8;
var index = data.findIndex(x=>x.includes(searchParam))
console.log(index)

If dealing with arrays of nested objects, recursion comes in handy to search through them.

var data = [
  [{id: 1},{id: 2},{id: 3}],
  [{id: 4},{id: 5},{id: 6}],
  [{id: 7},{id: 8},{id: 9}]
]
var searchValue = 8;
var index = data.findIndex(x=>{
  return searchInObject(x, searchValue);
})

function searchInObject(obj, searchValue){
  var _s = JSON.stringify(obj);
  if(_s.indexOf(searchValue)>-1){
     if(Array.isArray(obj)){
       return obj.some(function(o){
         if(searchInObject(o, searchValue)) return true;
       });
     }
    else if(typeof(obj) === 'object'){
      for(var k in obj){
        if(searchInObject(obj[k], searchValue)) return true;
      }
    }
    else{
      if(obj === searchValue) return true;
    }
  }
}
console.log(index)

Answer 3

Answer №2

Here is a unique approach to creating a recursive find index function using Array.prototype.reduce() that can navigate through multiple levels of nesting:

const recursiveFindIndex = (data, id) =>
  data.reduce((indexes, item, index) => {
    let subIndex;

    Array.isArray(item) && (subIndex = recursiveFindIndex(item, id));

    if (subIndex && subIndex.length) {
      return indexes.concat([index], subIndex);
    }

    item.id === id && (indexes.push(index));

    return indexes;
  }, []);

const data = [
  { id: 0 },
  [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }],
  [{ id: 6 }, { id: 7 }, { id: 8 }, { id: 9 }, [
    { id: 10 }, { id: 11 }, { id: 12 }, { id: 13 }, { id: 14 }]
  ]
];

console.log('id: 3', recursiveFindIndex(data, 0));
console.log('id: 3', recursiveFindIndex(data, 3));
console.log('id: 6', recursiveFindIndex(data, 8));
console.log('id: 12', recursiveFindIndex(data, 12));
console.log('id: 3', recursiveFindIndex(data, 20));

Additionally, a more efficient version is presented here which terminates the search once a match is found by utilizing a for loop:

const recursiveFindIndex = (arr, predicate) => {
  let subIndex;
  
  for(let i = 0; i < arr.length; i++) {
    if(Array.isArray(arr[i])) {
      subIndex = recursiveFindIndex(arr[i], predicate);
      
      if(subIndex !== -1) {
        return [i].concat(subIndex);
      }
    } else if(predicate(arr[i])) {
      return [i];
    }
  }

  return -1;
};

const data = [
  { id: 0 },
  [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }],
  [{ id: 6 }, { id: 7 }, { id: 8 }, { id: 9 }, [
    { id: 10 }, { id: 11 }, { id: 12 }, { id: 13 }, { id: 14 }]
  ]
];

console.log('id: 0', recursiveFindIndex(data, (item) => item.id === 0));
console.log('id: 3', recursiveFindIndex(data, (item) => item.id === 3));
console.log('id: 6', recursiveFindIndex(data, (item) => item.id === 8));
console.log('id: 12', recursiveFindIndex(data, (item) => item.id === 12));
console.log('id: 20', recursiveFindIndex(data, (item) => item.id === 20));

Answer 4

Here is a unique approach to creating a recursive find index function using Array.prototype.reduce() that can navigate through multiple levels of nesting:

const recursiveFindIndex = (data, id) =>
  data.reduce((indexes, item, index) => {
    let subIndex;

    Array.isArray(item) && (subIndex = recursiveFindIndex(item, id));

    if (subIndex && subIndex.length) {
      return indexes.concat([index], subIndex);
    }

    item.id === id && (indexes.push(index));

    return indexes;
  }, []);

const data = [
  { id: 0 },
  [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }],
  [{ id: 6 }, { id: 7 }, { id: 8 }, { id: 9 }, [
    { id: 10 }, { id: 11 }, { id: 12 }, { id: 13 }, { id: 14 }]
  ]
];

console.log('id: 3', recursiveFindIndex(data, 0));
console.log('id: 3', recursiveFindIndex(data, 3));
console.log('id: 6', recursiveFindIndex(data, 8));
console.log('id: 12', recursiveFindIndex(data, 12));
console.log('id: 3', recursiveFindIndex(data, 20));

Additionally, a more efficient version is presented here which terminates the search once a match is found by utilizing a for loop:

const recursiveFindIndex = (arr, predicate) => {
  let subIndex;
  
  for(let i = 0; i < arr.length; i++) {
    if(Array.isArray(arr[i])) {
      subIndex = recursiveFindIndex(arr[i], predicate);
      
      if(subIndex !== -1) {
        return [i].concat(subIndex);
      }
    } else if(predicate(arr[i])) {
      return [i];
    }
  }

  return -1;
};

const data = [
  { id: 0 },
  [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 4 }, { id: 5 }],
  [{ id: 6 }, { id: 7 }, { id: 8 }, { id: 9 }, [
    { id: 10 }, { id: 11 }, { id: 12 }, { id: 13 }, { id: 14 }]
  ]
];

console.log('id: 0', recursiveFindIndex(data, (item) => item.id === 0));
console.log('id: 3', recursiveFindIndex(data, (item) => item.id === 3));
console.log('id: 6', recursiveFindIndex(data, (item) => item.id === 8));
console.log('id: 12', recursiveFindIndex(data, (item) => item.id === 12));
console.log('id: 20', recursiveFindIndex(data, (item) => item.id === 20));

Answer 5

Answer №3

Is this the kind of approach you had in mind?

While it may not be the most sleek solution, it does get the job done:

const updatedData = { id: 2 };
const dataSet = [[{id: 5}, {id: 2}], [{id: 7}, {id: 8}]];

dataSet.reduce((result, array, index) => {
  let position = array.findIndex(item => item.id === updatedData.id);

  if (~position) {
    return [index, position];
  }

  return result;
}, [-1, -1]);

Answer 6

Is this the kind of approach you had in mind?

While it may not be the most sleek solution, it does get the job done:

const updatedData = { id: 2 };
const dataSet = [[{id: 5}, {id: 2}], [{id: 7}, {id: 8}]];

dataSet.reduce((result, array, index) => {
  let position = array.findIndex(item => item.id === updatedData.id);

  if (~position) {
    return [index, position];
  }

  return result;
}, [-1, -1]);

Answer 7

Answer №4

Here is an example utilizing the reduce method:

const items = [
    [{ id: 1 }, { id: 4 }],
    [{ id: 2}, { id: 3 }]
]

const searchId = (items, id) => 
  items.reduce((prev, curr, index) => {
    let result = curr.findIndex(x => x.id === id);
    if(result > -1){
        prev = { index, result }
    }
    return prev;
  }, { index: -1, result: -1 });

Check out this demo on JSFiddle

Answer 8

Here is an example utilizing the reduce method:

const items = [
    [{ id: 1 }, { id: 4 }],
    [{ id: 2}, { id: 3 }]
]

const searchId = (items, id) => 
  items.reduce((prev, curr, index) => {
    let result = curr.findIndex(x => x.id === id);
    if(result > -1){
        prev = { index, result }
    }
    return prev;
  }, { index: -1, result: -1 });

Check out this demo on JSFiddle

Discover the position within a two-dimensional array

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Guide to displaying API data in HTML format

Managing multiple carousels simultaneously using the middle mouse button in Swiper.js

Alert: A notification appears when executing Karma on grunt stating that 'The API interface has been updated'

Stop the child component from activating the parent's onClick event

Splitting a string in Typescript based on regex group that identifies digits from the end

Removing characters from a string with regular expressions

Retrieve the outer-HTML of an element when it is clicked

Refresh Chart Information using Ng2-Charts in Charts.js

How can methods access variables from the Vuex store during function calls?

"Interactive table feature allowing for scrolling, with anchored headers and columns, as well as the option to fix

Changing state property upon clicking child element in React is not feasible

execute the execCommand function following an ajax request

The trio of Angular, jQuery, and Chrome extensions is a powerful

JSON function invocation is failing to load

Is it possible to use Koajs without needing to include the --harmony tag?

Node.js process.exec() function allows you to asynchronously spawn a subprocess

Is there a way to retrieve the headers from an HTTP response in JavaScript that wasn't initiated by an AJAX request?

Tips for showing/hiding textboxes based on select options:

Can an HTML DIV be resized along with its contents?

Using Angular as a template engine: A simple guide