基础知识
面向过程编程:是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。
面向对象编程:面向对象是把事物分解成为一个个对象,然后由对象之间分工与合作。面向对象是以对象功能来划分问题,而不是步骤。
面向对象的特性:封装性、继承性、多态性
面向过程和面向对象:
类和对象
对象:js中的对象是一组无序的相关属性和方法的集合,所有的事物都是对象。
- 属性:事物的特征,有属性值。(名词)
- 方法:事物的行为,可以有返回值,操作功能。(动词)
对象是类的实例,类时对象的抽象。类抽象了对象的公共部分,泛指大类,对象特指某个。
创建类:
类的继承
继承中的属性和方法查找原则:就近原则。
继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类的。
继承中,如果子类里面没有,就对查找父类有没有这个方法,如果有,就执行父类的这个给方法(就近原则)。
- ES6中类没有变量提升,所以必须先定义类,才能通过实例化对象。
- 类里面的共有的属性和方法一定要加this使用。
- constructor里面的this指向实例对象,方法里面的this指向这个方法的调用者。
对象前后插入元素:element.insertAdjacentHtml(positon,text)
双击禁止选定文字
设置文本框的文字处于选定状态
文本框变量名.select()。
构造函数
构造函数是一种特殊的函数,主要用来初始化对象,即为对象成员变量赋初始值,它总与new一起使用。我们可以把对象中的一些公共的属性和方法抽取出来,然后封装到这个函数里面。
注意事项:
- 构造函数用于创建某一类对象,其首字母要大写。
- 构造函数要和new一起使用才有意义。
new在执行时做的事情:
- 在内存中创建一个新的空对象。
- 让this指向这个新的对象。
- 执行构造函数里面的代码,给这新对象添加属性和方法。
- 返回这个新对象(所以构造函数不需要return)
实例成员和静态成员:
原型链
字符串和对象
var strNew=str.trim() :去除字符串两侧空格。
对象属性操作
1、获取:Object.keys(obj)用于获取对象自身所有的属性名。结合数组的forEach()遍历出每一个。
2、定义和修改属性:Object.defineProperty()。
函数进阶
1、利用new Function()来定义函数
2、立即执行函数
3、this指向问题
4、apply方法和bind方法
5、严格模式:严格条件下运行js代码
语义更改:
- 消除了js语法的一些不合理、不严谨之处,减少怪异行为。
- 消除代码运行的不安全之处,保证代码运行的安全。
- 提高编译器效率,增加运行速度。
- 禁用了es可能会定义的一些语法,如保留字不能作为变量名。
使用方法:声明"use strict"
严格模式下this指向问题
严格模式下函数变化
- 函数不能有重名的参数。
- 函数必须声明在js的顶层,不允许在非函数的代码块内声明函数。(比如循环内)
6、高阶函数——函数可以放在函数体里作为参数传递
7、闭包——有权访问另一个函数作用域中变量的函数
- 一个作用域可以访问另外一个函数的局部变量。
- fn函数外面的作用域可以访问fn内部的局部变量。
- 闭包作用:延伸了变量的作用范围。
利用闭包的方式的到当前小li的索引号:
7、递归——函数内部自己调用自己
- 递归函数的作用和循环效果一样。
- 由于递归很容易出现“栈溢出”错误,所以必须加退出条件return
8、浅拷贝和深拷贝。
- 浅拷贝只是拷贝一次,更深层次对象级别的只引用拷贝对象地址,一起改变。
- 深拷贝拷被数据多层,每一级别的数据都会被拷贝。
es6新增浅拷贝方法:Object.assign(target,source)。
深拷贝方法:封装函数
ES6
1、let和const
let
- let声明的变量只在所处于的块级作用域有效。(var无块级作用域)
- 不存在变量提升(定义完,后面再使用)。
- 暂时性死区
const
- 具有块级作用域
- 声明常量时必须赋值。
- 常量赋值后,值不能修改
2、解构赋值
按照一定模式,从数组中或对象中提取值,将提取出来的值给另外的变量。
对象解构:
3、箭头函数
es6新增的定义函数的方式
- 函数体只有一句代码,且代码的执行结果是返回值,可以省略大括号。
- 如果形参只有一个,可以省略小括号
- 如果形参只有一个,可以省略小括号
4、剩余参数
- 剩余参数语法允许我们将一个不定数量的参数表示为一个数组。
- 剩余参数和解构配合使用
5、Array的扩展方法
扩展运算符(展开语法)
- 扩展运算符可以将数组或者对象转为逗号分隔的参数序列。(...ary将原数组的中括号去掉,内容保留)
- 扩展运算符可以应用于合并数组。
- 扩展运算符将伪数组转换为真正的数组。
Array.from()
- 将类数组或可遍历的对象转换为真正的数组
- 可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理好的值放入返回的数组。
find()方法
用于找出第一个符合条件的数组成员,如果没有找到返回undefined。
findIndex()方法
用于找出第一个符合条件的数组成员的位置,如果没有则返回-1.
includes()方法
表示某个数组是否包含给定的值,返回布尔值。
6、String的扩展方法
模板字符串
- ES6新增的创建字符串的方式,使用反引号定义。
- 模板字符串中可以解析变量,
- 模板字符串中可以换行
startsWith()方法和endsWith()方法
startsWith():表示参数字符串是否在原字符串的头部,返回布尔值。
endsWith():表示参数字符串是否在原字符串的尾部,返回布尔值。
repeat()方法
repeat方法表示将原字符串重复n次,返回一个新字符串。
7、Set数据结构
ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值。
- Set本身是一个构造函数,用来生成Set数据结构。
- Set函数可以接受一个数组作为参数,用来初始化。
- set.size返回该set对象的数组长度。
- add(value):添加某个值,返回对象结构本身。
- delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
- has(value):返回一个布尔值,表示该值是否为该Set数组的成员。
- clear():清除所有成员,没有返回值。
- 遍历:同数组一样,拥有forEach方法,用于对每个成员执行某种操作,没有返回值。