关于JS的一些小笔记

1, 反引号可以转行输出

${var_name}串联字符

var name = '小明';
var age = 20;
var message = ` 你好, ${name}, 你今年 ${age}岁了!`;
console.log(message)

2, 关于 Map 和 Set

Map 方法用 set(此时为方法)接收的值为 key-value 类型，两个参数后的实参会被自动忽略

Set 为构造函数
最大的特点为自动过滤重复的 key 值

Set 是一组 key 值，但是不储存 value 值

数组与对象可用 for…in… 得到对应的 key-value 值。但是对于 Map 和 Set 则不行

数组、Map 和 Set 都属于 iterable(可迭代类型，不包含对象)，均使用 for…of… 来获取 key-value 值

3，减少对全局变量的污染以及对自己代码所用变量纯洁性的维护，可以使用名字变量

4，闭包
闭包即函数作为返回（return）且返回的函数中有包含不属于它函数域内的局部变量（继承的，可访问的不是自己函数内定义的变量）
使用闭包需注意：不要引用任何循环变量，或者后续会发生变化的变量。
参见 for 循环导致 for 循环内参数值永远只能访问到最大适合 for 循环条件的值

如果一定要调用循环变量，可以加一层函数，用函数变量去过滤循环变量。或者直接使用 ES6 的 let 来定义循环变量。

5，关于原生 js 的 querySelector()以及 querySelectorAll()
document.querySelector(“.classname”)
document.querySelector(“#elementid”)
十分类似于 jQuery

6，form 表单提交时，如果 form 元素没有 name 属性，则该元素不会被提交。
同时，禁用状态的元素也不会被提交

7，input 文件类型（file）上传文件时可以验证文件类型，以便于文件附件上传

8，原生 js 获取某个元素，并把该元素放置到另外一个元素 HTML 内的时候，appendChild(apphtml)中的参数只能是一个元素结点（一个包裹层），否则会提示插入的元素不是 node 结点类型，导致插入失败。

9，滚动获取滚动到顶部的距离

window.onscroll = function(){ 
    var t = document.documentElement.scrollTop || document.body.scrollTop;  
    console.log(t) 
} 

十分重要的一个注：scrollTop 获取值的兼容性要务必重视，不要因为 document.body.scrollTop 写起来简单些就直接用，可能你用它获取到的值永远都是 0。

document.documentElemnent.scrollTop 可以直接从浏览器里面获取到滚动到顶部的值。

10，jQuery 的一些动画效果。

除了我们常见的.toggle(time);.slideToggle(time);.fadeToggle(time);
还有.animate({css},time,function)
三个参数依次为：需要改变的 css 效果；完成这些效果需要的时间；动画完成后调用的函数。

除此之外还能用.delay()串联动画

11，涉及到异步代码，无法在调用时捕获，原因就是在捕获的当时，回调函数并未执行。