js的几个小技巧和圈套
这里有少量 JavaScript 初学者应该知道的技巧和圈套,假如你已经是专家了,顺便可以温习一下
1.你有没有尝试给一组数字排序?
javascript的sort()函数在默认情况下使用字母数字(字符串Unicode码点)排序
const arr = [1, 2, 5, 10];arr.sort(); // [ 1, 10, 2, 5 ]arr.sort((a, b) => { return a - b;});//[ 1, 10, 2, 5 ]很简单的处理方案,前提是你要知道这个坑
2.new Date()
new Date() 可以接受:
- 没有参数: 返回当前事件
- 一个参数x: 返回1970年1月1日 + x 毫秒
- new Date(1,1,1):返回1901, 2月,1日,由于第一个参数表示1900加1年,第二个参数表示这一年的第二个月,第三个参数显著是这个月第一天
- new Date(2020,1,1) 不会给1990 加上 2020, 它仅仅代表2020
3.replace 并不 “替代”
let s = "bob";let replaced = s.replace("b", "l");console.log(replaced); // loblet replacedOverall = s.replace(/b/g, "l");console.log(replacedOverall); // lol - 你应该知道
replace只会替换第一个匹配的字符 - 假如你想替换所有的匹配字符,你可以使用带
/g的正则
4.比较的时候要注意
console.log("abc" == "abc"); // trueconsole.log(1 == 1); // trueconsole.log([1, 2, 3] == [1, 2, 3]); // falseconsole.log({ a: 1 } == { a: 1 }); // falseconsole.log({} == {}); // false引用类型的数据,具备不同的引用地址,无法用 == 比较
5.数组不是原始数据类型
console.log(typeof {} === "object"); // trueconsole.log(typeof "a" === "string"); // trueconsole.log(typeof 1 === "number"); // trueconsole.log(typeof [] === "object"); // true假如你想知道你的变量是不是数组,你依然可以用
const arr = [1, 2, 3];console.log(Array.isArray(arr)); // true6.闭包
const Greeters = [];for (var i = 0; i < 10; i++) { Greeters.push(function() { return console.log(i); });}Greeters[0](); // 10 Greeters[1](); // 10 Greeters[5](); // 10 这是一道很有名的面试题:
你是不是以为它会输出0,1,2,3.. ? 你会怎么修改让它出入0,1,2,3.. ?
方法1:
用 let 代替 var
let 和 var的不同在于作用域,var的作用域是最近的函数块,let 的作用域是最近的封闭块,封闭块可以小雨函数块(假如不在任何块中,则let 和 var 都是全局的)
方法2:
用bind:
Greeters.push(console.log.bind(null, i))其余方法还有很多,但是我首选这两个
7.谈到bind
class Foo { constructor(name) { this.name = name; } greet() { console.log("hello, this is ", this.name); } someThingAsync() { return Promise.resolve(); } asyncGreet() { this.someThingAsync().then(this.greet); }}new Foo("dog").asyncGreet();假如你认为这个程序会提醒 TypeError: Cannot read property 'name' of undefined,给你一分
起因: greet没有正确的在上下文中运行,同样这个问题也有很多处理方案:
我个人喜欢:
asyncGreet() { this.someThingAsync().then(this.greet.bind(this)); }假如你认为 greet 不应该在实例上下文之外的运行,你可以在类的constructor中绑定它:
constructor(name) { this.name = name; this.greet = this.greet.bind(this); }你还应该知道箭头函数可以用来保留上下文,这个方法也可以:
asyncGreet() { this.someThingAsync().then(() => { this.greet(); }); }总结
假如还有什么我应该提到的,请告诉我!
说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » js的几个小技巧和圈套
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » js的几个小技巧和圈套