模版字符串的用法

57 阅读1分钟
        // 模版字符串
        const person = {name:'alex',age:27};
        // 使用反引号包裹的字符串就是模版字符串
        // 模版字符用${}注入值
        // 优点比使用 “+”拼接更清晰。更方便注入
        const info = `名字是:${person.name},年龄:${person.age}`;
        console.log(info);

        // 注意事项:
        // 输出多行字符串
        // 普通字符串使用转义符/n进行换行
        const str = '你好吗?\n你吃饭了吗?';
        // 模版字符串:
        const tempStr = `你好吗?
你吃饭了吗?`;
        // 模版字符串中,所有的空格、换行或缩进都会被保留在输出之中

        // 输出特殊字符。` \ ,需要使用右反斜杠进行转义
        const tsStr = `aaa\`\\`; 
        console.log(tsStr) // aaa`\

        // 那些值可以被模版字符串注入
        // 调用函数,对象的值、
        // 只要最终可以得出一个值的就可以通过${}注入到模版字符串中
         // 1、认识箭头函数 
        const add  = (x,y)=>{
            return x+y;
        };
        console.log(1,1);
        // 2、箭头函数结构
        //  const add =  参数部分=>函数体

        //3、一般函数改写成箭头函数
        // 一般函数有俩种形式
        // 声明形式
        function add(){}
        // 函数表达式形式
        const add2 = function(){
        }
        
        // 声明形式->函数表达式形式->箭头函数
        const body = ()=>{};

        // 箭头函数的注意事项
        // 1、单个参数可以省略圆括号,无参数或者多个参数不能省略圆括号
        const add = x=>{x+1};
        // 2、单行函数体可以同时省略{}和return;
        const add = (x,y) => x+y;
        // 3、单行对象
        // 如果没有显示的return,则会返回一个undefined
        const add = (x,y)=>({
            value:x+y
        });
        // 如果箭头函数返回单行队形,可以在{}外面加上(),让浏览器不再人呢为那是
        // 函数体的花括号