一、数据类型
JavaScript中共有两种数据类型,分别是基本数据类型和引用数据类型(Object类型)。
1. 基本数据类型:number、string、boolean、undefined、null。
2. 引用数据类型:对象、数组、函数。
3. typeof 操作符
- 数值——返回 “number”
- 字符串——返回 “string”
- 布尔值——返回 “boolean”
- 未定义——返回 “undefined”
- null 或 对象——返回 “Object”
- 函数——返回 “function”
二、EL表达式
1. 语法结构:${expression} 。
2. EL 提供“.“和“[ ]“两种运算符来存取数据。
三、ES6 扩展运算符( ... )
1. 扩展运算符用三个点号表示,功能是把数组或类数组对象展开成一系列用逗号隔开的值。
var str = 'hello'
var arr = [1, 2, 3]
var obj = {
x:1,
y:2,
}
console.log(...str) // h e l l o
// 字符串转数组
console.log([...str]) // [ 'h', 'e', 'l', 'l', 'o' ]
console.log({...str}) // { '0': 'h', '1': 'e', '2': 'l', '3': 'l', '4': 'o' }
console.log(...arr) // 1 2 3
console.log([...arr]) // [ 1, 2, 3 ]
console.log({...arr}) // { '0': 1, '1': 2, '2': 3 }
console.log({...obj}) // { x: 1, y: 2 }
2. 应用场景
(1)数组拼接,代替 concat 方法
var arr1 = [1, 2, 3];
var arr2 = [4, 5, 6];
var arr3 = [...arr1, ...arr2];
console.log(arr3); // [ 1, 2, 3, 4, 5, 6 ]
(2)数组深拷贝
var arr1 = [1, 2, 3];
var arr2 = arr1;
var arr3 = [...arr1];
console.log(arr1 === arr2); // true, 说明arr1和arr2指向同一个数组
console.log(arr1 === arr3); // false, 说明arr1和arr3指向不同数组
(3)数组最大值
var arr1 = [1, 2, 3];
var arr2 = Math.max(...arr1);
console.log(arr2); // 3
(4)数组去重
var arr1 = [1, 2, 2, 3];
var arr2 = [...new Set(arr1)];
console.log(arr2); // [1, 2, 3]
(5)函数调用传参
var foo = function(a, b, c) {
console.log(a);
console.log(b);
console.log(c);
}
var arr = [1, 2, 3];
// 传统写法
foo(arr[0], arr[1], arr[2]);
// 使用扩展运算符
foo(...arr);
// 1
// 2
// 3
参考:
四、Rest运算符( ... )
1. Rest运算符也用三个点号表示,不过其功能与扩展运算符恰好相反,把逗号隔开的值序列组合成一个数组。
2. 应用场景
(1)配合解构赋值使用 (只能放在最后一位,否则会报错)
var [a, ...args] = [1, 2, 3, 4];
console.log(a); // 1
console.log(args); // [2, 3, 4]
(2)函数调用传参
// 主要用于不定参数,所以ES6开始可以不再使用arguments对象
var bar = function(...args) {
for (let el of args) {
console.log(el);
}
}
bar(1, 2, 3, 4);
// 1
// 2
// 3
// 4
var bar = function(...args) {
console.log(args);
}
bar('h', 'e', 'l', 'l', 'o');
// [ 'h', 'e', 'l', 'l', 'o' ]
bar = function(a, ...args) {
console.log(a);
console.log(args);
}
bar(1, 2, 3, 4);
// 1
// [ 2, 3, 4 ]
参考:
五、位运算符
运算符 | 描述 | 例子 | 等同于 | 结果 | 十进制 |
---|---|---|---|---|---|
& | 与 | 5 & 1 | 0101 & 0001 | 0001 | 1 |
| | 或 | 5 | 1 | 0101 | 0001 | 0101 | 5 |
~ | 非 | ~ 5 | ~0101 | 1010 | 10 |
^ | 异或 | 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 |
<< | 零填充左位移 | 5 << 1 | 0101 << 1 | 1010 | 10 |
>> | 有符号右位移 | 5 >> 1 | 0101 >> 1 | 0010 | 2 |
>>> | 零填充右位移 | 5 >>> 1 | 0101 >>> 1 | 0010 | 2 |
JavaScript 将数字存储为 64 位浮点数,但所有按位运算都以 32 位二进制数执行。
在执行位运算之前,JavaScript 将数字转换为 32 位有符号整数。
执行按位操作后,结果将转换回 64 位 JavaScript 数。
上面的例子使用 4 位无符号二进制数。所以 ~ 5 返回 10。
由于 JavaScript 使用 32 位有符号整数,JavaScript 将返回 -6。
00000000000000000000000000000101 (5)
11111111111111111111111111111010 (~5 = -6)
有符号整数使用最左边的位作为减号。
负数是正数的二进制补码加 1 。
把十进制转换为二进制
function dec2bin(dec){
return (dec >>> 0).toString(2);
}
把二进制转换为十进制
function bin2dec(bin){
return parseInt(bin, 2).toString(10);
}
六、数组方法
1. Array.prototype.filter()
filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。
var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]
持续更新中。。。