本篇内容主要讲解“Javascript运算符和数据类型如何转换”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Javascript运算符和数据类型如何转换”吧!
一。if else 语句
if else用来表示中文里的 如果…, 就…, 否则……
// 条件为true, 执行if后面的括号代码, 否则执行 else 后面括号代码
if(条件) {
// todo
}else{
// todo
}
// 多重判断
if(){
} else if() {
} else {
}
具体例子
<script>
var a = 100;
var b = 20;
debugger;
if (a > b) {
console.log('a 大于 b');
} else {
console.log('a 小于 b');
}
</script>
<!-- 多重判断 -->
<script>
var gender = prompt('请输入性别');
if (gender === '男') {
alert('你是个男的');
} else if(gender === '女') {
alert('你是个妹子');
} else {
alert('性别未知');
}
</script>
二。类型转换
【腾讯文档】05-类型转换-备课
问题: 以下代码会打印什么
<script>
var a = 'aa';
var b = 'bb';
if (a+b) {
console.log('xxxxxxx');
} else {
console.log('yyyyyyyy');
}
</script>
1.显式转换
1.Number(变量名)将其他类型转为数字//快捷方式 变量名*1
2.String(变量名);转字符串// 变量名+ ‘’
3.Boolean(变量名);//!!变量名
<script>
var str = '123';
// 转换为数字
var num = Number(str);
console.log(num);
console.log(typeof num);
// 结果为NaN
var str2 = 'abcd';
var num2 = Number(str2);
console.log(num2);
//结果为0
var str3 = '';
var num3 = Number(str3);
console.log(num3);
</script>
2.隐式转换
<script>
var a = 'aa';
var b = 'bb';
// a+b => aabb aabb会自动转换为true, 所以执行结果为 xxxxxx
if (a+b) {
console.log('xxxxxxx');
} else {
console.log('yyyyyyyy');
}
</script>
3.数据类型转换规则
【腾讯文档】类型转换规则 腾讯文档
三。运算符
【腾讯文档】js运算符思维导图 腾讯文档
1.算术运算
1.+-*/
2.相加的生活,有一个数为字符串,则+表示字符串拼接
<script>
var a = 20;
var b = 7;
var num1 = a+b;
var num2 = a-b;
var num3 = a*b;
var num4 = a/b;
// 计算余数
var num5 = a % b;
console.log(num1);
console.log(num2);
console.log(num3);
console.log(num4);
console.log(num5);
</script>
<script>
// 有一个数为字符串, 则+表示字符串拼接
var a = 100;
var b = prompt('请输入数字');
console.log(typeof b);
console.log(a+Number(b));
</script>
2.关系运算符(比较运算符)
var a = 10;
var b = '10';
console.log(a == b); // true,类型不同, 先转换成相同类型
console.log(a === b); // false, 类型不同为false, 类型相同再判断值是否相同
3.逻辑运算符
1.逻辑非!,取反即可
var boo1 = false; // !boo1 => true !!bool
var num = 100; // !num => false
var str = ''; // !str => true
var obj = null; // !obj => true
var username; // !username => true
2.逻辑与&&:中文里并且的意思
规律:前者为true取后者,否则取前者
当都是布尔的时候,只有当俩者为true时结果为true,否则为false。
// 计算以下式子的值(参与运算的都是布尔类型)
true && true => true
true && false => false
false && true => false
false && false => false
// 计算以下式子的值(参与运算的是其他类型)
var num1 = 100;
var num2 = 0;
num1 && num2 => 0
num2 && num1 => 0
var a = 'web';
var b;
a && c => // 报错,计算的结果为c, 而c没有声明
b && c => undefined
3.逻辑或||:中文里的或者意思
规律:前者为true取前者,否则取后者
当都是布尔的生活,只要有一个为true,结果皆为true,否则为false。
<script>
console.log(true || true ); // true
console.log(true || false ); // true
console.log(false || true ); // true
console.log(false || false ); // false
var num1 = 100;
var num2 = 0;
console.log(num1 || num2 ); // 100
console.log(num2 || num1 ); // 100
var a = 'web';
var b;
console.log(a || c ); // web
console.log(b || c ); // 报错,计算的结果为c, 而c没有声明
</script>
4.一元计算符
i++,i先用原值运算,再自加1,后面要是有i它值为i+1;
++i,i先是给自己加1,再进行运算。
<!-- ++ 自加 -->
<script>
var i = 10;
var j = 20;
var i2 = 10 + i++; // i先运算再自加1
console.log('i2',i2); // 20
console.log('i',i); // 11
var j2 = 10 + ++j; // j先自加1再运算
console.log('j2',j2); // 31
console.log('j',j); // 21
</script>
自减运算, 道理类似自加运算
<script>
var i = 10;
var j = 20;
var i2 = 10 + i--; // i先运算在自减1
console.log('i2',i2); // 20
console.log('i',i); // 9
var j2 = 10 + --j; // j先自减1再运算
console.log('j2',j2); // 29
console.log('j',j); // 19
</script>
练习:
<!-- 练习1 -->
<script>
var i = 10;
var i2 = 10 + i++; // i=10 i2=20
var i3 = 10+ ++i; // i=12 i3=22
var i4 = 10 + i--; // i=11 i4=22
var i5 = 10 + --i; // i =10 i5=20
// 求i,i2,i3,i4,i5的值
console.log(i,i2,i3,i4,i5);
var count = 60; // 说出控制台打印的值
console.log(--count); // 59
console.log(--count); // 58
console.log(--count);//57
console.log(--count);//56
console.log(--count); //55
</script>
<!-- 练习2 -->
<script>
var i = 1;
var j = 1;
var a = 10;
// 11 10+ 1
var b = a + i++;
// 11+ 3 + 3 + 2
var c = b + ++i + i++ + ++j;
var d = a + b + c;
// i=4 j=2 a=10,b=11, c=19 d=40
console.log(i,j,a,b,c,d);
</script>
5.复合赋值运算符
<script>
var a = 10;
a += 10;
console.log(a); // 20
a -= 10;
console.log(a); // 10
a *= 10;
console.log(a); // 100
a /= 10;
console.log(a); // 10
a %= 10;
console.log(a); // 0
</script>
6.运算符优先级
() > 自加(自减) > 算术 > 关系 > 逻辑 > 赋值
到此,相信大家对“Javascript运算符和数据类型如何转换”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。