Почему объект рендеринга может отображаться на html, но не внутри скрипта?

Таким образом, я передал объект «posts» в HTML.

res.render('post', {posts : items });

Я могу получить доступ к моему объекту внутри HTML с помощью этого вызова, и он отобразит «Джон»,

<h1><%=posts[0].name%></h1>

Однако, если я использую один и тот же объект «posts» в html, но на этот раз поставлю его внутри скрипта для запроса.

<script>
    var data = <%=posts%>;
    for (var i=0, i<data.length, i++) {
      //My intention is to insert a dynamic html code based on this query   
    {
</script>

Мой браузер всегда указывает на <% = posts%>, где я назначаю переменную «data» для ошибки «Uncaught SyntaxError: Unexpected identifier». Он показывает массивы [object, Object], [object, Object] ..... и posts [i] .name не распечатывается.

Итак, мой вопрос в том, могу ли я получить доступ к нему непосредственно на html, почему его помещать внутри тега, приведет к ошибке?

Заранее спасибо за вашу помощь.