Adjusting an item according to a specified pathway

Question

Adjusting an item according to a specified pathway

I am currently working on dynamically modifying an object based on a given path, but I am encountering some difficulties in the process. I have managed to create a method that retrieves values at a specified path, and now I need to update values at that path. The length of the path should not be a limiting factor, so using prop.prop.prop.prop should still work. For instance:

let dataObj = {
  name: 'Old Name',
  address: {
    state: 'CA',
    timezone: 'America/California'
  }
}

let modifiedValues = {
  'name': 'New Name'
  'address.state': 'FL',
  'address.timezone': 'America/New_York'
}

My goal is to iterate over the second object and utilize the key-value pairs to either update the first object directly or construct a new object with the same structure. Ultimately, I aim to achieve an object as follows:

let dataObj = {
  name: 'New Name',
  address: {
    state: 'FL',
    timezone: 'America/New_York'
  }
}

Additionally, below is the method I currently have for retrieving a value based on a provided path:

getAttributeFromPath(path: string, entity: any): any {
  return path.split('.').reduce((a, b) => a && a[b], entity);
}

javascript typescript

Answer 1

Answer №1

If you want to modify the first object by setting an attribute from a path, you can create a customized version of getAttributeFromPath.

I have demonstrated this with a function called setAttributeFromPath, using forEach instead of reduce:

let dataObj = {
  name: 'Old Name',
  address: {
    state: 'CA',
    timezone: 'America/California'
  }
};

let modifiedValues = {
  'name': 'New Name',
  'address.state': 'FL',
  'address.timezone': 'America/New_York'
};

const setAttributeFromPath = (path, entity, value) => {
  const pathParts = path.split('.');
  let obj = entity;
  
  pathParts.forEach((part, index) => {
    if (obj[part]) {
      if (index < pathParts.length - 1) {
        obj = obj[part];
      } else {
        obj[part] = value;
      }
    }
  });
};

Object.entries(modifiedValues).forEach(([key, value]) => {
  setAttributeFromPath(key, dataObj, value);
});

console.log(dataObj);

You may wish to try crafting a more concise one-liner form of setAttributeFromPath using reduce.

Answer 2

If you want to modify the first object by setting an attribute from a path, you can create a customized version of getAttributeFromPath.

I have demonstrated this with a function called setAttributeFromPath, using forEach instead of reduce:

let dataObj = {
  name: 'Old Name',
  address: {
    state: 'CA',
    timezone: 'America/California'
  }
};

let modifiedValues = {
  'name': 'New Name',
  'address.state': 'FL',
  'address.timezone': 'America/New_York'
};

const setAttributeFromPath = (path, entity, value) => {
  const pathParts = path.split('.');
  let obj = entity;
  
  pathParts.forEach((part, index) => {
    if (obj[part]) {
      if (index < pathParts.length - 1) {
        obj = obj[part];
      } else {
        obj[part] = value;
      }
    }
  });
};

Object.entries(modifiedValues).forEach(([key, value]) => {
  setAttributeFromPath(key, dataObj, value);
});

console.log(dataObj);

You may wish to try crafting a more concise one-liner form of setAttributeFromPath using reduce.

Answer 3

Answer №2

For this task, you can utilize the eval function. All you have to do is loop through your modified values and update them accordingly.

let originalData = {
  title: 'Old Title',
  info: {
    category: 'Tech',
    rating: '5 stars'
  }
}

let updatedValues = {
  'title': 'New Title',
  'info.category': 'Business',
  'info.rating': '4 stars'
}

function modifyObject(values, object){
    Object.keys(values).forEach( property => {
        eval(`object.${property} = values[property]`);
    });
}

modifyObject(updatedValues, originalData);
console.log(originalData);

Answer 4

For this task, you can utilize the eval function. All you have to do is loop through your modified values and update them accordingly.

let originalData = {
  title: 'Old Title',
  info: {
    category: 'Tech',
    rating: '5 stars'
  }
}

let updatedValues = {
  'title': 'New Title',
  'info.category': 'Business',
  'info.rating': '4 stars'
}

function modifyObject(values, object){
    Object.keys(values).forEach( property => {
        eval(`object.${property} = values[property]`);
    });
}

modifyObject(updatedValues, originalData);
console.log(originalData);

Answer 5

Answer №3

To efficiently organize your data, iterate through each item and check for any values that have a dotted structure. Then, construct a new object with the updated layout:

let revisedValues = {
    'name': 'Brand New Name',
    'address.state': 'California',
    'address.timezone': 'America/Los_Angeles'
};

let formattedValues = {};
for(let entry in revisedValues){
    if(entry.includes('.')){
        let separated = entry.split('.');
        if(separated[0] in formattedValues)
            formattedValues[separated[0]][separated[1]] = revisedValues[entry];
        else{
            formattedValues[separated[0]] = {};
            formattedValues[separated[0]][separated[1]] = revisedValues[entry];
        }
    }else{
        formattedValues[entry] = revisedValues[entry];
    }
}
console.log(formattedValues);

Answer 6

To efficiently organize your data, iterate through each item and check for any values that have a dotted structure. Then, construct a new object with the updated layout:

let revisedValues = {
    'name': 'Brand New Name',
    'address.state': 'California',
    'address.timezone': 'America/Los_Angeles'
};

let formattedValues = {};
for(let entry in revisedValues){
    if(entry.includes('.')){
        let separated = entry.split('.');
        if(separated[0] in formattedValues)
            formattedValues[separated[0]][separated[1]] = revisedValues[entry];
        else{
            formattedValues[separated[0]] = {};
            formattedValues[separated[0]][separated[1]] = revisedValues[entry];
        }
    }else{
        formattedValues[entry] = revisedValues[entry];
    }
}
console.log(formattedValues);

Answer 7

Answer №4

Check out this optimized and streamlined approach to a function that involves assigning values by using the last value as reference:

let dataObj = {
  name: 'Old Name',
  address: {
    state: 'CA',
    timezone: 'America/California'
  }
}

let modifiedValues = {
  'name': 'New Name',
  'address.state': 'FL',
  'address.timezone': 'America/New_York'
}

function setAttributeFromPath(path, entity, value) {
  const final = (path = path.split('.')).pop();
  path.reduce((a, b) => a && a[b], entity)[final] = value;
}

for(const key in modifiedValues) setAttributeFromPath(key, dataObj, modifiedValues[key]);

console.log(dataObj);

The loop operation can be integrated into the function itself utilizing array destructuring in the following manner:

function setAttributesFromPath(pathMap, entity) {
  Object.entries(pathMap).forEach(([path,value]) => {
    const final = (path = path.split('.')).pop();
    path.reduce((a, b) => a && a[b], entity)[final] = value;
  });
}

Answer 8

Check out this optimized and streamlined approach to a function that involves assigning values by using the last value as reference:

let dataObj = {
  name: 'Old Name',
  address: {
    state: 'CA',
    timezone: 'America/California'
  }
}

let modifiedValues = {
  'name': 'New Name',
  'address.state': 'FL',
  'address.timezone': 'America/New_York'
}

function setAttributeFromPath(path, entity, value) {
  const final = (path = path.split('.')).pop();
  path.reduce((a, b) => a && a[b], entity)[final] = value;
}

for(const key in modifiedValues) setAttributeFromPath(key, dataObj, modifiedValues[key]);

console.log(dataObj);

The loop operation can be integrated into the function itself utilizing array destructuring in the following manner:

function setAttributesFromPath(pathMap, entity) {
  Object.entries(pathMap).forEach(([path,value]) => {
    const final = (path = path.split('.')).pop();
    path.reduce((a, b) => a && a[b], entity)[final] = value;
  });
}

Adjusting an item according to a specified pathway

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

clicking on a DIV element

Personalize the jquery autocomplete outcome

What would be the optimal type for the second argument of the `simulate` method?

Dividing an AngularJS module across multiple iFrames on a single webpage

Guide on Sending a POST Request via HTTPS in Websites

I'm facing difficulty in assigning props because of the specific nature of generics in Typescript

The issue with JQGrid: Inaccurate selection of drop down value when edit type is set to 'select'

Development of client and server using socket.io in node.js

Enhancing Apollo Cache Updates using TypeScript null checks

Need to swiftly modify values of css attributes?

The power of the V8 JavaScript engine: Understanding v8::Arguments and the versatility of function

Sending data from a JavaScript variable to PHP within the same page

Unusual "visual" phenomenon with autocomplete feature in VUE.js

How to set up an Angular ErrorHandler?

Retrieving data from the <script> tag and transferring it to the t-esc tag within Odoo 12

What are some ways I can safeguard my CSS from injected elements?

Use Object.assign to swap out the current state with a new

Can anyone suggest a simpler method for creating function signatures with multiple conditions?

Inserting a variable into a JSON string

retrieve the value of a text form using jQuery and its corresponding id