Home > Web Front-end > JS Tutorial > body text

Can ES6 Template Literals be Truly Reusable?

Barbara Streisand
Release: 2024-11-01 17:41:02
Original
668 people have browsed it

Can ES6 Template Literals be Truly Reusable?

Reusability conundrum in ES6 Template Literals

The primary concern raised in this discussion revolves around the presumed lack of reusability in ES6 template literals. Conventional demonstrations emphasize substitutions at declaration time, disallowing runtime modification.

Solution: Leveraging the Function Constructor

To address this issue, a viable solution emerges in the form of the Function constructor. This approach involves converting the template string into a function.

Consider the following snippet:

<code class="js">const templateString = `Hello ${this.name}!`;
const templateVars = {
    name: "world"    
};

const fillTemplate = function(templateString, templateVars){
    return new Function("return `" + templateString + "`;").call(templateVars);
};

console.log(fillTemplate(templateString, templateVars));</code>
Copy after login

By invoking this function, you can generate the desired string while possessing the flexibility to modify variables at runtime.

Benefits of this approach:

  • Enables runtime substitution of template values
  • Facilitates interpolation from external sources, such as files
  • Allows for dynamic string manipulation

Potential drawbacks:

  • Template tags may require additional implementation effort
  • Inline JavaScript logic within templates is not supported due to late interpolation
  • Memory overhead associated with function creation for each template use

In summary, while ES6 template literals inherently lack true reusability, employing the Function constructor offers a workaround that emulates the desired behavior of creating and modifying templates at runtime.

The above is the detailed content of Can ES6 Template Literals be Truly Reusable?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template