# Making a setter in js

**URL:** <https://discourse.processing.org/t/making-a-setter-in-js/39186>\
**Category:** Beginners\
**Created:** [October 10, 2022, 12:44am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186 "2022-10-10T00:44:40Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![vkbr](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/vkbr/32/16844_2.png) [@vkbr](https://discourse.processing.org/u/vkbr)\
**Post date:** [October 10, 2022, 12:44am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/1 "2022-10-10T00:44:40Z")

</div>

Hello.

I’m struggling with some simple stuff. I think…

I have my object, an instance of a class. I’m trying to make one `set()` function that would get a indefined number of args, based on that I’d like to change some properties.  
I’m trying something like this:

```auto
class Class{
    constructor(prop1, prop2){
        this.prop1 = prop1;
        this.prop2 = prop2;
        this.prop3 = "otherstuff"
    }
}

```

I’d like to have something like:

```auto
// inside the class
set(...props){}

```

and call in a way that I can pass a pair of prop `name: value` and change that one. I’m almost there… but I’m not sure how to make it happen. Whats the best way? Should I pass an array of arrays? An array of objects? what? And how can I call `this` when reading the values

```auto
//in main sketch
    page.set([['prop1', 6][prop2, 6]]); //? or
    page.set([{'prop1': 6}, {'prop2': 6}]); // or what :)

//inside class 

    set(...all) {
            for (const prop of all) {
                const n = [prop]; // logging this is ok i get the name
                const v = prop; // logging this is ok i get the value
                this.n = v;// here it does not work, the this.prop1 never get the value
            }
            this.init();
        } 

```

I’m used to numbers indexed arrays, but this seems to be a case to use the string as index, I mean… how should i do it? The instance itself have some kind of properties array, right? How can I use the string to access it?

thanks

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [October 10, 2022, 1:28am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/2 "2022-10-10T01:28:55Z")

</div>

> [@vkbr](#):
>
> What’s the best way? Should I pass an array of arrays? An array of objects?

Just 1 single object containing 1 or more { key: value } pairs is enough.

And in order to check for each passed { key: value } pair actually exists within the class instance we can use a [`for ( in )`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in) loop to iterate over the passed object and then conditionally assign its value to the corresponding class property via operator `&&=`:

> **[Logical AND assignment (&&=) - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_AND_assignment)**
>
> The logical AND assignment (&&=) operator only evaluates the right operand and assigns to the left if the left operand is truthy.

```auto
class SomeClass {
  constructor(prop1, prop2, prop3 = 'Same Stuff') {
    this.prop1 = prop1;
    this.prop2 = prop2;
    this.prop3 = prop3;
  }

  setProps(props) {
    for (const p in props) this[p] &&= props[p];
    return this;
  }
}

const a = new SomeClass(10, 200);
console.log(a); // SomeClass {prop1: 10, prop2: 200, prop3: "Same Stuff"}

a.setProps({ prop3: 'Other Stuff', prop1: -50 });
console.log(a); // SomeClass {prop1: -50, prop2: 200, prop3: "Other Stuff"}

a.setProps({ prop10: 'Invalid Property' });
console.log(a); // SomeClass {prop1: -50, prop2: 200, prop3: "Other Stuff"}

```

---

<div class="post-metadata">

**Author:** ![vkbr](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/vkbr/32/16844_2.png) [@vkbr](https://discourse.processing.org/u/vkbr)\
**Post date:** [October 10, 2022, 1:31am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/3 "2022-10-10T01:31:41Z")

</div>

Great!!! Thanks a lot. Now I’ll read the pointed link to understand how that works.  
Amazing!  
cheers

edit: I see, makes sense… And also it’s needed to `return` the assigned property, right?

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [October 10, 2022, 1:54am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/4 "2022-10-10T01:54:59Z")

</div>

> [@vkbr](#):
>
> And also it’s needed to `return` the assigned property, right?

Nope! `return this;` is merely an extra that makes a method chain-callable.  
Also notice the `return this;` statement doesn’t belong to the `for..in` loop block.

---

<div class="post-metadata">

**Author:** ![vkbr](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/vkbr/32/16844_2.png) [@vkbr](https://discourse.processing.org/u/vkbr)\
**Post date:** [October 10, 2022, 2:10am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/5 "2022-10-10T02:10:27Z")

</div>

I see, ok thanks again.

---

<div class="post-metadata">

**Author:** ![vkbr](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/vkbr/32/16844_2.png) [@vkbr](https://discourse.processing.org/u/vkbr)\
**Post date:** [October 10, 2022, 2:14am UTC](https://discourse.processing.org/t/making-a-setter-in-js/39186/6 "2022-10-10T02:14:16Z")

</div>

Worked like a charm :))))