短路赋值
作者：互联网
账号: <input type="text"> <br>
密码: <input type="text"> <br>
<button>注册</button>
<script> // 利用短路求值的特点,给变量进行赋值 // 一般是如果变量没有数值的情况下,我们给赋值一个默认值
// 举一个简单的例子 // 例如,input数据数据,如果没有填写数据,我们可以定义一个默认值数据 // 如果不输入密码,我们设定密码的默认值是 666666 6个6 var oBtn = document.querySelector('button');
/* oBtn.onclick = function(){ var num1 = document.querySelectorAll('input')[0].value;
// 执行过程 // document.querySelectorAll('input')[1].value 是 获取input标签中 输入的数据数值 // 如果 有输入的的数据数值 '123456' // 逻辑表达式是 '123456' || '666666' // 逻辑表达式,要判断,两个表达式是false,还是true // 也就是会将 '123456' 和 '666666' 自动转化为 布尔类型 来进行判断 决定整个逻辑运算符的最终结果 // 只是将 '123456' 自动转化为 布尔类型看看 并不是真的就把 '123456' 变成了 布尔值 // 自动转化为false的情况只有五种 数值0 空字符串 undefined null NaN // '123456' 如果 自动转化为 布尔类型是 true // 逻辑运算符第一个表达式的结果是 true // 逻辑或 第一个表达式 结果是 true 会引发短路求值,第二个表达式不会执行 // 给 num2 赋值的数值是 '123456'
// 当 document.querySelectorAll('input')[1].value 没有输入内容时 // 获取到的结果是 '' 空字符串 // 逻辑运算符,实际是 '' || '666666' // 第一个表达式是 '' 空字符串 自动转化为布尔类型 false // 第一个表达式是 false , 不能决定逻辑或表达式的整个的结果 // 第二个表达式就要执行 // 因此给 num2 赋值 先赋值 空字符串 再赋值 '666666' // 等于进行重复赋值,num2中最终存储的是 '666666' 数值 // 也就是 第一个表达式,如果自动转化为布尔类型false,第二个表达式执行 // 最终赋值的数值,是第二个表达式的数值
var num2 = document.querySelectorAll('input')[1].value || '666666' ;
// 在模板字符串中,解析变量的语法规范 // 在模板字符串中 使用 ${} 包裹变量,这样就会解析变量中存储的数值,输出到字符串中 console.log(`账号是:${num1},密码是:${num2}`); }
*/
// 如果是if判断语句怎么写
oBtn.onclick = function(){ var num1 = document.querySelectorAll('input')[0].value; var num2 = document.querySelectorAll('input')[1].value;
// 判断如果 num2 是 空字符串,也就是没有输入数据 // 就给 num2 进行赋值操作 // 没有else,也就是 不是空字符串的时候,不做任何操作 if(num2 == ''){ num2 = '666666'; }
console.log(`账号是:${num1},密码是:${num2}`);
}
// 总结
// var 变量 = 逻辑运算符
// 如果 逻辑运算符 出现短路求值情况,只执行了第一个表达式 // 只会给变量赋值 第一个表达式 的数值 // 如果没有触发短路求值,两个表达式都执行了 // 会给变量先赋值第一个表达式的数值,再给变量赋值第二个表达式的数值 // 变量中最终存储的是表达式2的数值
// 总之,不管是 逻辑或 还是 逻辑与 // 执行第一个表达式,赋值第一个表达式的数值 // 执行两个表达式,最终存储的是第二个表达式的数值
<script> // 利用短路求值的特点,给变量进行赋值 // 一般是如果变量没有数值的情况下,我们给赋值一个默认值
// 举一个简单的例子 // 例如,input数据数据,如果没有填写数据,我们可以定义一个默认值数据 // 如果不输入密码,我们设定密码的默认值是 666666 6个6 var oBtn = document.querySelector('button');
/* oBtn.onclick = function(){ var num1 = document.querySelectorAll('input')[0].value;
// 执行过程 // document.querySelectorAll('input')[1].value 是 获取input标签中 输入的数据数值 // 如果 有输入的的数据数值 '123456' // 逻辑表达式是 '123456' || '666666' // 逻辑表达式,要判断,两个表达式是false,还是true // 也就是会将 '123456' 和 '666666' 自动转化为 布尔类型 来进行判断 决定整个逻辑运算符的最终结果 // 只是将 '123456' 自动转化为 布尔类型看看 并不是真的就把 '123456' 变成了 布尔值 // 自动转化为false的情况只有五种 数值0 空字符串 undefined null NaN // '123456' 如果 自动转化为 布尔类型是 true // 逻辑运算符第一个表达式的结果是 true // 逻辑或 第一个表达式 结果是 true 会引发短路求值,第二个表达式不会执行 // 给 num2 赋值的数值是 '123456'
// 当 document.querySelectorAll('input')[1].value 没有输入内容时 // 获取到的结果是 '' 空字符串 // 逻辑运算符,实际是 '' || '666666' // 第一个表达式是 '' 空字符串 自动转化为布尔类型 false // 第一个表达式是 false , 不能决定逻辑或表达式的整个的结果 // 第二个表达式就要执行 // 因此给 num2 赋值 先赋值 空字符串 再赋值 '666666' // 等于进行重复赋值,num2中最终存储的是 '666666' 数值 // 也就是 第一个表达式,如果自动转化为布尔类型false,第二个表达式执行 // 最终赋值的数值,是第二个表达式的数值
var num2 = document.querySelectorAll('input')[1].value || '666666' ;
// 在模板字符串中,解析变量的语法规范 // 在模板字符串中 使用 ${} 包裹变量,这样就会解析变量中存储的数值,输出到字符串中 console.log(`账号是:${num1},密码是:${num2}`); }
*/
// 如果是if判断语句怎么写
oBtn.onclick = function(){ var num1 = document.querySelectorAll('input')[0].value; var num2 = document.querySelectorAll('input')[1].value;
// 判断如果 num2 是 空字符串,也就是没有输入数据 // 就给 num2 进行赋值操作 // 没有else,也就是 不是空字符串的时候,不做任何操作 if(num2 == ''){ num2 = '666666'; }
console.log(`账号是:${num1},密码是:${num2}`);
}
// 总结
// var 变量 = 逻辑运算符
// 如果 逻辑运算符 出现短路求值情况,只执行了第一个表达式 // 只会给变量赋值 第一个表达式 的数值 // 如果没有触发短路求值,两个表达式都执行了 // 会给变量先赋值第一个表达式的数值,再给变量赋值第二个表达式的数值 // 变量中最终存储的是表达式2的数值
// 总之,不管是 逻辑或 还是 逻辑与 // 执行第一个表达式,赋值第一个表达式的数值 // 执行两个表达式,最终存储的是第二个表达式的数值
标签：num2,短路,数值,input,666666,表达式,赋值 来源： https://www.cnblogs.com/ht955/p/14021339.html