Skip to content

Commit 827c118

Browse files
WindRunnerMaxWindRunnerMax
committed
21/01/17
1 parent c31a5c1 commit 827c118

4 files changed

Lines changed: 223 additions & 0 deletions

File tree

‎CATALOG.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
# Catalog
22

3+
**2021-01-16**
4+
> 第327题：[函数式编程的理解](JavaScript/函数式编程的理解.md)
5+
6+
<br>
7+
38
**2021-01-15**
49
> 第326题：[React中的高阶组件](React/React中的高阶组件.md)
510

‎JavaScript/Js实用小技巧.md‎

Lines changed: 194 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,194 @@
1+
# Js实用小技巧
2+
这是一份`Js`实用小技巧，也可以是一份`Js`挨打小技巧，下面的一系列操作虽然能够在一定程度上使代码更加简洁，但是在缺少注释的情况下会降低可读性，所以需要谨慎使用这些黑魔法。
3+
4+
5+
## 位元算
6+
7+
### 取整
8+
9+
```javascript
10+
console.log(~~(11.11)); // 11
11+
console.log(11.11 >> 0); // 11
12+
console.log(11.11 << 0); // 11
13+
console.log(11.11 | 0); // 11
14+
console.log(11.11 >>> 0); // 11 // 注意 >>> 不可对负数取整
15+
```
16+
17+
### 判断奇偶
18+
19+
```javascript
20+
console.log(7 & 1); // 1
21+
console.log(8 & 1) ; // 0
22+
```
23+
24+
### 转换布尔值
25+
26+
```javascript
27+
console.log(!!7); // true
28+
console.log(!!0); // false
29+
console.log(!!-1); // true
30+
console.log(!!0.71); // true
31+
console.log(!!""); // false
32+
console.log(!![]); // true
33+
console.log(!!{}); // true
34+
console.log(!!null); // false
35+
console.log(!!undefined); // false
36+
```
37+
38+
### 移位运算
39+
40+
```javascript
41+
console.log(16 >> 1); // 8
42+
console.log(16 << 2); // 64
43+
console.log(1 >>> 1); // 2
44+
45+
```
46+
47+
### 进行值交换
48+
49+
```javascript
50+
let a = 7;
51+
let b = 1;
52+
a ^= b;
53+
b ^= a;
54+
a ^= b;
55+
console.log(a); // 1
56+
console.log(b); // 7
57+
58+
// 也可以借助数组
59+
b = [a, a = b][0];
60+
61+
// 当然解构赋值更简单
62+
[a, b] = [b, a];
63+
```
64+
65+
### 判断符号是否相同
66+
67+
```javascript
68+
let a = 1;
69+
let b = 1;
70+
console.log((a ^ b) >= 0); // true
71+
console.log((a ^ -b) >= 0); // false
72+
```
73+
74+
### 检查数字是否不相等
75+
76+
```javascript
77+
let a = 111;
78+
if(a ^ 111) console.log("Not equal");
79+
if(a !== 111) console.log("Not equal");
80+
if(a ^ 11111) console.log("Not equal"); // Not equal
81+
```
82+
83+
### 判断是否2的整数幂
84+
85+
```javascript
86+
const check = n => !(n & (n - 1));
87+
console.log(check(7)); // false
88+
console.log(check(8)); // true
89+
```
90+
91+
### 条件语句
92+
93+
```javascript
94+
let bool = true;
95+
if(bool) console.log(1); // 1
96+
console.log(bool && console.log(1)); // 1
97+
```
98+
99+
### 四舍五入取整
100+
101+
```javascript
102+
const round = n => n + 0.5 * (n > 0 ? 1 : -1) | 0;
103+
console.log(round(0)); // 0
104+
console.log(round(1.1)); // 1
105+
console.log(round(1.6)); // 2
106+
console.log(round(-1.1)); // -1
107+
console.log(round(-1.6)); // -2
108+
```
109+
110+
## 字符串
111+
112+
### 取随机字符串
113+
114+
```javascript
115+
console.log(Math.random().toString(16).slice(2)); // c21f331e6ce2b
116+
```
117+
118+
### 重复字符串
119+
120+
```javascript
121+
const repeat = (n, str) => Array(n+1).join(str);
122+
console.log(repeat(5, "ab")); // ababababab
123+
console.log("ab".repeat(5)); // ababababab // ES6
124+
```
125+
126+
### 创建链接
127+
128+
```javascript
129+
console.log("Google".link("www.google.com")); // <a href="www.google.com">Google</a>
130+
```
131+
132+
## 其他
133+
134+
### 正确处理异常的方法
135+
136+
```javascript
137+
try {
138+
// something
139+
} catch (e) {
140+
window.location.href = "http://stackoverflow.com/search?q=[js]+" + e.message;
141+
}
142+
```
143+
144+
### 优雅地证明自己NB
145+
146+
```javascript
147+
console.log(([][[]]+[])[+!![]]+([]+{})[!+[]+!![]]);
148+
```
149+
150+
### 可以替代undefined的操作
151+
152+
```javascript
153+
console.log(void 0); // undefined
154+
console.log(""._); // undefined
155+
console.log(1.._); // undefined
156+
console.log(0[0]); // undefined
157+
```
158+
159+
### 替代Infinity
160+
161+
```javascript
162+
console.log([-1/0, 1/0]); // [-Infinity, Infinity]
163+
```
164+
165+
### 清空数组
166+
167+
```javascript
168+
let arr = [1];
169+
arr.length = 0;
170+
console.log(arr); // []
171+
```
172+
173+
### 快速判断IE8以下的浏览器
174+
175+
```javascript
176+
var isIE8 = !+"1";
177+
console.log(isIE8); // false // Chrome 87
178+
```
179+
180+
181+
## 每日一题
182+
183+
```
184+
https://github.com/WindrunnerMax/EveryDay
185+
```
186+
187+
## 参考
188+
189+
```
190+
https://zhuanlan.zhihu.com/p/150556186
191+
https://zhuanlan.zhihu.com/p/262533240
192+
https://github.com/jed/140bytes/wiki/Byte-saving-techniques
193+
```
194+

‎JavaScript/Js将字符串转数字的方式.md‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,7 @@ console.log(Number("0xF")); // 15
8080
位运算是直接对二进制位进行计算，它直接处理每一个比特位，是非常底层的运算，好处是速度极快，缺点是很不直观。位运算只对整数起作用，如果一个运算数不是整数，会自动转为整数后再运行。在`JavaScript`内部，很多时候数值都是以`64`位浮点数的形式储存，但是做位运算的时候，是以`32`位带符号的整数进行运算的，并且返回值也是一个`32`位带符号的整数。
8181

8282
```javascript
83+
// ~~
8384
console.log(~~(true)); // 1
8485
console.log(~~(false)); // 0
8586
console.log(~~(null)); // 0
@@ -90,6 +91,28 @@ console.log(~~("123")); // 123
9091
console.log(~~(" 123")); // 123
9192
console.log(~~("123.12")); // 123
9293
console.log(~~("0xF")); // 15
94+
// <<
95+
console.log(true << 0); // 1
96+
console.log(false << 0); // 0
97+
console.log(null << 0); // 0
98+
console.log(undefined << 0); // 0
99+
console.log(NaN << 0); // 0
100+
console.log("" << 0); // 0
101+
console.log("123" << 0); // 123
102+
console.log(" 123" << 0); // 123
103+
console.log("123.12" << 0); // 123
104+
console.log("0xF" << 0); // 15
105+
// >>
106+
console.log(true >> 0); // 1
107+
console.log(false >> 0); // 0
108+
console.log(null >> 0); // 0
109+
console.log(undefined >> 0); // 0
110+
console.log(NaN >> 0); // 0
111+
console.log("" >> 0); // 0
112+
console.log("123" >> 0); // 123
113+
console.log(" 123" >> 0); // 123
114+
console.log("123.12" >> 0); // 123
115+
console.log("0xF" >> 0); // 15
93116
```
94117

95118
## 一元运算符

‎README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@
124124
* [Js中Reflect对象](JavaScript/Js中Reflect对象.md)
125125
* [Js中的逻辑运算符](JavaScript/Js中的逻辑运算符.md)
126126
* [Js将字符串转数字的方式](JavaScript/Js将字符串转数字的方式.md)
127+
* [函数式编程的理解](JavaScript/函数式编程的理解.md)
127128

128129
## Browser
129130
* [跨域问题与解决方案](Browser/跨域问题.md)

0 commit comments

Comments
 (0)