EJS在Javascript中分解语句的规则是什么？

问题：使用EJS模板时，Javascript中分解语句的规则是什么？大多数情况下，避免在EJS中编译错误是很容易的，但有时它们会意外发生

背景：以下示例使用一个简单的Node.js路由，将数组发送到index.ejs进行渲染

app.js

app.get('/', function(req, res, next) {
    let catArray = ['whiskers', 'socks', 'psycho'];
    res.render('index', { catArray });
});

    <% catArray.forEach( function(element) { %> 
        <div><%= element %></div>
    <% }); %>

    <% new Promise(promiseExecutor).then(randomLogic).catch(failed); %>

    <% function promiseExecutor(resolve, reject) {
        let randomNumber = 10;
        if(randomNumber < 5) {
            reject('number is less than 5');
        } else {
            resolve('number is greater than 5');
        }
    } %>

    <% function randomLogic(message) {
        console.log('success, ', message);
    } %>

    <% function failed(message) {
        console.log('failure, ', message);
    } %>

    <% new Promise(promiseExecutor) %>
    <% .then(randomLogic) %>
    <% .catch(failed); %>

以下各项工作正常，没有错误

index.ejs

app.get('/', function(req, res, next) {
    let catArray = ['whiskers', 'socks', 'psycho'];
    res.render('index', { catArray });
});

    <% catArray.forEach( function(element) { %> 
        <div><%= element %></div>
    <% }); %>

    <% new Promise(promiseExecutor).then(randomLogic).catch(failed); %>

    <% function promiseExecutor(resolve, reject) {
        let randomNumber = 10;
        if(randomNumber < 5) {
            reject('number is less than 5');
        } else {
            resolve('number is greater than 5');
        }
    } %>

    <% function randomLogic(message) {
        console.log('success, ', message);
    } %>

    <% function failed(message) {
        console.log('failure, ', message);
    } %>

    <% new Promise(promiseExecutor) %>
    <% .then(randomLogic) %>
    <% .catch(failed); %>

但是，当我在不同的位置断开这条线时，它会抛出一个错误

    <% catArray.forEach( %> 
        <% function(element) { %> 
        <div><%= element %></div>
    <% }); %>

SyntaxError：意外标记；在C:\fileLocation\index.ejs中 编译ejs

在下一个例子中，我使用承诺。这不是我通常在EJS模板中做的事情，但它可以作为一个示例

下面的代码正常工作，没有错误

index.ejs

app.get('/', function(req, res, next) {
    let catArray = ['whiskers', 'socks', 'psycho'];
    res.render('index', { catArray });
});

    <% catArray.forEach( function(element) { %> 
        <div><%= element %></div>
    <% }); %>

    <% new Promise(promiseExecutor).then(randomLogic).catch(failed); %>

    <% function promiseExecutor(resolve, reject) {
        let randomNumber = 10;
        if(randomNumber < 5) {
            reject('number is less than 5');
        } else {
            resolve('number is greater than 5');
        }
    } %>

    <% function randomLogic(message) {
        console.log('success, ', message);
    } %>

    <% function failed(message) {
        console.log('failure, ', message);
    } %>

    <% new Promise(promiseExecutor) %>
    <% .then(randomLogic) %>
    <% .catch(failed); %>

但是，当我将第一行分成3行时，它会抛出一个错误

    <% catArray.forEach( %> 
        <% function(element) { %> 
        <div><%= element %></div>
    <% }); %>

index.ejs

app.get('/', function(req, res, next) {
    let catArray = ['whiskers', 'socks', 'psycho'];
    res.render('index', { catArray });
});

    <% catArray.forEach( function(element) { %> 
        <div><%= element %></div>
    <% }); %>

    <% new Promise(promiseExecutor).then(randomLogic).catch(failed); %>

    <% function promiseExecutor(resolve, reject) {
        let randomNumber = 10;
        if(randomNumber < 5) {
            reject('number is less than 5');
        } else {
            resolve('number is greater than 5');
        }
    } %>

    <% function randomLogic(message) {
        console.log('success, ', message);
    } %>

    <% function failed(message) {
        console.log('failure, ', message);
    } %>

    <% new Promise(promiseExecutor) %>
    <% .then(randomLogic) %>
    <% .catch(failed); %>

SyntaxError：意外标记；在C:\fileLocation\index.ejs中 编译ejs

---

我确信还有其他的例子，但这是我最近遇到的两个。

这在EJS文档中有记录，请参阅->

---

中允许换行，这在EJS文档中有记录，请参见->

---

在中允许换行。似乎在编译EJS时，它会添加一个

每次看到作为非输出代码块一部分的结尾
%>
。如果添加了
会在普通JavaScript中抛出错误，它也会在EJS中抛出错误

这句话

<% catArray.forEach( function(element) { %> 
<% }); %>

<% catArray.forEach( %> 
<% function(element) { %> 
<% }); %>

然而这句话

<% catArray.forEach( function(element) { %> 
<% }); %>

<% catArray.forEach( %> 
<% function(element) { %> 
<% }); %>

在编译EJS时，它似乎添加了一个
每次看到作为非输出代码块一部分的结尾
%>
。如果添加了
会在普通JavaScript中抛出错误，它也会在EJS中抛出错误

这句话

<% catArray.forEach( function(element) { %> 
<% }); %>

<% catArray.forEach( %> 
<% function(element) { %> 
<% }); %>

然而这句话

<% catArray.forEach( function(element) { %> 
<% }); %>

<% catArray.forEach( %> 
<% function(element) { %> 
<% }); %>

不是一个完整的语句。我不认为这真的回答了这个问题，至少不完全回答了。@AlexWayne你的评论可能帮我弄明白了这一点。看起来像是
%>
告诉编译器添加
。如果添加了
会在普通javascript中导致错误，它会在EJS中导致错误。添加额外的
到
不会在普通Javascript或EJB中导致错误。
不是完整的语句。我不认为这真的回答了这个问题，至少不完全回答了。@AlexWayne你的评论可能帮我弄明白了这一点。看起来像是
%>
告诉编译器添加
。如果添加了
会在普通javascript中导致错误，它会在EJS中导致错误。添加额外的
到
不会在普通Javascript或EJB中导致错误。一旦开始将逻辑放入模板中，就完全重新启动项目；从那以后就不会有什么好事情发生，其实很简单。想想每一个
%>…一旦你开始将逻辑放入模板中，就完全重新启动你的项目；从那以后就不会有什么好事情发生，其实很简单。想想每一个
%>…