lock2.js

const locks = {};

async function protect(fn, name, ...args) {
    while (locks[name]) await locks[name]
    return (locks[name] = new Promise(async (resolve) => {
        const ret = await fn(name, ...args);
        delete locks[name];
        resolve(ret);
    }));
}

//////////////////////////////////////////////////////////

async function unsafeWork(key) {
    // Simulate doing work
    console.log(key, "Start");
    await new Promise(resolve => setTimeout(resolve, 100));
    console.log(key, "End");
    return `Returned from ${key}`;
}


function safeWork(key) {
    return protect(unsafeWork, key);
}

safeWork(1).then(console.log);
safeWork(2).then(console.log);
safeWork(1).then(console.log);
safeWork(2).then(console.log);
safeWork(3).then(console.log);
safeWork(3).then(console.log);
safeWork(1).then(console.log);

If you call unsafeWork directly, it looks like:

1 Start
2 Start
1 Start
2 Start
3 Start
3 Start
1 Start
1 End
2 End
1 End
2 End
3 End
3 End
1 End

But with safeWork, you never have concurrent calls on the same key:

1 Start
2 Start
3 Start
1 End
1 Start
2 End
2 Start
3 End
3 Start
1 End
1 Start
2 End
3 End
1 End