AngularJS Tutorial: Storing the Index Position of a JSON Object without Saving the Object Itself

Question

AngularJS Tutorial: Storing the Index Position of a JSON Object without Saving the Object Itself

My JSON data is as follows:

$scope.myjson = [
                   {id: "1", name: "a"},
                   {id: "2", name: "b"},
                   {id: "3", name: "c", children: [{id: "4", name: "d"}]}
               ];

I am looking to store the position of object X in JavaScript, such as the first object at $scope.myjson[0], without saving the actual object itself. Similarly, I want to save $scope.myjson[2].children[0].

Should I save it as a string? How can I retrieve that object in O(1) time once saved?

javascript arrays angularjs arraylist

Answer 1

Answer №1

What is the benefit of saving the position of an object rather than the object itself?

If you want to store objects based on an id for quick retrieval, you can use a method like the one suggested below (not tested):

var find = (function() {
    var cache = {}, fn; 

    return fn = function(/*array*/ arr, id) {
       if(cache[id]) return cache[id];
       for(var i=0; i < arr.length; i++) {
          if(arr[i].id === id) 
             return (cache[id] = arr[i]);
          if(arr[i].children && val = fn(arr[i].children, id)) 
             return (cache[id] = val);
       }

       return null;
    }
})();

This method allows subsequent calls to find to fetch the cached object quickly. Depending on the array size and lookup frequency, iterating over it once to create a hash map of id => object could also be efficient.

Answer 2

What is the benefit of saving the position of an object rather than the object itself?

If you want to store objects based on an id for quick retrieval, you can use a method like the one suggested below (not tested):

var find = (function() {
    var cache = {}, fn; 

    return fn = function(/*array*/ arr, id) {
       if(cache[id]) return cache[id];
       for(var i=0; i < arr.length; i++) {
          if(arr[i].id === id) 
             return (cache[id] = arr[i]);
          if(arr[i].children && val = fn(arr[i].children, id)) 
             return (cache[id] = val);
       }

       return null;
    }
})();

This method allows subsequent calls to find to fetch the cached object quickly. Depending on the array size and lookup frequency, iterating over it once to create a hash map of id => object could also be efficient.

AngularJS Tutorial: Storing the Index Position of a JSON Object without Saving the Object Itself

Answer №1

Similar questions

Converting to alphanumeric characters using JavaScript

Guide on integrating a jQuery method for validating a value using regular expressions

Issue with API delivering zip file - Headers cannot be modified after being sent to the client

Error: Unexpected character 'o' encountered in AngularJS syntax

Error encountered during file download with AXIOS: TypeError - 'validateStatus' in blob cannot be searched using 'in' operator

Encountering difficulties in compiling Dynamic HTML with the $compile function

Why Next.js and MongoDB (minus Mongoose) is giving back an empty array

Automatically navigate to the bottom of the page by applying the overflow auto feature

jQuery Mobile persists in loading the initial page of a multi-page document after form submission

The equation of jquery plus ie7 results in an undefined value

How can I efficiently utilize HTML/CSS/JS to float items and create a grid that accommodates expandable items while minimizing wasted space?

Having issues with passing POST data during file handling operations

Error message in development mode: Next.js Unhandled Runtime Error "Failed to load script: /_next/static/chunks/..."

Refresh two angular-datatables

Discover the initial or subsequent location of a specific value within an array

I am setting up two data picker fields: the first one should display the date as 01/01/2022, while the second field should show today's date

Error occurs when contacting ASP.NET Web API from AngularJS

Combining Two JSON Arrays Featuring Unique Keys

Master your code with Rxjs optimization

Vue's reactivity in Vue 3 is exhibiting strange behavior with boolean data