JS学习笔记

JS学习

一、修改样式属性

对象.style.样式属性 = ‘值’

1、注意

有短横线链接的属性，采取小驼峰命名法

例如：$background-color——》backgroundColor$

• JS可以通过修改类名的方式修改样式，相当于结构体赋值，适用于修改内容较多的情况

2、通过classList修改样式

二、获取表单里面的值

用对象名.value

• $disabled$ 禁用按钮
• $checked$ 勾选框
• $selected$ 多选框

三、定时器函数

开启定时器$setInterval(函数名/需要操作的代码，间隔时间)函数名不要加小括号$

关闭定时器$clearInterval(定时器对象)$

四、删除数组中选中的元素

$arr.splice(开始删除下标，删除数量)$

五、事件类型

1、鼠标事件

• $click鼠标点击$
• $mouseenter鼠标经过$
• $mouseleave鼠标离开$

2、焦点时间

• $focus获得焦点$
• $blur失去焦点$

3、键盘事件

• $keydown键盘按下触发$
• $keyup键盘弹起触发$

4、文本事件

• $input用户输入触发$

六、document通过type获取

七、获得焦点伪类选择器（focus）

仅需要样式改变时可以使用

$.text:focus$

八、事件对象

在事件回调函数中绑定的第一个参数就是事件对象

九、trim方法

可以去掉字符串左右两侧的空格

十、文本框注意事项

• value属性中的内容是文本框中的内容

十一、this

每个函数里面都有this 环境对象

• 普通函数里面this指向的是window

• 

谁调用函数，函数中的this就指向谁

this指向触发者

十二、checked伪类选择器

只选择被勾选的复选框

• 可以利用这个性质判断有几个复选框被选中

十三、全等号（===）

与c++等语言不同，需要三个等号

十四、mouseenter、mouseleave

一般使用这两个事件，这两个事件不会冒泡

mouseover和mouseout会冒泡

十五、获取事件对象的方法

e.target（target就是点击的对象）

e.target.tagName 是点击的对象具体是什么

十六、DOM树获取上/下一个兄弟

• 上一个 $当前兄弟对象.previousElementSibling$
• 下一个 $当前兄弟对象.nextElementSibling$

十七、form表单提交中的问题

1、有时候需要阻止默认提交事件

2、表单清空

reset（）方法

十八、立即调用函数的写法

• ( f u n c t i o n ( ) { } ) ( ) (function()\{\})() (function(){})()
• ! f u n c t i o n ( ) { } ( ) !function()\{\}() !function(){}()

十九、元字符精确匹配

^$/str$/$

二十、元字符量词

• *（>=0次）
• +（>=1次）
• ?（0或1次）
• {n} （必须出现n次）
• {n，}（>=n次）
• {n，m}（n=< x<=m次）

二十一、className与classList的区别

• 前者会覆盖原类名
• 后者不会

二十二、blur和change的区别

• blur失去焦点后会触发
• change失去焦点且修改过内容才会触发

二十三、开发中多使用剩余参数

因为剩余参数是真数组，可以使用pop，push方法

二十四、对象解构注意

• 结构变量名必须和属性名一致

• 对象解构的变量名可以重新改名，结构

  • 旧变量名：新变量名

二十五、什么时候使用原型对象

• 可以把不变的方法，直接定义在prototype对象上，这样所有对象的实例都可以共享这个方法

二十六、浅拷贝怎么理解

• 拷贝对象之后，里面的属性值是简单数据类型直接拷贝值

• 如果属性值是引用数据类型则拷贝的是地址

二十七、直接赋值和浅拷贝有什么区别

• 直接赋值的方法，只要是对象都会相互影响，因为是直接拷贝对象栈里面的地址
• 浅拷贝如果是一层对象，不相互影响，如果出现多层对象拷贝还会相互影响

二十八、深拷贝中的问题

一定要先处理数组在处理对象

二十九、如何深拷贝

• 自己写
• 利用lodash
• 利用JSON

三十、this的指向

1、普通函数

this指向调用者

2、箭头函数

this指向就近外层作用域中的this