正则表达式
提交表单时经行校验
1.字面量（必须完全一样）
var reg = /abc/
2.内置构造函数
var reg = new RegExp("abc")
3.进行测试
(true/false)
console.log(reg.text(“abc”))
元字符
- \d 一位数字（0-9）//至少两位就是/\d\d/
var reg = /\d/
//在这个字符串里包含数字//
console.log(reg.text(“123”))=>true
- \D 一位非数字（/\Dk\D/）
var reg = /\D/
- /s 一位空白内容（空格、缩进、换行“/n”）
var reg = /\s/
- /S 非空白内容
var reg = /\S/
- /w 字母、数字、下划线
var reg = /\w/
- /W 非字母、数字、下划线
var reg = /\W/
- . 任意内容 （换行不算/n）
var reg = /./
- \ 转义字符
var reg = /\d\.\d/
console.log(reg.test("1.2"))==>true
console.log(reg.test("1a2"))==>false
边界符
"^"开头
//开头为字母
var reg = /^\d/
"$"结尾
var reg = /\d$/
例：
//开头结尾为a,c中间为字母
var reg = /^a\dc$/
限定符（范围）
格式：
var reg = /\d+/
*0~多次+1~多次?0~1次{n}指定次数{n,}>=n{n,m}范围==>[n,m]
注：
//只能说明c需出现两次
var reg = /abc{2}/
特殊符号 p112
( )整体
可以实现单独捕获
//需出现abc两次
var reg = /^(abc){2}$/
|或
var reg = /a|b/
[ ]代表1个，含有其中一个
//[a-zA-Z0-9_]
var reg = /[asdf]/
捕获–exec
test()
exec()捕获片段
只能截取第一个片段
标识符 g i
g:全局标识符
i:忽略大小写
var reg = /\d{4}-\d{1,2}-\d{1,2}/g
正则表达式的两大特性p114
1.惰性 ：通过全局标识符解决
2.贪婪：==>非贪婪 var reg = /\{1,4}?/加问号，取最少
正则与字符串与案例：密码验证
this指向
this可以用在构造函数之中，表示实例对象。除此之外，this还可以用在别的场合。但不管是什么场合，this都有一个共同点：它总是返回一个对象。简单说，this就是属性或方法“当前”所在的对象。（被谁调用指向谁）
例：
var person = {
name: '张三',
describe: function () {
return '姓名：'+ this.name;
}
};
person.describe()
// "姓名：张三"
上面代码中，this.name表示name属性所在的那个对象。由于this.name是在describe方法中调用，而describe方法所在的当前对象是person，因此this指向person，this.name就是person.name。
由于对象的属性可以赋给另一个对象，所以属性所在的当前对象是可变的，即this的指向是可变的。
var A = {
name: '张三',
describe: function () {
return '姓名：'+ this.name;
}
};
var B = {
name: '李四'
};
B.describe = A.describe;
B.describe()
上面代码中，A.describe属性被赋给B，于是B.describe就表示describe方法所在的当前对象是B，所以this.name就指向B.name。
绑定this的方法
this的动态切换，固然为 JavaScript 创造了巨大的灵活性，但也使得编程变得困难和模糊。有时，需要把this固定下来，避免出现意想不到的情况。JavaScript 提供了call、apply、bind这三个方法，来切换/固定this的指向。
var obj = {};
var f = function () {
return this;
};
f() === window // true
f.call(obj) === obj // true
上面代码中，全局环境运行函数f时，this指向全局环境（浏览器为window对象）；call方法可以改变this的指向，指定this指向对象obj，然后在对象obj的作用域中运行函数f。
call方法的参数，应该是一个对象。如果参数为空、null和undefined，则默认传入全局对象。
var n = 123;
var obj = { n: 456 };
function a() {
console.log(this.n);
}
a.call() // 123
a.call(null) // 123
a.call(undefined) // 123
a.call(window) // 123
a.call(obj) // 456
上面代码中，a函数中的this关键字，如果指向全局对象，返回结果为123。如果使用call方法将this关键字指向obj对象，返回结果为456。可以看到，如果call方法没有参数，或者参数为null或undefined，则等同于指向全局对象。
如果call方法的参数是一个原始值，那么这个原始值会自动转成对应的包装对象，然后传入call方法。
ES6
**#### 定义变量
let变量
语法：
let a = 100
与var的不同之处：
1.需先定义
2.可检查变量重名
3.块级作用域，避免和外面变量互相打扰
const常量
必须赋值
const obj = {
name:"kerwin"
}
//同一把钥匙，门里内容变了
obj.name = "mm"
//钥匙变了
obj = {name:"mm"}
let块级作用域案例P120
//这里定义的i只在大括号中生效
for(let i=0;i<5;i++){
console.log(i)
}
箭头函数P121
语法：
var test = () =>{
console.log()
}
1.小括号可以省略：只有一个行参时
2.大括号省略：只有一句代码或只有返回值时
3.没有arguements（arguments是保存着所有实参的伪数组，所以不用写形参也可以。）
4.没有this，箭头函数this是父级作用域的
解决方法：## 标题
临时将this赋值给that
解构赋值
快速从对象和数组中获得里面的成员
(多维数组同理）
var arr =["chris","becky"]
//arr[arr.lengh-1]
let[x,y] = arr
console.log(x,y)
交换位子
var a = 10
var b = 20
var[b,a] = [a,b]
对象
var obj = {
name:" ",
age:100
}
Let {name,age}=obj
document.write(name)
对象简写
对象前面的key值和后面的一样则可以省略
展开运算符
...
-
把数组展开
-
复制
-
-
实参
-
-
行参
-
伪数组
模块化语法
1.默认导出语法 export default 默认导出的成员：
// 当前模块 为 export1.js
//定义私有成员 a 和 c
let a = 10
let c = 20
// 外界访问不到 变量 d 因为其没有被 暴露出去
let d = 30
function show(){}
// 将 本模块中的私有成员 暴露出去，供其他模块使用
export default {
a,
c,
show
}
2.默认导入语法 import 接收名称 from ‘模块接收符’：
<script type="module">
// 导入模块成员
import export1 from './export1.js'
console.log(export1)
//打印输出结果为
// { a: 10, c: 20, show: [function show] }
注意：
在每一个模块中只允许使用唯一的一次 export default ，否则会报错 在一个模块中如果没有向外 export
default，则导入该模块时 默认输出 {}
面向对象–>自定义构造函数
典型的面向对象编程语言（比如 C++ 和 Java），都有“类”（class）这个概念。
但是，JavaScript 语言的对象体系，不是基于“类”的，而是基于构造函数（constructor）和原型链（prototype）。
JavaScript 语言使用构造函数（constructor）作为对象的模板。所谓”构造函数”，就是专门用来生成实例对象的函数。它就是对象的模板，描述实例对象的基本结构。一个构造函数，可以生成多个实例对象，这些实例对象都有相同的结构。
function creatObj(name){
this.name = name
this.material = []
this.cook = function(){
}}
var obj1 = new createObj("")
注意：
- 为了与普通函数区别，构造函数名字的第一个字母通常大写。
- 构造函数不写return
- new过程==实例化这个过程，此时实例对象已经生成，此时this指向实例化后的对象
class p131
语法：
//构造器函数
class CreateObj{
constructor(name){
this.name = name
}say（）{
console.log(this.name,"hello")
}}
面向对象：继承
ajax
优势：
不需要插件的支持
用户体验良好
减轻服务端和宽带的负担
但是：搜索引擎支持不够
1.创建xhr = new XMLHttpRequest()
2.配置 open（请求方式，请求地址，是否异步xhr.open("GET","hppt://......txt:)
3.接受数据，注册一个事件:xhr.onreadystartechange = function（）{}
状态码
readyStateChange
- ajax中的一个事件
- 其专门用来监听ajax对象的readystate值改变的行为
- 实验我们就在这个事件中来监听ajax的rs是不是到4了
ajax同步异步
true：异步请求
false：同步请求
请求方式
get：（偏向于）获取数据xhr.open('get','/getList?num=12')
post：提交数据xhr.open("post","/submitData"); xhr.send('{"name":"huazhu","age":"7"}')
put：更新
delete：删除
patch：部分修改
head、potions、connect
下载noodjs
ajax封装
method(必选) 请求类型 get 和
post url(必选) 请求的url地址
相同域名下的页面（此函数不支持跨域请求）
data(必选) 请求协带的数据 以js对象的形式定义，如：{name:‘张三’}
callback(必选) 回调函数,可接收一个参数，这个参数就是服务器响应的数据
type(可选) 指定服务器响应的数据类型（可选值：json,xml,text），如果是json模式，则使用json解析数据，默认为text普通字符串
例：
ajax({
//地址
url:"http://....",
//结构方式
method:"GET",
async:true,
//必须传的是对象的格式
data:{
username:"chris"
password:"123"
},
headers:{}
//回调函数
success:function(res){
console.log(res)
},
error:function(err){
console.log(err)
}
})
回调地狱
当一个回调函数嵌套一个回调韩式的时候，就会出现一个嵌套结构，当嵌套结构多了就会出现回调地狱的情况
解决方法：
1.promise
它有三种状态：等待中（pending） 完成了 （resolved） 拒绝了（rejected），当他觉得你的要求可以通过便会返回给你resolved，若是你的要求达不到它便会返回给你rejected拒绝你。
封装之后
let parkplay = (who) =>{
return new Promise((resolve,reject)=>{
resolve("去游乐园玩啦！")
})
}
parkplay("me").then(res =>{
//去玩游乐圆玩先买票
return Buytickets(res)
}).then(res=>{
//买票入园后游乐设施前排队
return queue(res)
}).then(res=>{
//开始玩啦
return playing(res)
})
简洁易修改
2.async和await（ES7语法）
可以把异步代码写的像同步代码
let parkplay = (who) =>{
return new Promise((resolve,reject)=>{
resolve("去游乐园玩啦！")
})
}
(async()=>{
let parkplay_result = await parkplay("me");
let buytickets_result = await buytickets(parkplay_result);
let queue_result = await queue(buytickets_result);
let playing_result = await playing(queue_result)
})()
promise(async和await)由于可以链式调用 对于开发这种多层嵌套的代码很方便，降低了代码的维护难度等等。
fetch
XMLHpptRequest设计粗糙，而且基于事件的异步模型写起来不友好且兼容性不好
fetch语法：
fetch(url)
.then(...)
.catch(...)
url参数是必须填写，option可选，设置fetch调用时的Request对象，如method、headers等
比较常用的Request对象有：
- method - 支持 GET, POST, PUT, DELETE, HEAD
- url - 请求的 URL
- headers - 对应的 Headers 对象
- body - 请求参数（JSON.stringify 过的字符串或’name=jim\u0026age=22’ 格式)
注意事项：
fetch()使用 Promise，不使用回调函数，因此大大简化了写法，写起来更简洁。
fetch()采用模块化设计，API分散在多个对象上（Response 对象、Request 对象、Headers 对象），更合理一些；相比之下，XMLHttpRequest的 API 设计并不是很好，输入、输出、状态都在同一个接口管理，容易写出非常混乱的代码。
fetch()通过数据流（Stream对象）处理数据，可以分块读取，有利于提高网站性能表现，减少内存占用，对于请求大文件或者网速慢的场景相当有用。
cookie本地存储
cookie其实就是一些数据信息，类型为“小型文本文件”，存储于电脑上的文本文件中。游览器保存了我们的cookie，里面记录了一些信息，当然，这些cookie是服务器创建后返回给游览器的。游览器只进行了保存。
cookie中常用属性的解释:
- Name：这个是cookie的名字
- Value：这个是cooke的值
- Path：这个定义了Web站点上可以访问该Cookie的目录
- Expires：这个值表示cookie的过期时间，也就是有效值，cookie在这个值之前都有效。
- Size：这个表示cookie的大小
注意：游览器只会携带在当前请求的url中包含了该cookie中path值的cookie)，并且是以key：value的形式进行表示的。多个cookie用；进行隔开。
cookie的生存期:
默认情况，cookie是临时存在的。在一个浏览器窗口打开时，可以设置cookie，只要该浏览器窗口没有关闭，cookie就一直有效，而一旦浏览器窗口关闭后，cookie也就随之消失。
如果想要cookie在浏览器窗口之后还能继续使用，就需要为cookie设置一个生存期。
设置生存时间：
document.cookie =“名称=值；expires=”+ 时间；（时间必须是一个字符串）
var d= new Date();
d.setHours(d.getHours() + (24 * 30)); //保存一个月
document.cookie=“visited=yes; expires=” + d.toUTCString();//d.toUTCString();将时间转化字符串
jsonp
一种跨域通信的手段，json的一种”使用模式，可以让网页从别的域名那获取资料。
同源策略：同域名，同端口号，同协议当其中一个不满足时，我们的请求即会发生跨域问题。
原理：动态创建script标签，src属性指向没有跨域限制，首先是利用script标签的src属性来实现跨域。
通过将前端方法作为参数传递到服务器端，然后由服务器端注入参数之后再返回，实现服务器端向客户端通信。
1）、设定一个script标签
<script src="http://jsonp.js?callback=xxx"></script>
2）、callback定义了一个函数名，而远程服务端通过调用指定的函数并传入参数来实现传递参数，将fn(response)传递回客户端
$callback = !empty($_GET['callback']) ? $_GET['callback'] : 'callback';
echo $callback.'(.json_encode($data).)';
3）、客户端接收到返回的js脚本，开始解析和执行fn(response)
ps：由于使用script标签的src属性，因此只支持get方法
闭包
函数内部返回一个函数，被外界所引用，这个内部函数就不会被销毁回收。内部函数的外部函数的变量也不会被销毁
优点：让临时变量永驻内存
缺点：内存泄露
for (var i = 1; i <= 5; i++) {;
(function(j) {
setTimeout(function timer() {
console.log(j)
}, j * 1000)
})(i)
}
PS：
1）由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。
2）闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。
106
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
