[ Express ] Cannot read properties of undefined (reading 'length')

문제현상

템플릿 엔진에게 데이터를 넘겨서 웹 페이지를 렌더링을 하려고 했다. 하지만 데이터를 확인할 수 없다는 메세지를 받았다.

 

 

해결과정

템플릿 엔진 코드들을 먼저 확인했다. 별다른 이상은 없었다.

컨트롤러 코드를 확인해봤다. 데이터를 변수 그대로 넘기고  있었다.

const fruit = (fruitName, fruitAmount, fruitSize, fruitColor, fruitWeight) => {
    return {
        name: fruitName,
        amount: fruitAmount,
        mySize: fruitSize,
        color: fruitColor,
        weight: fruitWeight,
    };
};

const fruits = [
    fruit("apple", 6, 10, "red", 20),
    fruit("orange", 1, 24, "orange", 19),
    fruit("watermelon", 2, 13, "green", 15),
];

export const pratice = (req, res) => res.render("practice",  fruits );

 

혹시나 해서 코드를 변수를 받는 부분을 중괄호로 묶었다.

export const pratice = (req, res) => res.render("practice", { fruits });

그랬더니 프로그램이 제대로 작동하기 시작했다.

 

 

원인분석

express에서 템플릿에게 데이터를 보낼 때는 객체의 형태로 보내야한다고 한다. 난 배열은 그 자체가 객체니까 그냥 보내도 된다고 생각했다. 하지만 배열 또한 객체 안에 넣어서 보냈어야 했다.