关于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，滚动获取滚动到顶部的距离
vue 直接滚动到指定位置

this.$nextTick(()=>{
            document.getElementById(data.id).scrollIntoView({behavior: "smooth"})
          })

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，涉及到异步代码，无法在调用时捕获，原因就是在捕获的当时，回调函数并未执行。