undefined (reading 'valueOf') finding the number of the week in Vue

Question

I am trying to find the number of the week. So for this my function is:

getWeekNumber(date) {
            const temp_date = new Date(date.valueOf());
            const dayn = (date.getDay() + 6) % 7;
            temp_date.setDate(temp_date.getDate() - dayn + 3);
            const firstThursday = temp_date.valueOf();
            temp_date.setMonth(0, 1);
            if (temp_date.getDay() !== 4) {
                temp_date.setMonth(0, 1 + ((4 - temp_date.getDay() + 7) % 7));
            }
            return 1 + Math.ceil((firstThursday - temp_date) / 604800000);
        },

And I am using this function in my other function to find the products:

findProducts(products, date) {
            return products.filter((product) => {
                const formated_date = this.setDateFormat(product.attributes.date);
                console.log(formated_date);
                console.log(formated_date.valueOf());
                return (
                    formated_date.getDate() === date.getDate() &&
                    formated_date.getMonth() === date.getMonth() &&
                    formated_date.getFullYear() === date.getFullYear() &&
                    this.getWeekNumber(formated_date) === this.currentWeekNumber
                );
            });
        },

But my problem is inside of the findProducts function in console I can see the output like this: Tue Sep 28 2021 02:00:00 GMT+0200 (Central European Summer Time) Table.vue:144 1632787200000

But whenever it goes to getWeekNumber function I am getting this error: vue.esm.js:1897 TypeError: Cannot read properties of undefined (reading 'valueOf')

Do you have any idea why it can be?

Thanks...

tauzN · Answer 1 · 2021-09-20T10:11:33.930

1

It is never a good idea to implement date related concepts yourself. There is so many caveats that you dont know about. I recommend using something like Day.js

Specifically Week of Year

edited Sep 20 '21 at 10:11

answered Sep 20 '21 at 09:15

tauzN

5,162
2
16
21

score 0 · Answer 2 · answered Sep 20 '21 at 09:38

Maybe the problem here are the scopes, lambdas remove "this" object, for example:

const test = {
  x : "hello",
  lambda: () => this.x,
  fun: function () { return this.x}
}


console.log(test.lambda()) //undefined
console.log(test.fun()) //"hello"

To solve this you can wrap your "this" object inside another object, for example:

findProducts(products, date) {
            let vueThis = this
            return products.filter((product) => {
                const formated_date = this.setDateFormat(product.attributes.date);
                console.log(formated_date);
                console.log(formated_date.valueOf());
                return (
                    formated_date.getDate() === date.getDate() &&
                    formated_date.getMonth() === date.getMonth() &&
                    formated_date.getFullYear() === date.getFullYear() &&
                    vueThis.getWeekNumber(formated_date) === vueThis.currentWeekNumber
                );
            });
        },

With this approach you are using "this" context from vue inside your lambda, also you can change this to an anonymous function and call it later.

undefined (reading 'valueOf') finding the number of the week in Vue

2 Answers2