目录
1.组成:
核心js dom(文档对象模型) bom(浏览器对象模型)
2.环境:
node 浏览器
3.特点:
1.弱类型语言
2.解释性语言
3.执行顺序按照解析顺序从上至下执行
4.区分大小写
4.注释
// /**/
5.标识符命名规则
1.由字母数字下划线$组成
2.不能由数字开头
3.不能以关键字和保留字命名
4.使用小驼峰命名
6.变量
1.var let const
特点:变量声明提前
可以重复声明
没有块级作用域
7.数据类型
1.基本数据类型/简单数据类型:string number boolean null undefined symbol
2.引用数据类型:Object array function(){}
区别?
8.深拷贝/浅拷贝
值得复制
var a=1;
var b=a;
浅拷贝：引用地址得传递 ；
深拷贝：
var obj={
name:"zhangsan"
},
var obj1=obj;
如何实现深拷贝?
let temp={...obj}
JSON.stringify(JSON.parse(obj));
lodash _.cloneDeep()
9.undefined与null的关系
== true
10.==和===区别?
1.前者比较的是值 类型不一样转换为同一类型比较
2.后者比较的类型 类型不一样直接返回false
11.类型判断
typeof string number boolean object undefined symbol function
isArray
instanceof
12.NaN isNaN isFinite Infinity -9/0 9/0
1.创建
1.单个对象:
var obj={};//new Object()
2.访问
obj.name / obj['name']
3.遍历对象
for in
4.删除属性
delete obj.name
5.强制类型转换
Number()
Boolean()
String()
6.检测属性
in 检测是否为自有或者继承属性 'name' in obj
hasOwnProperty() 检测是否为自有属性 true false
propertyIsEnumerable() 检测是否为可枚举属性 true
toString() valueOf()
7.原型
每一个构造函数都有一个原型对象,每一个原型对象都有一个
指针(constructor)指向构造函数,每一个实例都有一个指针
(__proto__)指向原型对象;
数据属性和访问器属性用于设置属性的高级属性：
8.数据属性
Writabale: 是否可写
Enumerable:是否可枚举
value:'属性值'
configurable:是否可删除
9.访问器属性
get(){}
set(){}
configurable
Enumerable
Object.defineProperty(obj,'name',{
Writabale: 是否可写
Enumerable:是否可枚举
value:'属性值'
configurable:是否可删除
})
Object.defineProperties(obj,{
name:{
Writabale: 是否可写
Enumerable:是否可枚举
value:'属性值'
configurable:是否可删除
}
})
10.自身属性的描述符
getOwnProperty()
getOwnProperties()
11.对象序列化和反序列化
JSON.stringify(); 将对象转换为JSON字符串
JSON.parse();将JSON字符串对象转换为js对象
1.创建
function 函数名(){}
2.声明提前
3.函数内部属性
arguments 保存实际参数列表得类数组对象
this
指向:1.在函数中this指向全局对象 global window
2.在对象中 this指向拥有该方法得调用者
3.在当前模块 this指向当前模块 {}
4.事件：this指向接收事件得dom元素
4.IIFE（立即执行函数）
5.作用域
1.函数内作用域得变量是局部变量
2.函数外的作用域得变量是全局变量
6.作用域链
7.函数调用
函数名()
修改this指向?
call(this,实参列表)
apply(this,[实参列表])
bind(this,实际参数)(实际参数)
8.闭包 ***
形成条件:
1.嵌套函数
2.内部函数存在对外部函数变量得引用
3.返回内部函数
优缺点:
优点:不会造成变量污染
缺点:内存泄漏 不会被垃圾回收机制回收
1.创建
var arr=[]//new Array()
2.访问
arr[index]
3.数组api
1.序列化方法
toString() join('-')
不修改原数组
2.构造函数方法
isArray()
from()
Array.prototype.slice.call();
[...类数组对象]
Array.of(10);
3.栈和队列方法
pop 删除一个数组元素 从后往前删除 修改原数组
push 添加一个数组元素 修改
shift 删除 修改
unshift 添加 修改
4.排序方法
reverse() 修改原数组
sort() 修改原数组
5.操作方法
concat() 拼接数组 不修改原数组
slice() 截取数组
参数:开始位置 结束位置 不包括结束位置 slice(1,3) 不修改原数组
splice() 添加或者删除数组元素
splice(2,0,数组元素) //你从下标为2的元素开始往里面添加元素
splice(2,2) 修改原数组 // 从下标为2的元素开始删除两个
splice(1); // 从下标为1的元素开始删除到最后
6.位置方法
indexOf() -1或者下标 前-》后
lastIndexOf() 后--》前
不修改原数组
7.迭代方法
every()
some()
filter()
map()
forEach() 没有返回值
不修改原数组
1.创建
var reg=/hello/修饰符
var reg=new RegExp('hello','修饰符')
2.实例方法
exec
可用来匹配字符串中符合正则表达式的字符串
如果匹配到，返回值是一个result数组:
test 用来测试待检测的字符串中是否有可以匹配到正则表达式的字符串
3.String对正则表达式的支持
1.search
2.match
3.split
4.replace
1.工厂模式
function person(){
return {
}
}
缺点:无法区分种类 方法冗余
2.构造函数模式
function Person(name,age){
var obj={};
Person.call(obj);this--->obj
obj.name='terry';
return obj
创建一个实例对象
将this指向实例对象
执行函数体
返回对象
this.name=name;
this.age=age;
this.a=a;
}
function a(){}
var obj=new Person('terry',12);
优点:区分种类
缺点:方法冗余
3.原型模型
将属性和方法都存放在原型对象中
缺点:实例都一样
4.组合模式
function Person(name,age){
this.name=name;
this.age=age
}
Person.prototype={
constructor:Person,
a(){
}
}
1.借用构造函数继承 /经典继承
Animal.call(this)
2.原型链继承
Dog.prototype=new Animal();
3.组合继承
1.操作节点
父类型调用
1.appendChild(); 追加节点
2.insertBefore(插入得节点,参考节点)
3.removeChild(要移除的节点)
4.replaceChild(替换得节点,被替换的节点)
cloneNode() 任意类型
true 深克隆 克隆节点和内容
false 浅克隆 只克隆节点
innerHTML 识别代码片段
innerText 识别文本内容
textContent 去除前后空格回车 识别文本内容
2.事件流
描述得是页面接收事件得顺序
分为事件冒泡和事件捕获
事件冒泡:从内向外触发事件
事件捕获:从外向内触发事件
3.事件代理
将本应该绑定给子元素得事件绑定给父元素
优点:减少dom操作和浏览器重排和重绘
重排和重绘:
4.阻止事件冒泡和事件默认行为
stopPropagation() perventDefault()
5.DOM0级事件 DOM2级事件
dom.οnclick=function(){}
dom.οnclick=null;
function handler(){
console.log(1)
}
addEventListener('click',handler);
addEventListener('click',function(){
console.log(2)
});
removeEventListener('click',handler)
6.event.target和event.currentTarget
前者是事件触发得目标源头
后者是正在执行得事件元素
inner center outer target-->inner
currentTarget inner center outer
BOM对象
1.window对象
2.screen对象
3.navigator对象
4.location对象
5.history对象
ajax（要求会手写）
异步的xml和javascript
步骤:
1.创建ajax实例对象
var xhr=new XMLHttpRequest();
2.打开一个连接
Qs.stringify(obj)
xhr.open(请求方式,请求路径?obj)
2.1设置请求头
xhr.requestHeaders('Content-Type','application/json')
xhr.requestHeaders('Content-Type','application/x-www-form-urlencoded')
3.发送请求
xhr.send(JSON.stringify(obj))
xhr.send(Qs.stringify(obj))
4.接收响应
xhr.onreadystatechange=function(){
if(xhr.readyState===4&&xhr.status===200){
xhr.responseText
}
}
开源项目
csdn
gitee
初学者:
git config --global user.email='';
git config --global user.username='';
初始化仓库
git init
追踪修改文件
git add ./*
查看提交状态
git status
绑定远程仓库
git remote add origin xxx.git
查看绑定得远程仓库
git remote -v
提交文件到暂存区
git commit -m '[]'xxx
提交文件到远程
git push origin master
更新远程仓库 团队合作
git pull orgin mater
git log
git reflog