Cannot read properties of undefined (reading 'split'), and i want to do some tags options

Question

<div class="row no-margin video-title">
    <h6><i class="fas fa-book"></i> Tags</h6>
</div>
<div class="image">
    <ul class="list-unstyled mb-0">
        <% 
            Tags = video.Tags.split(",");
            Tags.forEach (function (tag) {
            tag = tag.trim(); %>

            <li>
                <a href="/tag_search/<%= tag %>"><%= tag %></a>
            </li>

        <% }) %>
    </ul>
</div>

and I receive this error:

TypeError:
E:\livestreaming\video_streaming\views\video-page\index.ejs:374
    372|             
    373| 
 >> 374|             <%- include("side-bar") %>
    375|             
    376|         </div>
    377|     </div>

E:\livestreaming\video_streaming\views\video-page\side-bar.ejs:39
    37|     <div class="image">
    38|         <ul class="list-unstyled mb-0">
 >> 39|             <% 
    40|                 Tags = video.Tags.split(",");
    41|                 Tags.forEach (function (tag) {
    42|                 tag = tag.trim(); %>

Cannot read properties of undefined (reading 'split')
    at eval ("E:\\livestreaming\\video_streaming\\views\\video-page\\side-bar.ejs":47:35)
    at side-bar (E:\livestreaming\video_streaming\node_modules\ejs\lib\ejs.js:692:17)
    at include (E:\livestreaming\video_streaming\node_modules\ejs\lib\ejs.js:690:39)
    at eval ("E:\\livestreaming\\video_streaming\\views\\video-page\\index.ejs":101:17)
    at index (E:\livestreaming\video_streaming\node_modules\ejs\lib\ejs.js:692:17)
    at tryHandleCache (E:\livestreaming\video_streaming\node_modules\ejs\lib\ejs.js:272:36)
    at View.exports.renderFile [as engine] (E:\livestreaming\video_streaming\node_modules\ejs\lib\ejs.js:489:10)
    at View.render (E:\livestreaming\video_streaming\node_modules\express\lib\view.js:135:8)
    at tryRender (E:\livestreaming\video_streaming\node_modules\express\lib\application.js:640:10)
    at Function.render (E:\livestreaming\video_streaming\node_modules\express\lib\application.js:592:3)

Answer 1

You need to learn to read the error, Elon!

Cannot read properties of undefined (reading 'split')

It is clearly saying, a property named split is attempted to be accessed from an undefined value.

Now, all you have to do is, to check where you are using split in the part of the code that throws the error.

Then you will learn that, it is Tags = video.Tags.split(","); where, split is being used. That means, Tags property in video object is not defined.

Now, you simply need to ensure Tags is present in video object always & it must be a string.

Answer 2

This means that video.Tags stores an undefined value. Make sure to check if the video.Tags has a value before using the split() method. See code below:

var video = undefined;

// Cannot read properties of undefined (reading 'split')
video.split(',');

To check whether your string is undefined or not:

const video = undefined;

if (typeof video === 'string') {
  const array = video.split(',');
  // Do something ...
} else {
  console.log('video is not a string');
}

// You could also use method chaining.
const r = video?.split(','); 
console.log(r);