Skip to content

js-upsert@0.2

Latest
Compare
Choose a tag to compare
@shadmax22 shadmax22 released this 31 Mar 15:37
· 6 commits to main since this release

Introducing js-upsert@0.2

let projectData = {
    projectId: "project123",
    description: "Initial Project Description",
    tasks: [
        {
            taskId: "task1",
            status: "pending",
            comments: [
                { commentId: "comment1", text: "This task is crucial.", timestamp: "2024-03-28T10:00:00Z" }
            ]
        },
        {
            taskId: "task2",
            status: "in progress",
            comments: [
                { commentId: "comment2", text: "Need more details.", timestamp: "2024-03-29T11:00:00Z" }
            ]
        }
    ]
};

MUTATING OBJECT projectData WITHOUT JS-UPSERT 😒

let updatedProjectData = {
    ...projectData,
    tasks: [
        ...projectData.tasks,
    ]
};

updatedProjectData .tasks[0] = {
    ...updatedProjectData .tasks[0],
    status: "completed"
};

MUTATING projectData WITH JS-UPSERT 🤩

let updatedProjectData = upsert(projectData, {
    tasks: set({ status: "completed" }, [0]) // Updating the status of the first task
});

js-upsert is a lightweight JavaScript library designed to simplify the updating process of deeply nested properties within objects. It offers an intuitive way to precisely modify values deep within an object's structure without altering unrelated keys, making it an essential tool for efficient state management in complex applications.

Features

  • Intuitive Syntax: Easy to understand and use for updating nested properties.
  • Non-destructive: Keeps the original object structure intact, only modifying specified keys.
  • Dependency-Free: Lightweight with no external dependencies, ensuring a minimal footprint.

USAGE

import { upsert, set } from "js-upsert";
upsert(HAYSTACK, NEEDLE)

EXAMPLES

Taken a sample object named user_data.

let user_data = {
    name: "John Doe",
    age: 22,
    login_data:{
        data: [
            {time: "08:55 PM", date: "28-03-2024"},
            {time: "10:55 PM", date: "28-03-2024"},
        ],

        token: "13A131Q334"
    }
}

UPDATING A KEY

Updating user_data.login_data.token to MY NEW VALUE:-

upsert(user_data, {
    login_data:{
        token: set("MY NEW VALUE")
    }
})

It will return:-

{
    name: "John Doe",
    age: 22,
    login_data:{
        data: [
            {time: "08:55 PM", date: "28-03-2024"},
            {time: "10:55 PM", date: "28-03-2024"},
        ],

        token: "MY NEW VALUE"
    }
}

UPDATING AN ARRAY

Updating user_data.login_data.data[1].time to 11:00 PM:-

upsert(user_data, {
  login_data: {
    data: set("11:00 PM", [1, "time"]),
  },
});


// Here index provided is [1, "time"] index a key "data"

Alternate way to update user_data.login_data.data[0].time to 12:00 PM:-

upsert(user_data, {
    login_data:{
        data: set((old_key_value) => ({...old_key_value, time: "11:00 PM"}), [1])
    }
})

// Here index provided is [1]

EXPLANATION:-

upsert(haystack, needle) will have 2 parameters, Object & Needle.

"Haystack" is the target variable that we have to update and needle is the new value that has to be updated in the target.

In needle, the set(value = string | object | function, index= null | [] ) function will point an update key, and update it.

VISION:

Hey Cool Developers,

We're working on making 'js-upsert' the go-to for mutating objects in JavaScript with setters. Your expertise can make a huge difference! Let's team up to boost this tool.

Thanks for pitching in,
Md Shad