Hi !

Given the following sample items :

ID First name Age
xvZwiCpi Naomi 42
Nzd9UsGT Naomi 24
QiDXP2wA Thea 53
JpYeAY7H Jeremy 35

I can store these in an array :

const data = [
  { id: 'xvZwiCpi', firstName: 'Frederic', age: 42 },
  { id: 'Nzd9UsGT', firstName: 'Naomi', age: 24 },
  { id: 'QiDXP2wA', firstName: 'Thea', age: 53 },
  { id: 'JpYeAY7H', firstName: 'Mathew', age: 35 }
];

Thus access them the same way by ID :

console.log(data.find(item => item.id === 'xvZwiCpi'));

And by properties :

console.log(data.find(item => item.firstName === 'Frederic').id);

Or I can store these in an object :

const data = {
  'xvZwiCpi': { firstName: 'Frederic', age: 42 },
  'Nzd9UsGT': { firstName: 'Naomi', age: 24 },
  'QiDXP2wA': { firstName: 'Thea', age: 53 },
  'JpYeAY7H': { firstName: 'Mathew', age: 35 }
};

Thus more easily access properties by ID :

console.log(data['xvZwiCpi'].firstName);

But more hardly access ID by properties :

console.log(Object.entries(data).find(([id, item]) => item.firstName = 'Frederic')[0]);

I could duplicate IDs :

const data = {
  'xvZwiCpi': { id: 'xvZwiCpi', firstName: 'Frederic', age: 42 },
  'Nzd9UsGT': { id: 'Nzd9UsGT', firstName: 'Naomi', age: 24 },
  'QiDXP2wA': { id: 'QiDXP2wA', firstName: 'Thea', age: 53 },
  'JpYeAY7H': { id: 'JpYeAY7H', firstName: 'Mathew', age: 35 }
};

To slightly simplify that previous line :

console.log(Object.values(data).find(item => item.firstName = 'Frederic').id);

But what if a single variable type could allow doing both operations easily ?

console.log(data['xvZwiCpi'].firstName);
console.log(data.find(item => item.firstName === 'Frederic').id);

Does that exist ?

If not, I’m thinking about implementing it that way :

const data = new Proxy([
  { id: 'xvZwiCpi', firstName: 'Frederic', age: 42 },
  { id: 'Nzd9UsGT', firstName: 'Naomi', age: 24 },
  { id: 'QiDXP2wA', firstName: 'Thea', age: 53 },
  { id: 'JpYeAY7H', firstName: 'Mathew', age: 35 }
], {
    get: (array, property) =>
        array[property]
        ||
        array.find(item => item.id === property)
});

In which case I’d put it in a lib, but how would this be named ?

I’d also make a second implementation that would enforce ID uniqueness and use Map to map IDs with indexes instead of running find : while the first implementation would be fine for static data, the second one would be more suitable for dynamic data.

Would this make sense ?

Thanks

  • towerful@programming.dev
    link
    fedilink
    English
    arrow-up
    2
    ·
    1 year ago

    Seems like a great idea.
    I often find myself using objects when I’m building data (like a horrible CSV processor). It’s easy to pull in a row of data, and potentially modify existing data (yeh, really horrible CSV).

    But when it gets to processing the data (transformers and database), I prefer arrays.

    A lot of it comes back to typescript, where Object.keys().forEach means the key isn’t necessarily usable to access the item in the object (the whole, a key becomes a string, but an object can be keyed by string/number/symbol). .
    So, whatever you come up with HAS to have first class Typescript support.

      • towerful@programming.dev
        link
        fedilink
        English
        arrow-up
        3
        ·
        1 year ago

        Fair enough, I can understand that.
        I used to enjoy the flexibility that JS provides. And IDEs do a pretty good job of filling the holes!

        My last project, I went all in on typescript. And I have caught so many more errors before even compiling.
        It’s like having tests. It gives a hell of a lot more confidence.

        Some days I miss just slinging objects around, and just coercing types tho (without explicitly casting/converting… Object keys being a big one!)

        • KaKi87@sh.itjust.worksOP
          link
          fedilink
          English
          arrow-up
          1
          arrow-down
          1
          ·
          1 year ago

          I used to enjoy the flexibility that JS provides. And IDEs do a pretty good job of filling the holes!

          Exactly.

          My last project, I went all in on typescript. And I have caught so many more errors before even compiling. It’s like having tests. It gives a hell of a lot more confidence.

          I can understand that too. Although, IDEs also catch a lot of type-related errors in vanilla JS.