作为一个前端研发人员，模板引擎、模板字符串我们并不陌生。

mustache.js

const template = '我是{{name}}，{{remark}}。';
const obj = {
  name: 'Javascript',
  remark: '是一种具有函数优先的轻量级，解释型或即时编译型的编程语言'
};
const res = Mustache.render(template, obj);
console.log(res);
// 我是Javascript，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

其他用法详见PrvtCMS制作网站，使用模板引擎（mustache.js）作服务端渲染

ES6模板字符串（`）

const obj = {
  name: 'Javascript',
  remark: '是一种具有函数优先的轻量级，解释型或即时编译型的编程语言'
};
const res = `我是${obj.name}，${obj.remark}。`;
console.log(res);
// 我是Javascript，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

C#

string name = "Javascript";
string remark = "是一种具有函数优先的轻量级，解释型或即时编译型的编程语言";
Console.WriteLine(String.Format("{0},{1}",name,remark));
// 我是Javascript，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

在很久很久以前作为一个后端研发人员，开始接触Javascript的时候，在想为什么Javascript没有这么一个方法呢？然后……

也就是在这个时候，开始接触正则表达式，伟大的发明。

第一版

// string.js
if (!String.prototype.format)
    String.prototype.format = function () {
        var args = arguments;
        return this.replace(/{(\d+)}/g, function (_search, _replace, _index, _string) {
            return args[_replace] || '';
        });
    };

var name = "Javascript";
var remark = "是一种具有函数优先的轻量级，解释型或即时编译型的编程语言";
var result = '我是{0}，{1}。'.format(name, remark);
console.log(result);
// 我是Javascript，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。

过了很久，不想写{0}

第二版

if (!String.prototype.format)
    String.prototype.format = function () {
        var obj = arguments && arguments[0] instanceof Object ? arguments[0] : {};
        return this.replace(/{{([0-9a-zA-Z_.\[\]]+)}}/g, function (_search, _replace, _index, _string) {
            if(!/./.test(_replace)) return obj[_replace] || _search;
            var replaces = _replace.split(/[\[\].]/);
            var newObj = obj;
            for(var i = 0; i < replaces.length; i++){
                if(replaces[i].length == 0) continue;
                if(newObj===undefined) return _search;
                newObj = newObj[replaces[i]];
            }
            return newObj;
        });
    };

var obj = {
    info: { name: 'TypeScript' },
    lans: [
      { name: 'Javascript' }
    ]
};
var result = '我是{{info.name}}，是{{lans[0].name}}类型的超集'.format(obj);
console.log(result);

再后面，已经有ES6的模板字符串（`）了。

TypeScript语法提示

新建一个 string.d.ts 文件，复制下面代码即可。

// string.d.ts
interface String {
    format: (...args: Object[]) => string
}

人人为我，我为人人，一起加油吧。