1.闭包
// 函数的嵌套定义，定义在内部的函数都称之为 闭包
// 1.一个函数要使用另一个函数的局部变量
// 2.闭包会持久化包裹自身的函数的局部变量
// 3.解决循环绑定
function outer(){
var num = 10;
function inner(){ // 闭包
// 1.在inner函数中，使用了outer的局部变量num
return num;
}
return inner；
}
var innerFn = outer();
// 2.借助闭包，将局部变量num的生命周期提示了
var num = innerFn();
console.log(num);
2.面向对象js
// 1.单一对象
var obj = {
// 属性
name:'zero';
// 方法
teach:function(){
console.log("教学");
}
};
obj.name | obj.teach()
// 2.构造函数
function Person(name){ // 类似于python中的类一样来使用
// this代表Person构造函数实例化出的所有具体对象中的某一个
this.name = name;
this.teach = function(){
console.log(this.name+"正在教育");
}
}
// ①通过构造函数实例化出具体对象
// ②通过对象，语法调用的属性与方法
var p1 = new Person("张三"）；
p1.name // 张三，this指向p1对象
var p2 = new Person("李四");
p2.teache // 李四正在教学，this指向p2对象
// 3.ES6类语法
class Student{
// 需要构造器（构造函数）来完成对象声明与初始化
constructor(name){
// 属性在构造器中声明完成初始化
this.name = name;
}
// 类方法
static fn(){
console.log("我是类方法")
}
}
// 类中的普通方法由类的具体实例化对象来调用
// 类中的类方法由类直接调用（这类型的方法大多是功能性方法，不需要对象的存在）
3.js选择器
直接通过id名（不严谨，也不推荐使用）
getElement系列（最严谨）
// id获取： // getElementById('id名'） // 只能由document来调用 // class获取 // getElementByClassName('class名'） // 可以由document以及所属父级调用 // tag获取 // getElementsByTagName('标签名') // 可以由document以及所属父级调用 querySelector // 获取第一个满足要求的目标 //querySelector() // 获取所有满足要求的目标 // querySelectorAll() // 1.参数：就采用的是css选择器语法 // 2.可以由document及父级来调用 // 3.对id检索不严谨
4.事件初识
// js事件： 页面标签在满足某种条件下可以完成指定功能的这种功能，称之为事件 // 某种条件：如鼠标点击标签：点击事件 | 鼠标双击标签：双击事件 | 键盘按下： 键盘按下事件 // 指定功能：就是开发者根据实际需求完整相应的功能实现 // 钩子函数：就是满足某种条件被系统回调的函数（完成指定功能） // 点击事件：明确激活钩子的条件 = 机会钩子后该处理什么逻辑，完成指定功能（函数） // 获取页面标签是前提 var div = documet.querySelector('.div') // 钩子条件：双击 = 指定功能（自身背景颜色变红） div.ondblclick = function(){ this.sytle.backgroundColor = "red"; }
5.js操作页面内容
文本内容
// box.innerText // 可以设值，也可以取值
标签内容
// box.innerHTML // 可以设值，也可以取值，能解析html语法代码 // box.outerHTML // 获取包含自身标签信息的所有子内容信息
样式
// box.style.样式名 ==》可以设值，可以取值，但操作的只能是行间式 // getComputedStyle(box,null). 样式名 ==》只能取值，不能设值，能获取所有方式设值的值（行间式 与 计算后样式） // 注：获取计算后样式，需要关注值得格式