🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
### 变量类型转换 - 数据类型转换 - 例子:计算两个文本框的和 - 显式类型转换(强制类型转换) - `parseInt()` 去除小数、`parseFloat() ` 保留小数:从左至右提取数字,遇到不是数字跳出 - `NaN ` 的意义和检测:`Not a Number` - NaN: NaN 和任何值都不相等,包括它自己 - 使用 ` isNaN()` 检测是否是全是数字 - ``` Number() 转换数值,String() 转换字符串,Boolean() 转换布尔值 ``` - 隐式类型的转换 - `== `:先转换类型 再比较 对比 `=== `:全等于,不转换类型直接比较 - ` - `:数字相减 对比 ` +`:字符串连接、数字相加 - ```js 5 + null // 返回 5 因为 null 被转换为 0 "5" + null // 返回 "5null" 因为 null 被转换为 "null" "5" + 2 // 返回 52 因为 2 被转换为 "2" "5" - 2 // 返回 3 因为 "5" 被转换为 5 "5" * "2" // 返回 10 因为 "5" 和 "2" 被转换为 5 和 2 ``` - 更多可用于将数值转换为字符串的方法: | 方法 | 描述 | | :-------------- | :----------------------------------------------------- | | toExponential() | 返回字符串,对数字进行舍入,并使用指数计数法来写。 | | toFixed() | 返回字符串,对数字进行舍入,并使用指定位数的小数来写。 | | toPrecision() | 返回字符串,把数字写为指定的长度。 | - 代码: ```HTML <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>变量类型转换</title> <style></style> <script> window.onload = function () { // 封装 getElementById 函数 function get(id) { return document.getElementById(id); } let t1 = get('t1'); let t2 = get('t2'); let b1 = get('b1'); let s1 = get('s1'); let s2 = get('s2'); b1.onclick = function (){ if (isNaN(t1.value)) { s1.innerHTML = '<br>' + t1.value + '不是数字'; } else if (isNaN(t2.value)) { s1.innerHTML = '<br>' + t2.value + '不是数字'; } else { console.log('t1:',typeof t1.value, 't2',typeof t2.value); let val = parseInt(t1.value) + parseInt(t2.value); let val2 = parseFloat(t1.value) + parseFloat(t2.value); s1.innerHTML = '<br>int结果:' + val+ '<br>float结果:' + val2; console.log(typeof val); // == 和 - 隐式转换 let a = t1.value ; let b = t2.value; if (a == b) { s2.innerHTML = 'a == b' + '<br>a - b = ' + (a - b) + '<br>a + b = ' + (a + b); } else if (a === b) { s2.innerHTML = 'a === b!'; } else { s2.innerHTML = 'a不等于b!' + '<br>a - b = ' + (a - b) + '<br>a + b = ' + (a + b); } } } } </script> </head> <body> <input type="text" name="" id="t1"> <input type="text" name="" id="t2"> <input type="button" name="" id="b1" value="计算"> <div> <span id="s1"></span> </div> <div> <span id="s2"></span> </div> </body> </html> ```