千锋教育JavaScript全套视频教程（10天学会Js，前端javascrip
字符对应的ASC码值
97 ：a
65 ：A
48 ：0
32 ：空格
12 ：回车
10：ctrl+回车
键盘事件
键盘事件通常都为document
键盘弹起时刻触发：document.onkeyup
键盘按下时刻触发：document.onkeydown
生成一个字符时触发：document.onkeypress
判断ctrl是否按下：ctrlkey
通过dom节点方式绑定
document.getElementsByTagName("button")[1];
缺陷：
a.无法为同一个元素多次绑定相同的事件
b.无法决定事件流的传递是冒泡还是捕获
解决方案:事件监听
dom节点.addEventListener("去掉on的事件名",事件体回调函数,[冒泡false/捕获true]);
好处:a.可以为同一个元素多次绑定相同的事件
捕获和冒泡同时存在，则先捕获后冒泡
事件的解绑就是将事件赋值为null
2.事件监听的解绑
必须解绑的回调函数和绑定的回调函数是同一个
事件的委托:子元素触发的事件，但是功能由父元素完成
事件委托依赖于事件流的冒泡
1.可以将批量绑定的子元素事件，绑定至父元素，从而大大提高程序运行效率
问题:怎么获取真实触发事件的事件元素
获取真实触发事件的事件元素 evt.target || evt.srcElement
事件委托的的好处2:可以为未来的元素，提前添加事件
先有down,再有move和up
# 面向过程编程和面向对象编程思想的区别
00
```javascript
1.面向过程编程:强调步骤顺序
程序 = 算法 + 语法;
#面向过程编程思想的缺陷:
a.随着问题规模的增加，代码逐渐难以控制
b.复用性很差，只能复用函数
2.面向对象的编程:强调对象(最后在考虑过程，但肯定不是抛弃了过程)
程序 = 对象1 + 对象2 + ... + 对象n
对象:万物结尾对象
# 类和对象的概念
```javascript
属性->抽象时的名词
name
age
score
方法->抽象时的动词
doHomework
eat
杨戬 女娲 玉帝 God
让大家分类时我们在干什么?
对每一个对象进行抽象
抽象->对事物加以描述的过程
#类:拥有相同属性和行为的对象的集合(模板)
#对象:类的实例化(强调真实存在且唯一性)
let arr = new Array(1,2,3);
let str = new String("heihei");
let reg = new RegExp('heiehi');
let date = new Date();
#目标:为了创建自定义类型
let s1 = new Student("老王","18",100);
```
# ES5创建类
```javascript
JS运用了面向对象的思想，但是确没有类的语法
#解决方案:用函数模拟类,被当做类的函数本质是构造函数
#this
1.与事件体连用,代表触发该事件的元素
2.与普通函数连用,代表调用该函数的对象
3.与箭头函数连用,代表其父元素的前缀
4.与构造方法连用,代表new出来的对象
function Student(name,age,score){
//成员属性的创建
this.name = name;
this.age = age;
this.score = score;
this.doHomework = function(){
console.log("doHomework");
}
this.eat = function(){
console.log("eat");
}
//当一个成员函数要使用其他的成员，必须添加前缀this
this.showValue = function(){
console.log(this.name,this.age,this.score);
this.eat();
this.doHomework();
}
}
let s1 = new Student("坤坤",18,100);
// console.log(s1.name,s1.age,s1.score);
// s1.doHomework();
// s1.eat();
s1.showValue();
// let s2 = new Student("凢凢",30,100);
// console.log(s2.name,s2.age,s2.score);
// s2.doHomework();
// s2.eat();
// let data = {
// "a":111,
// "fun":function(){
// console.log(this.a);
// }
// }
// data.fun();
```
# 普通函数和构造函数的区别(重点)
```javascript
1.习惯上构造函数首字母大写
2.构造函数必须和new连用，
3.构造函数不能添加return，因为自动返回的是是地址
```
# ES6创建类
```javascript
class 类名 {
//构造函数->new时调用的函数
constructor(参数列表){
}
去掉function的普通函数
}
class Student{
constructor(name,age,score){
this.name = name;
this.age = age;
this.score = score;
}
eat(){
console.log(`${this.name}:eat`);
}
}
let s1 = new Student("坤坤",18,100);
console.log(s1.name,s1.age,s1.score);
s1.eat();
```
# 类的组合
```javascript
组合:一个类的成员属性是另一个类的对象
案例：
class Birthday{
constructor(y,m,d){
this.y = y;
this.m = m;
this.d = d;
}
showValue(){
console.log(this.y,this.m,this.d);
}
}
class Student{
constructor(name,age,score,bir){
this.name = name;
this.age = age;
this.score = score;
this.bir = bir;
}
eat(){
console.log(`${this.name}:eat`);
}
}
let bir = new Birthday(1999,3,16);
// bir.showValue();
let s = new Student("iKun",18,100,bir);
console.log(s);
```
解构赋值：解析结构进行赋值
1.批量初始化 let x=y=z=1;
a.按照数组的格式初始化 et [x,y,z] = [1,2,3];
b.按照对象的格式初始化 let {name,age} = {"name":"laowang","age":18};
作用：去掉json对象的前缀, 注意事项:变量名必须和key一致,访问时指向key所在的对象
set:集合，没有下标，自动去重 let set = new Set(数组);
let set = new Set([5,5,4,2,3,2,3,7,8,1,1]);
add(参数) 向集合中添加一个元素 delete(值) 删除集合中某个数
has(值) 判断集合中是否含有某个值 clear() 清空集合
数组去重
let arr = [5,5,4,2,3,2,3,7,8,1,1];
let set = new Set(arr);
将容器set转换为数组类型
// arr = Array.from(set);
map:映射，一个容器中存储的都是键值对
set(key,value) 向集合中添加一个元素:key以存在，则为改，不存在则为增
get(键) 根据键去取值
delete(键) 删除集合中某个数
has(键) 判断集合中是否含有某个值
clear() 清空集合
//迭代函数的功能:
//实现了循环，用户只需要自己写功能
// forEach 功能:遍历数组所有元素，并且实现回调函数的功能
// 参数:forEach(回调函数) 回调函数(数组元素数值,[数组下标,数组名]){ }
// 返回值:无
请回答:map和forEach的异同?
// 返回值,forEach无 map返回的是回调函数return的值，拼接的数组
// filter 功能:过滤,根据回调函数返回的布尔值筛选元素
// filter 功能:遍历数组所有元素，并且实现回调函数的功能
// 参数:filter(回调函数) 回调函数(数组元素数值,[数组下标,数组名]){ }
// 返回值:回调函数return的布尔值，筛选后拼接的数组
map 实现了循环，用户只需要自己写功能
// map 功能:遍历数组所有元素，并且实现回调函数的功能
// 参数:forEach(回调函数) 回调函数(数组元素数值,[数组下标,数组名]){ }
// 返回值:回调函数return的值，拼接的数组
