Weird undefined error on javascript arrow function

0

I'm joined to a react-native project and I realized something is different here like its CSS, but I think something about javascript is different too. Because I got an error on the following code:

const makeVal = arr =>

  arr

    .filter( i => i.checked )

    .map ( i => i.label )

    .join(', ');

Sometimes this function falls in the following error:

Uncaught TypeError: Cannot read property 'filter' of undefined

I cannot find it out and our leader tell me it's your fault? But I think it is backend team fault for their data passing in their API.

How I can write this function that won't fall in error?

javascript react-native

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Where is the dot in your code?
  
  – Ankit Agarwal
  Nov 22 '18 at 9:19
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.
  
  – Robin Zigmond
  Nov 22 '18 at 9:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AnkitAgarwal, thank for your comment. I fix it.
  
  – user10690061
  Nov 22 '18 at 9:21
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.
  
  – user10690061
  Nov 22 '18 at 9:24
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  @ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.
  
  – Ivar
  Nov 22 '18 at 9:30
  

  
  
  
  

 | 
show 6 more comments

0

I'm joined to a react-native project and I realized something is different here like its CSS, but I think something about javascript is different too. Because I got an error on the following code:

const makeVal = arr =>

  arr

    .filter( i => i.checked )

    .map ( i => i.label )

    .join(', ');

Sometimes this function falls in the following error:

Uncaught TypeError: Cannot read property 'filter' of undefined

I cannot find it out and our leader tell me it's your fault? But I think it is backend team fault for their data passing in their API.

How I can write this function that won't fall in error?

javascript react-native

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Where is the dot in your code?
  
  – Ankit Agarwal
  Nov 22 '18 at 9:19
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.
  
  – Robin Zigmond
  Nov 22 '18 at 9:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AnkitAgarwal, thank for your comment. I fix it.
  
  – user10690061
  Nov 22 '18 at 9:21
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.
  
  – user10690061
  Nov 22 '18 at 9:24
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  @ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.
  
  – Ivar
  Nov 22 '18 at 9:30
  

  
  
  
  

 | 
show 6 more comments

0

0

0

I'm joined to a react-native project and I realized something is different here like its CSS, but I think something about javascript is different too. Because I got an error on the following code:

const makeVal = arr =>

  arr

    .filter( i => i.checked )

    .map ( i => i.label )

    .join(', ');

Sometimes this function falls in the following error:

Uncaught TypeError: Cannot read property 'filter' of undefined

I cannot find it out and our leader tell me it's your fault? But I think it is backend team fault for their data passing in their API.

How I can write this function that won't fall in error?

javascript react-native

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

I'm joined to a react-native project and I realized something is different here like its CSS, but I think something about javascript is different too. Because I got an error on the following code:

const makeVal = arr =>

  arr

    .filter( i => i.checked )

    .map ( i => i.label )

    .join(', ');

Sometimes this function falls in the following error:

Uncaught TypeError: Cannot read property 'filter' of undefined

I cannot find it out and our leader tell me it's your fault? But I think it is backend team fault for their data passing in their API.

How I can write this function that won't fall in error?

javascript react-native

javascript react-native

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

share|improve this question

share|improve this question

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

edited Dec 13 '18 at 8:15

piet.t

10.1k73245

10.1k73245

asked Nov 22 '18 at 9:19

user10690061

asked Nov 22 '18 at 9:19

user10690061

asked Nov 22 '18 at 9:19

user10690061

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Where is the dot in your code?
  
  – Ankit Agarwal
  Nov 22 '18 at 9:19
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.
  
  – Robin Zigmond
  Nov 22 '18 at 9:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AnkitAgarwal, thank for your comment. I fix it.
  
  – user10690061
  Nov 22 '18 at 9:21
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.
  
  – user10690061
  Nov 22 '18 at 9:24
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  @ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.
  
  – Ivar
  Nov 22 '18 at 9:30
  

  
  
  
  

 | 
show 6 more comments

• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  
  Where is the dot in your code?
  
  – Ankit Agarwal
  Nov 22 '18 at 9:19
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.
  
  – Robin Zigmond
  Nov 22 '18 at 9:20
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AnkitAgarwal, thank for your comment. I fix it.
  
  – user10690061
  Nov 22 '18 at 9:21
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.
  
  – user10690061
  Nov 22 '18 at 9:24
  

  
  
  
  


• 
  
  
  

  
  2
  

  
  
  
  
  
  

  
  
  @ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.
  
  – Ivar
  Nov 22 '18 at 9:30
  

  
  
  
  

1

1

Where is the dot in your code?

– Ankit Agarwal
Nov 22 '18 at 9:19

Where is the dot in your code?

– Ankit Agarwal
Nov 22 '18 at 9:19

Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.

– Robin Zigmond
Nov 22 '18 at 9:20

Assuming this is actually arr.filter(...).map(...) etc, then the error means that you are passing in undefined to the function. But you don't show us how the function is being called.

– Robin Zigmond
Nov 22 '18 at 9:20

@AnkitAgarwal, thank for your comment. I fix it.

– user10690061
Nov 22 '18 at 9:21

@AnkitAgarwal, thank for your comment. I fix it.

– user10690061
Nov 22 '18 at 9:21

@RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.

– user10690061
Nov 22 '18 at 9:24

@RobinZigmond, it calls be react-native inside Text component, in this function the arr is passed by formik object, the field.value. my manager told me it is not about data, its fault of your code.

– user10690061
Nov 22 '18 at 9:24

2

2

@ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.

– Ivar
Nov 22 '18 at 9:30

@ElinaSalamon There is nothing wrong with this code. It's about how it is called. Without more information it's impossible for us to answer.

– Ivar
Nov 22 '18 at 9:30

 | 
show 6 more comments

1 Answer
1

active

oldest

votes

2

Uncaught TypeError: Cannot read property 'filter' of undefined

You should ensure that arr property is actually defined and is of array type. It seems that in some cases arr passed to makeVal function is undefined, and therefore doesn't have filter method. You could try something like this:

const makeVal = arr => {

   if (typeof arr === 'undefined' || ! Array.isArray(arr)) {

       // "arr" is wrong, error handling

   } else {

       return  arr

           .filter( i => i.checked )

           .map ( i => i.label )

           .join(', ');

   }

}

Furthermore, you might want to check if arr elements actually contain "checked" and "label" fields, but this is a different story. OR, you could examine makeVal callsite and ensure that data passed to this function is correct.

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.
  
  – user10690061
  Nov 22 '18 at 19:10
  

  
  
  
  

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53427482%2fweird-undefined-error-on-javascript-arrow-function%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

active

oldest

votes

active

oldest

votes

2

Uncaught TypeError: Cannot read property 'filter' of undefined

You should ensure that arr property is actually defined and is of array type. It seems that in some cases arr passed to makeVal function is undefined, and therefore doesn't have filter method. You could try something like this:

const makeVal = arr => {

   if (typeof arr === 'undefined' || ! Array.isArray(arr)) {

       // "arr" is wrong, error handling

   } else {

       return  arr

           .filter( i => i.checked )

           .map ( i => i.label )

           .join(', ');

   }

}

Furthermore, you might want to check if arr elements actually contain "checked" and "label" fields, but this is a different story. OR, you could examine makeVal callsite and ensure that data passed to this function is correct.

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.
  
  – user10690061
  Nov 22 '18 at 19:10
  

  
  
  
  

add a comment | 

2

Uncaught TypeError: Cannot read property 'filter' of undefined

You should ensure that arr property is actually defined and is of array type. It seems that in some cases arr passed to makeVal function is undefined, and therefore doesn't have filter method. You could try something like this:

const makeVal = arr => {

   if (typeof arr === 'undefined' || ! Array.isArray(arr)) {

       // "arr" is wrong, error handling

   } else {

       return  arr

           .filter( i => i.checked )

           .map ( i => i.label )

           .join(', ');

   }

}

Furthermore, you might want to check if arr elements actually contain "checked" and "label" fields, but this is a different story. OR, you could examine makeVal callsite and ensure that data passed to this function is correct.

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.
  
  – user10690061
  Nov 22 '18 at 19:10
  

  
  
  
  

add a comment | 

2

2

2

Uncaught TypeError: Cannot read property 'filter' of undefined

You should ensure that arr property is actually defined and is of array type. It seems that in some cases arr passed to makeVal function is undefined, and therefore doesn't have filter method. You could try something like this:

const makeVal = arr => {

   if (typeof arr === 'undefined' || ! Array.isArray(arr)) {

       // "arr" is wrong, error handling

   } else {

       return  arr

           .filter( i => i.checked )

           .map ( i => i.label )

           .join(', ');

   }

}

Furthermore, you might want to check if arr elements actually contain "checked" and "label" fields, but this is a different story. OR, you could examine makeVal callsite and ensure that data passed to this function is correct.

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

Uncaught TypeError: Cannot read property 'filter' of undefined

You should ensure that arr property is actually defined and is of array type. It seems that in some cases arr passed to makeVal function is undefined, and therefore doesn't have filter method. You could try something like this:

const makeVal = arr => {

   if (typeof arr === 'undefined' || ! Array.isArray(arr)) {

       // "arr" is wrong, error handling

   } else {

       return  arr

           .filter( i => i.checked )

           .map ( i => i.label )

           .join(', ');

   }

}

Furthermore, you might want to check if arr elements actually contain "checked" and "label" fields, but this is a different story. OR, you could examine makeVal callsite and ensure that data passed to this function is correct.

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

share|improve this answer

share|improve this answer

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

answered Nov 22 '18 at 11:09

Anton PastukhovAnton Pastukhov

1978

1978

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.
  
  – user10690061
  Nov 22 '18 at 19:10
  

  
  
  
  

add a comment | 

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.
  
  – user10690061
  Nov 22 '18 at 19:10
  

  
  
  
  

Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.

– user10690061
Nov 22 '18 at 19:10

Thanks for your answer. I want to upvote you too but because of my rep under 15 I cannot. if I reach this rep absolutely, I will upvote you. thanks.

– user10690061
Nov 22 '18 at 19:10

add a comment | 

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53427482%2fweird-undefined-error-on-javascript-arrow-function%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

This page is only for reference, If you need detailed information, please check here