2021-06-01 模板字符串${}的定义和常见用法

定义:

ES6模板字符串是对之前字符串拼接的一种格式优化;在模板字符串之前,拼接字符串用" “+” "(双引号与加号)的格式,如今可以改成${ };

用法:

把所有原先变量所在的位置用${变量名}代替,整体写在一对``里面

1.示例:

       var name = "zs",age = 18,addr = 'bj';
        console.log("我叫" + name + ",今年" + age + "岁,来自" + "bj");
        console.log(`我叫 ${name},今年${age}岁,来自${addr}`);//``中的空格与换行不会忽略

显然后者更为语义化,格式更为简洁明了

2.模板字符串中可以放任意格式的javascript表达式,可以进行运算,可以引用对象属性等等

2.1.引入运算表达式

        var i = 10,j = 10;
        console.log(`${i}X${j}=${i*j}`);//10X10=100

2.2.引入对象属性

        var obj = {
            name: "zs",
            age: 18,
            addr: 'bj'
        }
        console.log(`我叫${obj.name},今年${obj.age}岁,来自${obj.addr}`);

2.3.引入函数

       function getNum(min, max) {
            return Math.round(Math.random() * (max - min) + min);
        }
        console.log(`我今年${getNum(1,100)}岁`);