习题1 阿里古早
引用数据类型面试题
考点: JS 数据存储机制
let a = {
n : 1
};
let b = a;
a.x = a = {
n : 2
};
console.log(a.x);
console.log(b);
// 解析一
a = b = 3 等同于
a = 3
b = 3
所以 a.x = {n:2} ; a = {n:2}
//JS 赋值是从右往左,由于.(成员访问)的优先级较高,所以先a.x = {n:2}
此时 a = {n:1} ,然后再 a = {n:2}
// 解析二
a.x = {n:2} 相当于a有一个属性 x,属性值为{n:2}的地址
然后
a 与 {n:2}的地址关联 (此时 a 里已经没有 x 属性了)
tips: JS 的赋值特点不是拷贝模式,而是关联引用模式
图解
变形
let a = {
n: 1
};
let b = a;
a.x = b ;
console.log(a.x);
console.log(b); // { n : 1 , x : {...}}
// {...}是x:{n:1, x: {...}的无限嵌套 引起堆的溢出
变形
基于未变形的结果
a.n = 1000;
输出 b.n // 1
b.x.n // 1000
b.x 与 a 公用一个堆内存 AAAFFF111
习题2 鹅厂古早
考点: + 运算符与字符串相遇
JS 中的'+' , '-', * , / 进行数学运算
遇到不是数字类型的值,会先 Number()转换为数字再运算
但是 JS 加法有特殊情况, 相加过程中遇到字符串会直接变为字符串拼接
<script>
var a = 'abc' + 123 + 456;
var b = '456' - '123';
var c = 100 + true + 21.2 + null + undefined + 'Tencent' + [] + null + 9 + false;
console.log(a, b, c);
// 'abc123456'
// 333
// 'NaNTencentnull9false'
</script>
习题3 鹅厂古早
考点:
- parseInt/parseFloat 用来检测字符串中的数字
传递的不是字符串,也要先转换为字符串再开始查找
机制:
从字符串左侧第一个字符开始查找,把找到的有效数字字符转换为数字,遇到一个非有效数字,则停止查找!一个有效数字都找不到,结果是 NaN
-
NaN 与谁都不相等
-
typeof 返回的是字符串型的数值类型
let num = parseFloat('width : 100px');
if (num == 100) {
alert(1);
} else if (num == NaN) {
// NaN 与任何值都不相等
// NaN !== NaN
alert(2);
} else if (typeof num == 'number') {
// typeof NaN == 'number'
alert(3);
} else {
alert(4)
}
// => 3
习题4
var a = 0;
var b = a;
b++;
alert(a); // => '0'
var o = {};
o.a = 0;
var b = o;
b.a = 10;
alert(o.a); // => 10
习题5 能输出 'undefined' 的有哪些?
-
console.log(alert(1)); x
第一步 alert(1)
第二步 console.log(undefined);
解析:
alert本身是一个函数,执行浏览器内置的 alert 方法,执行方法的时候弹出一个'1'(这个方法的功能)
此方法没有返回值,所以返回 undefined
-
parseInt(undefined) x
解析:
1.Number()按照浏览器底层机制将其他数据类型转换为数字 - 字符串 是否包含非有效数字 ,包含直接是 NaN; '' => 0 - 布尔 true => 1 false => 0 - null => 0 - undefined => NaN - 引用数据类型都要先转为字符串然后再转为数字 - {}/正则/函数等 => NaN - [] => '' => 0 - [12] => '12' => 12 - [12,23] => '12,23' => NaN - ... 2. parseInt/parseFloat 遵循按照字符串从左到右查找的机制找到有效数字字符(所以传递的一定是字符串,不是也要转换为字符串然后再查找) 找不到就统统 NaN parseInt(undefined) => parseInt('undefined') => NaN parseInt('') 因为什么有效字符也没找到 => NaN Number('') => 0 C++ 机制 空字符串就是 0
let x = [1,2,3];
let y = x;
let z = [4,5,6];
y[0] = 10;
y = z;
z[1] = 20;
x[2] = z = 30;
console.log(x,y,z);
x [10,2,30]
y [4,20,6]
z 30
习题6 循环判断
for (let i = 0; i < 10; i++) {
console.log(i);
break;
}
console.log(i);
输出 0 两次
for (let i = 0; i < 10; i++) {
continue ;
console.log(i);
}
console.log(i);
输出一次 10
for (let i = 1; i <= 10; i += 2) {
if (i <= 5) {
i++;
continue;
} else {
i -= 2;
break;
}
i--;
console.log(i);
}
console.log(i);
输出一次 5
习题7 三元运算符
把下题改写成三元运算符并计算出结果
分清判断与循环
let a = 2;
if (a >= 0 && a < + 20) {
if (a % 2 === 0) {
a += 2;
}
} else {
a -= 2;
}
console.log(a); // => 14
改写: a >= 0 && a < + 20 ? (a % 2 === 0 ?a += 2 : null ):a -= 2
习题8 i++ ++i == 与 ===
考点:
- == 和 ===
== 相等 数据类型不同,先转换为一样的再比较
=== 绝对相等,必须类型和值都相同才为 true
-
switch 判断中,每一种 case 值的比较都是基于 === 来完成
-
switch 有特定应用场景 专用于比较值
- ++ 是纯粹的数学运算
let a = '10';
a == 10 ? a++ : a-- ;
console.log(a); //=> 11
let b = '10';
switch(b){
case 10:a
b++ ;
break;
default:
b --;
}
console.log(b);//=> 9
习题 9 检验数据类型基础知识
-
!! 求布尔值
布尔值为 false 只有五种类型
以上不属于那五种类型 所以是 true
-
第一项:
new Date() 获取当前日期对象
parseInt(new Date()) => NaN
isNaN(...) => true
第二项: 1
true + 1 => 2
第三项 : 'undefined'
2 + 'undefined' => '2undefined'
-
false + true + true + 'boolean' = > '2boolean'
-
'2.6number'
-
false
-
'122'
-
false
-
0
-
'string12false'
-
true + NaN => NaN
-
'boolean' + true => 'booleantrue'
习题 10 逻辑思维判断题
题目:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>计算年终奖</title>
</head>
<body>
工龄: <input type="text" value="0" id="workYear">
<br>
薪资: <input type="text" value="14000" id="workMoney">
<br>
<button id="submit">计算年终奖</button><br>
你的年终奖是 ¥<span id="valBox"></span>
<!-- IMPORT JS -->
<script>
let workYear = document.getElementById('workYear');
let workMoney = document.getElementById('workMoney');
let submit = document.getElementById('submit');
let valBox = document.getElementById('valBox');
submit.onclick = function () {
// 1. 获取文本框中的信息
// 文本框.value 获取输入的内容，格式是字符串
let year = Number(workYear.value);
let money = Number(workMoney.value);
// 条件判断
if (isNaN(year) || isNaN(money)) {
alert('输入的内容是非法格式');
return;
}
// 2. 经过逻辑处理，计算结果
let result = null;
if (year < 1) {
result = money >= 8000 ? money * 1.2 : money;
} else if (year >= 1 && year < 2) {
result = money >= 10000 ? money * 1.7 : money * 1.5;
} else {
result = money >= 12000 ? money * 3.2 : money * 3;
}
// 3.把结果复制给#valBox即可
valBox.innerHTML = result;
}
</script>
</body>
</html>
