JavaScript的构成
- DOM 操作文档
- BOM 操作浏览器
- ECMAScript ( 基础语法 )
ECMAScript
ECMAScript简称为ES , ( ECMA欧洲计算机协会 ) , ES分为不同的版本 :
常用的版本有ES3ES5ES6 ( 部分浏览器支持,但存在兼容问题,不能直接解析,必须先编译成ES3才能解析 , bable.js 是进行es版本编译的 , ) ,ES7...及以后都称为ES6
- ES3 (常用版本)
- ES5 (更加规划范和更加简易化 2015.10)
- ES6 (模块化编程 基于ES5更加简易化 2016.4)
ES5新增内容
一.严格模式
概述 : 我们普通书写的js代码,并没有特别多的规划,甚至在某些事件可以随意发挥,这种模式被称为怪异模式. 相对而言一种更加规范化的模式被称为严格模式
严格模式的使用
使用 "use strick"进行声明 , 它的声明位置必须在第一行 ( 一般用于源码书写 )
严格模式的特性
- 声明一个变量必须具备关键词 ( var , let , const )
- 函数内的this不会指向window , this是undefined
- 禁止八进制相关的方法
- 函数内argument的形参和实参不同步
- 函数只能在声明函数的地方进行声明
// 怪异模式
var a = 10
b = 20
console.log(a) //10
consoloe.log(b) //20
// 严格模式
// 声明必须在一行
"use strick"
// 声明一个变量必须要有关键词
c = 30
console.log(c) // c没有定义
// 严格模式中函数内的this不能指向window
function fn(){
console.log(this)
}
fn() //this 是undefined
二.数组新增的高阶函数
概述 :
以函数作为参数的函数叫做高阶函数
新增的相关函数 :
1 . 遍历 : map , forEach
- forEach : 有两个参数,第一个是函数,第二个是参数(一般不用,无意义)
// forEach:
// 函数内有三个参数,第一个是值(每个成员),第二个是下标,第三个是数组
// forEach没有返回值,js函数内参数如果不需要可以不传
var arr = [11, 22, 33, 44]
var arr = arr.forEach(function (item, index, arr) {
console.log(item) //每个成员
console.log(index) //下标
console.log(arr) //数组
})
- map : 跟forEach使用是一样的 , 有返回值,返回数组
// map
// 跟forEach使用是一样的 , 唯一的区别是map有返回值 ( 返回数组 ) , forEach没有
var arr1 = [22, 33, 44, 55]
var arr1 = arr1.map(function (item, index, arr) {
return index //返回带下标的数组
return item //返回带每个成员的数组
return arr //返回数组,内有每个成员,下标
})
console.log(arr1)
2 . 过滤和计算 : filter , reduce , reduceRight
- filter : 过滤 ( 返回符合条件的数组 )
var arr = ['aa', 'bab', 'b']
// 过滤,传入函数,通过函数内的参数来进行条件过滤,返回的值为数组
var filterArr = arr.filter(function (item, index, arr) {
// item内不包含a的返回false,返回false的值不会加到数组里
return /a/.test(item)
// 返回index为1的数组
return index == 1
})
// 返回带a的数组 ['aa','bab']
console.log(filterArr)
- reduce : 计算 ( 从前往后 , 返回计算结果 )
- reduceRight : 计算 ( 从后往前 , 返回计算结果 )
// 有四个参数:prev,current,index,arr(prev表示相加的和,第一次为11,第二次为32,current默认从第二个开始,index为下标,arr为数组)
// reduce : 计算所有的和,从前面开始
var arr = [11, 21, 33, 26]
var sum = arr.reduce(function (prev, current, index, arr) {
console.log('prev:'+prev) //11,32,65
console.log('current:'+current) //21,33,26
console.log('index:'+index) //1,2,3
return prev + current
})
console.log(sum)//91
// reduceRight : 计算所有的和,从后面开始
var arr = [11, 21, 33, 26]
var sum = arr.reduceRight(function (prev, current, index, arr) {
console.log('prev:'+prev) //26,59,80
console.log('current:'+current) //33,21,11
console.log('index:'+index) //2,1,0
return prev + current
})
console.log(sum)//91
3 . 判断是否存在 (返回布尔类型) : some , every
- some : 只要有一个满足就为true
- every : 每个条件都满足才是true
// some : 判断是否存在(只要有一个满足就返回true)
var arr = [0, 1, 2, 3]
var is = arr.some(function (item, index, arr) {
return item > 1
})
console.log(is) //true
// every : 判断是否存在(每个条件都满足才是true)
var arr = [0, 1, 2, 3]
var is = arr.every(function (item, index, arr) {
return item > 1
})
console.log(is) //false
注意事项 :
- forEach和map的区别 (forEach没有返回值,map有返回值)
- reduce是用于计算的 , 它传入的参数有四个 [ prev ( 和 , 默认从第一个开始 ) , current ( 当前的值 , 默认从第二个开始 ) , index ( 当前元素的下标 ) , arr ( 当前遍历的数组 ) ] , 如果需要调整 , 可在后面进行传参
- some和every的区别 , some只要有一个条件满足就返回true , every要所有条件都满足才返回true
手写实现数组的高阶函数
- forEach ( ) : 遍历 , 没有返回值
var arr = [11, 22, 33, 44, 55]
// forEach传入的fn里面有三个参数,分别是值,下标,遍历的数组
function myForEach(fn) {
// 使用for循环遍历数组
for (var i = 0; i < arr.length; i++) {
// 调用传入的函数
fn(arr[i], i, arr)
}
}
// 调用封装的函数
myForEach(function (item, index, arr) {
console.log(item) // 11,22,33,44,55
console.log(index) //0,1,2,3,4
console.log(arr)
})
- map ( ) : 遍历 , 返回一个数组
// map 返回一个数组,数组里面的值是当前函数执行后的结果
var arr = [11, 22, 33, 44, 55]
function myMap(fn) {
// 准备一个返回的数组
var list = []
// 使用for循环遍历数组
for (var i = 0; i < arr.length; i++) {
// 接收函数的返回结果
var map = fn(arr[i], i, arr)
// 添加到准备好的数组里
list.push(map)
}
// 将数组返回出去
return list
}
// 调用函数
var Arr = myMap(function (item, index, arr) {
// return item + '你好' //['11你好','22你好','33你好','44你好','55你好']
return index //[0,1,2,3,4]
// return arr
})
console.log(Arr)
- reduce ( ) : 计算 , 返回计算的结果
var arr = [11, 22, 33, 44]
// reduce有两个参数,一个为函数,一个为开始位置
function myReduce(fn, index) {
//设置函数内第一个参数prev的默认值为数组的第一个
var prev = arr[0]
// 设置开始位置默认为1
if (typeof index != 'number') {
index = 1
} else { //传入了index值就为0,prev也是0
index = 0
prev = 0
}
console.log(index)
// 遍历
for (var i = index; i < arr.length; i++) {
// 调用fn,将前面计算的值赋给prev再进行下一次循环
prev = fn(prev, arr[i], i, arr)
}
return prev
}
// 调用
var result = myReduce(function (prev, current, index, arr) {
return prev * current
})
console.log(result) //351384
- filter ( ) : 过滤 , 返回一个新数组
var arr = [1, 2, 3, 4]
// filter 过滤,返回一个新数组
function myFilter(fn) {
// 准备一个返回的空数组
var returnArr = []
// for循环来遍历数组
for (var i = 0; i < arr.length; i++) {
var flag = fn(arr[i], i, arr)
// 判断当前的值是否为true,是就添加到空数组里
if (flag) {
returnArr.push(arr[i])
}
}
return returnArr
}
// 调用函数
var filterArr = myFilter(function (item, index, arr) {
return item > 2
})
console.log(filterArr) //[3,4]
- some ( ) : 根据条件查询 , 有一个满足就返回true
var arr = [11, 22, 33, 44]
function mySome(fn) {
// 遍历数组
for (var i = 0; i < arr.length; i++) {
// 调用fn
var flag = fn(arr[i], i, arr)
// 判断这个fn是否为true,有一个为true就返回true
if (flag) {
return true
}
}
// 循环结束没有true就返回false
return false
}
// 调用mySome,传入实参
var istrue = mySome(function (item, index, arr) {
// 返回大于40的,有就true,没有就fasle
return item > 40
})
console.log(istrue) //true
- every ( ) : 根据条件查询 , 条件都满足才返回true
var arr = [11, 22, 33, 44]
// every : 条件全部满足才返回true
function myEvery(fn) {
// 遍历数组
for (var i = 0; i < arr.length; i++) {
// 调用fn
var flag = fn(arr[i], i, arr)
// 判断fn的值是否为false,有一个为false就返回false
if (!flag) {
return false
}
}
// 循环结束都为true就返回true
return true
}
// 调用every方法
var istrue = myEvery(function (item, index, arr) {
return item > 11
})
console.log(istrue) //false
三.字符串新增
字符串模板
var username='李四'
var str=`hello${username}`
console.log(str) //hello李四
四.改变this指向的新增方法
- 在函数内的this指向当前函数的调用者 ( 全局调用的函数 this 指向window )
- 在对象内的函数this指向当前的对象
- 在事件的函数内指向当前事件的目标元素
如果需要更改this指向,我们可以给对应的函数调用方法
bind ( 手动调用 , 方法后加括号 )
apply ( 自动调用 , 参数要用数组传递 ) * 传递的是个数组就一般用它
call ( 自动调用 , 参数用一个个的元素传递 ) * 常用
function fn(arg, arg1) {
console.log(this)//window
console.log(arg, arg1)
}
fn()
var obj = {
name: 'jack', say: function () {
console.log(this) //改成window
}
}
// bind方法改变this指向需手动调用,使用(),括号内写实参
fn.bind(obj)('你好', '世界')//obj
// apply方法自动调用函数改变this指向,第一个参数为调用者,第二个为实参(以数组传递)
fn.apply(obj, ['hello', 'world'])
// call方法自动调用函数改变this指向,第一个参数为调用者,第二个为实参(以一个个元素传递)
fn.call(obj, '侬好呀', '港独')
obj.say.bind(window)('nn','mm')
obj.say.apply(window,['aa','bb'])
obj.say.call(window,'dd','ff')
apply和call的区别
- apply方法传递的参数是以数组的形式
- call方法传递的参数是以一个个元素的形式
共同点 :
- apply 方法和call 方法都会自动调用函数
ES6新增
ES6对应字符串 , 数组 , 函数 , 对象 , 循环 , 变量修饰关键词 , 基础数据类型等都有新增
一.字符串新增方法
- startsWith 是否以...开头
- endsWith 是否以...结尾
- includes是否包含
- repeat平铺
var str = 'abc'
// startsWith 以什么开头
var s = str.startsWith('a')
console.log(s)
// endsWith 以什么结尾
var s = str.startsWith('b')
console.log(s)
// includes 包含
var s = str.startsWith('a')
console.log(s)
// repeat 平铺
var s = str.repeat(2)
console.log(s)
二.数组新增方法
普通方法 ( 高阶函数 )
- find () : 根据条件查找,返回找到的第一个内容 , 没有找到就返回undefined
- findIndex () : 根据条件查找,返回找到的第一个下标 , 没有找到就返回-1
// find 根据条件查找,找到了返回第一个值,没找到返回undefined
var arr = [11, 22, 33, 44]
var findd = arr.find(function (item, index, arr) {
return item > 40
})
console.log(findd)
// findIndex 根据条件查找,找到了返回第一个下标,没找到返回-1
var arr = [11, 22, 33, 44]
var findIndexx = arr.findIndex(function (item, index, arr) {
return item > 2
})
console.log(findIndexx)
手写实现find 及 findIndex
// find 根据条件查找,找到了返回第一个值,没找到返回undefined
function myFind(fn) {
//遍历数组
for (var i = 0; i < arr.length; i++) {
var flag = fn(arr[i], i, arr)
//如果有就返回数组的值
if (flag) {
return arr[i]
}
}
}
//调用myFind方法
var value = myFind(function (item, index, arr) {
return item > 11
})
console.log(value)
// findIndex 根据条件查找,找到了返回第一个下标,没找到返回-1
function myFindIndex(fn) {
// 遍历数组
for (var i = 0; i < arr.length; i++) {
var flag = fn(arr[i], i, arr)
// 如果有,就返回下标
if (flag) {
return i
}
}
// 循环结束了也没找到就返回-1
return -1
}
// 调用函数
var index = myFindIndex(function (item, index, arr) {
return item > 22
})
console.log(index)
静态方法
- Array.from () : 将伪数组转为数组
- Array.of () : 将传进去的元素组成一个新数组,返回新数组
// Array.from 将伪数组转为数组
var btns = document.querySelectorAll('button') //nodeList
var btn = Array.from(btns).map(function (item, index, arr) {
return item
})
console.log(btn)//[button button]
// Array.of 将传入的元素组成一个数组并返回
var arr1 = Array.of('bb', 'pp', 'qq')
console.log(arr1) //['bb','pp','qq']
三.变量修饰关键词
es3存在
- var 声明伪全局变量
新增的
- let 声明块级作用域 ( 不允许重复声明 , 只在当前的代码块内起作用 ( 块级作用域 ) )
- const 声明常量 ( 声明必须赋值 , 不允许修改 , 也是块级作用域 )
// let 声明块级作用域
let a = 10
// let a = 20 不允许重复声明
a = 20
console.log(a) //20
// 块级作用域及伪全局作用域
// var 伪全局作用域
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i) //重复打印5次5,因为var是伪全局作用域,它会等延时器执行完毕再打印i
}, 3000)
}
// 块级作用域,它会在当前的作用范围内就进入改变i的值
for (let i = 0; i < 5; i++) {
setTimeout(function () {
console.log(i) //打印0,1,2,3,4
}, 3000)
}
// const 声明常量
// 声明必须要赋值
// const c; //报错
const b = 20
// b = 10 不允许二次赋值
console.log(b)
// const也是块级作用域
四.基础数据类型
ES3基础值类型
- string
- number
- boolean
- null
- undefined
ES6新增的基础值类型
- symbol 独一无二的值 ( 一般用于对象的key,key不能重复 )
- bigint大的整型
// Symbol 独一无二的值
var sym = Symbol()
var sym1 = Symbol()
console.log(sym == sym1) //fasle
var sym2 = Symbol('你好') //传入的参数是说明
var sym3 = Symbol('你好')
console.log(sym2 == sym3) //false
// 一般用于对象的key,key不能重复
var obj = { sym: 10 }
console.log(obj.sym) //10
// 获取说明(详情)
console.log(sym2.description) //'你好'
// BigInt 大的整型,可以容纳大的数
// number中的整型int容纳范围是有限的,10^16
var big = BigInt('1111111111111111111111111')
console.log(big) //1111111111111111111111111n
var number = 1111111111111111111111111
console.log(number) //1.1111111111111111e+24
五.循环新增
- for...in ( 遍历对象 )
- for...of ( 遍历数组 , 只要实现了迭代器就可以用for...of ) ,伪数组也可用
var obj={
name:'jack',
age:22
}
for(var key in obj){//遍历的是key (数组的key是下标) key的类型为字符串
console.log(key) //name ,age
}
var arr=['a','b','c']
for(var value of arr){ //for...of遍历的是值
console.log(value) //a,b,c
}
六.函数新增
默认参数
// 默认a为10,b为21,如果传递了参数,那默认值就会被覆盖
function fn(a = 10, b = 21) {
console.log(a + b)
}
fn(11, 22) //打印33
fn() //打印31
fn(21) //打印42
箭头函数 , 是一个匿名函数
箭头函数的写法
(参数1,参数2,参数3,...参数n)=>{代码}
简化写法
- 如果当前的参数只有一个时,可以省略 ( )
- 如果当前的{}里面的代码只有一句时,{}也可以省略
- 如果当前的{}里面的代码只有一句 并且需要返回数据时,可以省略return和{}
// 箭头函数是匿名的,需要声明变量来接收
var fn = item => {
console.log(item + '当前参数为1个,可省略()')
}
fn('简写一:')
var fn1 = item => console.log(item + '只有一句话可省略{}')
fn1('简写二:')
var fn2 = arg => arg + '你好' //当前fn2 传递一个arg 返回一个arg+你好
var result = fn2('简写三:')
console.log(result);
箭头函数的特性
- 箭头函数里面没有this,会根据作用域链找离它最近的(最外层是window)
- 箭头函数里 没有arguments,会报错
var obj = {
say: function () {
console.log(this) //obj
console.log(arguments) //arguments
}
}
obj.say() //打印obj
var obj = {
say: () => {
console.log(this) //window
// console.log(arguments) //无,报错
}
}
obj.say() //打印window
七.对象新增
新增对象方法 ( 静态方法 )
- Object.is 判断两个对象是否为一个,返回对应的true和false
// Object.is 用于判断两个对象是否为同一个,返回值为true或fasle
console.log({} == {}) //false 比较值
console.log({} === {}) //fasle 比较值和类型
console.log(Object.is({}, {})) //false 比较值的同时还要比较类型
// !!可以解决NaN不等于NaN的问题
console.log(NaN == NaN) //false
console.log(NaN === NaN) //false
console.log(Object.is(NaN, NaN)) //true
- Object.assign 将后面对象的内容,拷贝到前面的第一个对象
// Object.assign 是将后面的内容拷贝到前面,返回一个对象,这个对象的地址和前面的对象是同一个
var obj = { name: 'jack' }
var targetObj = Object.assign(obj, { age: 22 }, { sex: '男' }, { height: 188 })
console.log(targetObj) //{name:jack,age:22,sex:男,height:188}
console.log(targetObj === obj) //true
// 只拷贝第一层的值,剩下的拷贝的是引用地址(浅拷贝实现方式之一)
var obj1 = { age: 26, arr: [1, 2] }
var targetObj = Object.assign({ name: 'rose' }, obj1, { sex: '女' })
console.log(targetObj)
// 让第二层中括号内的内容发生变化
obj1.arr[0] = 11 //arr[11,2]
obj1.age = 24 //不变,还是26
// 原本拷贝对象的值也会变化
console.log(targetObj) //{name:'rose',age:26,arr[11,2],sex:'女'}
新增对象简化写法
- 对象中的函数,可以省略对应的 : function
- 对象中value变量名和key的名字一致时可以省略key
// 简化写法
var name = 'jack'
var obj = {
// name: name,
// 当你的key和value是一样的时候而且value是变量就可以省略key
name,
// say:function(){
// console.log('hello')
// },
// 对象中函数的简化写法
say() {
console.log('hello')
}
}
八.解构赋值和扩展运算符
- 解构赋值 ( 解除构造进行赋值 )
{}对于对象的解构 (使用key来匹配)
[]对于数组的解构 (使用下标来匹配)
var obj = { name: 'jack', age: 18, sex: '男' }
var arr = ['a1', 'a2', 'a3']
// 采用解构赋值快速提取 对象
// {}里面填写的键,按照填写的key去匹配对象里面的key再去除它的值
var { name, sex, age } = obj
console.log(name, sex, age) //jack,男,18
// []是对于数组的解构,它是按照对应的顺序,下标来匹配的
var [a, c, b] = arr
console.log(b) //a3
console.log(c) //a2
console.log(a) //a1
- 扩展运算符 ( 将内容一个个扩展出来 )
// 扩展运算符 ... 是针对数组的
console.log(...[1, 2, 3, 4, 5]) //1 2 3 4 5
// Array.of组成一个新的数组
console.log(Array.of(1, 2, 3, 4, 5)) //[1,2,3,4,5]
console.log(Array.of(...[1, 2, 3, 4, 5])) //[1,2,3,4,5]
九.新增的集合类型 ( 伪数组 )
伪数组其实也可以使用for...of进行变量 ( 实现迭代器 )
set
概述 : set是一个不允许重复的集合
set的构建
- 不传参构建的是一个空的set集合
- 传入数组由数组里面的元素构建一个集合 ( 数组去重 )
//使用new关键词进行操作
//里面可以传入实现迭代器的元素
//构建一个空的set集合
var set = new Set()
console.log(set)
// 传入一个数组,提取数组中的元素构建成一个set集合
var set = new Set([1, 2, 22, 21, 3, 2, 21, 22]) //会自动完成数组去重的功能
console.log(set) //1,2,22,21,3
set的方法及属性
属性
- size
//set的属性,只有size,表示的是长度
console.log(set.size)
方法
- add 添加方法
- delete 删除方法
- clear 清空
- has 判断是否存在
- forEach 遍历
- keys 获取所有的key返回迭代器
- values 获取所有的value 返回迭代器
- entries 获取所有的键值对 返回一个迭代器
// 相关方法
// 增加add
set.add(22) //如果添加的是重复元素,将不能添加进去
set.add('hello') //set中可以存储任意类型的数据
console.log(set) //1,2,22,21,3,'hello'
// 删除delete 传入对应的值进行删除
set.delete(22)
console.log(set) //1,2,21,3,'hello'
// 清空 clear
// set.clear()
console.log(set) // ''
// 改 就是将对应的内容删除再添加
// 查 has 判断是否存在,返回布尔类型,存在就返回true,不存在就返回false
console.log(set.has(1)) //true
// forEach 遍历的
set.forEach((v1, v2, s) => {
// 它的key就等于它的value
// v1表示key
console.log(v1)
// v2表示value
console.log(v2)
console.log(v1 == v2)//true
// s表示当前遍历的set
console.log(s)
})
// keys获取所有的key,values获取所有的value,entries获取所有的键值对,返回迭代器
console.log(set.keys())
console.log(set.values())
console.log(set.entries())
WeakSet : 专门用于存储对象的set
//专门用于存储对象的set,set并不能完成对象数组的去重
//无参构建
var ws = new WeakSet()
//有参构建,传入一个只读的对象数组
var ws = new WeakSet([{name:'jack'},{name:'rose'}])
console.log(ws)
//WeakSet只有三个方法,has add delete
ws.add({age:20})
console.log(ws.has({age:20}))//false,这个对象和添加的对象,不是同一个
ws.delete({age:20}) //删除不了,{age:20}!={age:20} ,不是一个对象
console.log(ws) //{{name:'jack'},{name:'rose'},{age:20}}
map
概述:map是一个键值对,key不允许重复,value可以重复 ( 抽取所有的key它可以组成一个set , 所有的value抽取就是一个数组 )
map的构建
- 无参构建
- 传入一个二维数组构建
//1.无参
var map = new Map()
console.log(map) //构建一个空的map
//2.传入一个二维数组
//传入的元素数组,第一个是key,第二个是值
var map = new Map([['name','rose'],['age',22],['sex','女']])
console.log(map)
map的属性及方法
属性
- size
//size是map里面的元素个数
console.log(map.size)
方法
- set 设置 , 修改
- get 通过key来获取value
- delete 通过key来删除
- clear 清空
- has 判断当前的key是否存在
- keys 返回所有的key
- values 返回所有的value
- entries 返回所有的键值对
- forEach 遍历
//相关方法
// 增 set
map.set(108,'yes')
console.log(map);
//修改就是对应的本身已经存在的key进行重新的设置
map.set('sex','girl')
console.log(map);
//删除 根据key来删除
map.delete(108)
console.log(map);
//清除所有的
// map.clear()
console.log(map);
//查询
//根据key判断是否存在
console.log(map.has('sex'));
//forEach 第一个值为值 第二个为键 第三个当前遍历map
map.forEach((v,k,map)=>{
console.log(k);
console.log(v);
})
//keys values entries
console.log(map.keys());
console.log(map.values());
console.log(map.entries());
//通过key来获取value
console.log(map.get('sex'));
WeakMap ( 基于weakSet构建的map )
//weakMap 是基于weakSet之上构建的,也就是对应的key是对象,抽取所有的key其实就是wekSet
//1.无参构建
var wm = new WeakMap()
//2.传入二维数组构建
var wm = new WeakMap([[{name:'hello'},'aloha']])
console.log(wm)
//它有四个方法
wm.delete
wm.get
wm.set
wm.has
十. class 类
概述 : 类是对象的模板 , 对象是类的实例 ( 类相当于建房子的设计图 , 对象相当于建好的房子 )
相关知识点 :
- class是用于修饰类的
- 类名 首字母必须大写
- class里面的constructor 是一个函数 , 它会在每次new的时候调用
- class中constructor的this指向当前构建的实例对象
- extends关键词是class之间的继承
- 如果使用了extends关键词 , 还想要在constructor中使用this , 那么必须先调用super方法
- 对应的super关键词指向父类的constructor
- 静态方法使用static关键词修饰 , 调用使用类名 . 方法名调用
// class是用于修饰类的 类是对象的模板(设计图)
//class修饰的类名必须首字母大写
// class 类名{
// 构造器
// }
//class里面的this 指向当前构建的对象实例
class Person{
//构造器 他是用于构建对象的方法
constructor(name){
this.name = name //this指向你对应构建的对象实例
this.sex = '男'
}
//静态方法 使用类名. 使用static关键词修饰的方法
static say(){
console.log('hello');
}
}
//构建对象使用new关键词
//new 操作符会做那些操作 开辟内存空间(建立一个对象) 存放对应的对象 自动执行对应的构造函数 将
对应的设置设置给到当前对象 然后将对象返回
var person = new Person('jack')
console.log(person);//{name:jack}
//静态方法调用
Person.say()
//继承 除了私有的其他全部可以继承
// extends关键词实现class的继承
class Child extends Person{ //child这个类继承Person类
constructor(name,age){
//如果使用extends关键词那么在对应的构造器里面不能直接使用this 要调用super函数
super(name) //相当于父类的构造函数 Person.constructor
this.age = age
}
}
var child = new Child('tom',88)
console.log(child);//{name:tom,sex:男,age:88}
十一. generator函数
//异步阻断变同步的内容
function* fn(){
yield setTimeout(()=>{console.log('你好');},2000)
yield setTimeout(()=>{console.log('你好世界');},1000)
yield setTimeout(()=>{console.log('hello');},0)
}
var a = fn()
a.next()//打印你好
a.next()//打印你好世界
a.next()//打印hello