javascript 字符串（string）

在js中用   单引号/双引号/反引号    包起来的都是字符串

把其他数据类型转换为字符串类型

    +  String(value)

    +  value.toString()

普通对象转换为字符串 都是  “[object  Object]”，数组对象转换为字符串是   “第一项,第二项...”(逗号分隔数组中的每一项)

在js中常用的数学运算

    +  数学运算：+  - * /    加减乘除

    +  %（膜）取余数

除了加法以外，其余的情况都是数学运算（如果遇到非数字类型，需要基于Number把其强制转换为数字类型，然后进行运算的）;  加号在js中既有数学运算，也有字符串拼接的意思（只要加号两边的任意一边出现字符串，则变为字符串拼接）

console.log(4/2); // => 2
console.log(7/3); // => 2.33333333333335
console.log(7%3); // => 1
console.log(10 - null); // => 10
console.log(3* undefined); // => NaN
console.log(true - "12"); // => 1-12 => -11

console.log(3 - '3px');  // => NaN
console.log(3 + '3px'); // => 33px  字符串拼接
console.log(1 + '1');  // => 11 
console.log(1 + {}); // => 1[object Object]  在把{} 转换为数字过程中，先把 他转换为字符串'[object Object]' ,此时右侧出现了字符串，则不再是数字运算，而是字符串拼接了
console.log(1+[]); // => '1'
console.log([10] + true);  // => '10true'  在转换[10]到数字的过程中，先把其转换为字符串 '10'，此时操作变为字符串拼接（和数学运算符没关系了）
console.log(true + [10]); // =>  'true10'
console.log(1+true); // => 2           

例题

console.log(100 + true + 21.2 + null + undefined + "Tencent" + [] + null + 9 + false)

/*
100 + true   =>  101
101 + 21.1   =>  122.1
122.1 + null =>  122.1
122.1 + undefined  =>  NaN
NaN + "Tencent"  => "NaNTencent"  字符串拼接，以后都是字符串
NaNTencent + [] => NaNTencent
NaNTencent  + null => NaNTencentnull
NaNTencentnull  +  9  => NaNTencentnull9
NaNTencentnull9 + false => NaNTencentnull9false*/

字符串拼接

完成字符串拼接处理    2020年  03月03日 12:00:00

let year = '2020';
let month = '03';
let day = '03';
let hours = '12';
let minutes = '00';
let second = '00';

传统拼接方式，我们需要在字符串中基于"++" 或者 '++'  的方式把变量拼接到字符串中（这种方式涉及很多规则，
容易出错）
let result = year + "年" + month + "月" + day + "日" + hours + ":" + minutes + ":" + seconds";

Es6 中的模板字符串就是为了解决传统字符串中的拼接问题（反引号）：${}中存放变量或者其他 的js表达式
即可，很简单的完成字符串拼接

let result = `${year}年${month}月${day}日${hours}:${minutes}:${second}`

拼接html

传统方式
let str = '<div class="box" >';
str += '</div>';

let strs = '<div class="box"></div>';
 strs += '<h2 class="title">哈哈</h2>';
 strs += '<ul class="item" >';
 strs += '<li></li>';
 strs += '</ul>';
 .........

Es6 模式

let str = `<div class="box" ></div>`

let strs = `<div class="box" >
      <h2 class="title">哈哈<h2>
      <ul class="item">
         ${[10,20,30].map(item=>{
             return `<li>${item}</li>`;
         })}
      </ul>
    </div>
 `;