JavaScript小总结

silly_chen
113 阅读21分钟

一、ES6介绍

Javscript分为三大部分：ECMAScript + DOM + BOM

ECMAScript就是一种语法标准，规定了这个语言的语法要如何书写，何种语法有何种作用。

ES === ECMAScript

二、ES6变量声明

2.1、var的弊端

使用var关键字声明变量的弊端：

1、var声明的变量有预解析，造成 逻辑混乱，可以先使用，后声明

2、var可以重复定义同一个变量，逻辑错误，第二次应该是修改变量，而不是定义

3、var用在for循环条件中，造成for 循环的污染的问题

4、var 声明的变量没有块级作用域（ES5中的作用域：全局和局部）

2.2、let关键字**

  1. let声明的变量不会提升，必须要在声明后才能使用
  2. let声明的变量不能重复声明
  3. let声明的变量存在块级作用域
  4. let用在for循环条件中，不会造成for 循环的污染的问题

2.3、const关键字**

  1. 一旦声明就必须赋值
  2. 一旦赋值就不能修改
  3. 常量的作用域和let声明的变量作用域一样 块级作用域
  4. 没有预解析
  5. 引用类型的值可以修改(引用地址不可以修改)

三、解构语法

3.1 对象解构

let obj = {
    name: "luowowo",
    age:11,
    email:"luowowo@163.com"
};
// 完全解构
// let {name, email, age} = obj;  //{ }中的变量名和obj的属性名一致   
// 部分解构
// let {name} = obj;    
// 解构之后重命名   
// let {name:itsName} = obj;     解构之后重命名为itsName
// 将现有对象的方法，赋值到某个变量
// let {random}=Math;
// console.log(random)//[Function: random]

3.2 数组解构

// let arr1 = [10, 20, 30];
// 完全解构   若解构不成功,变量的值是undefined
// console.log(d);  //undefined
// let [a, b, c , d] = arr1;

// 部分解构
// let [e] = arr1;
// console.log(e);  //10

// let [ , ,f] = arr1;  逗号占位一个元素
// console.log(f);  //30

// 复合解构
let arr2 = [1, 2, [10, 20, 30]];
let [ j, k, [x, y, z]] = arr2;

4.3、字符串解构

// let string1 = "xyz";
// let [a,b,c] = string1;
// 可以解构但是无法使用方法修改里面的值

四、对象的简化写法***

let name = '狗蛋',age = 12,gender = '男'
let obj = {
  name : name,
  age : age,
  gender : gender
}

我们发现obj的属性名和变量是同样的，可以在es6中简化:

let obj = {name,age,gender}

如果一个对象的属性名和外面的一个变量名同名，可以直接将变量名作为属性名，并会自动地把变量的值作为属性的值

五、函数参数默认值和参数解构

5.1 函数形参的默认值 ***

es5里面如果我们想要实现参数可以省略

function add(a,b,c,d){
  a = a || 0;
  b = b || 0;
  c = c || 0;
  d = d || 0;
  return a + b + c + d;
}

es6中提供了一种更加方便的方式，专门实现参数默认值。

funciton 函数名(参数=默认值){ // 注意当 参数 为 undefined 时 参数 赋值为 默认值
}
function add(a=0,b=0,c=0,d=0){
  return a + b + c + d;
}

5.2 函数参数的解构赋值

 // 参数是一组有次序的值
function f([x, y, z]) { 
    console.log(x, y, z);
}
f([1, 2, 3]);
// 参数是一组无次序的值
function fn({x, y, z}) { // {x, y, z} = obj 解构
    console.log(x, y, z);
}
fn({z: 4, x: 5, y: 6});

5.3 解构赋值指定参数的默认值***

function func2({name, age} = {}){   //防止不传实参时候的报错
    console.log(name, age);
}
func2();   //undefined undefined
// func2(); //相当于传了一个null   {name, age}=null 就会报错
// func2({});  //不会报错，输出：undefined undefined

function func2({name="luowowo", age=11} = {}){    //指定默认值
    console.log(name, age);
}
func2();  //luowowo 11

六、rest 参数和拓展运算符

6.1 rest 参数/剩余参数***

arguments对象:

function fn(){
    console.log(arguments);// 伪数组
}

fn(10, 20, 30, 50, 60);

使用rest 参数 : 注意rest 参数之后不能再有其他参数（即只能是最后一个参数），否则会报错。

function func( a, b ,...rest){  // 把剩余的参数都交给rest
    console.log(rest);
}

func(10, 20, 30, 50, 60);

function func2(...rest){   //rest 接收所有参数作为一个数组
    rest.forEach(function (item) {
        console.log(item);
    });
}
func2(60, 70, 80, 90);

// 报错
function f(a, ...b, c) {
  // ...
}

6.2 拓展运算符***

它的作用就是可以将数组或者对象展开，拆开成为一个一个单独的数据。

// 快速将一个数组拆开成一个一个的元素
let arr = [1, 2, 3, 4]
console.log(...arr)  // 1 2 3 4
// 快速将一个对象里面的数据复制一份到一个新的对象里面
let obj = { name: '狗蛋', age: 12, gender: '男' }
console.log({id:1,birthday:'2020-02-02', ...obj})
// 将一个字符串拆开成为多个单独的字符
let str = 'abc'
console.log(...str)

使用场景:

// 1、数组中的值作为函数参数使用
let arr1 = [10, 20, 30];
function func(a, b, c){
    console.log(a,b,c)
}
func(...arr1);  //等效于：func(10,20,30);     输出结果10 20 30

// 2、合并数组
let arr2 = [40, 50, 60];
let newArr = [...arr1,...arr2];  // 等效于 [ 10, 20, 30, 40, 50, 60 ]
console.log(newArr);    //[ 10, 20, 30, 40, 50, 60 ]

// 3、合并对象
let obj1 = {
    name:"luowowo",
    age:"11",
};
let obj2 = {
    email:"luowowo@163.com",
};
let newObj = {...obj1,...obj2}; // 等效于{ name: 'luowowo', age: '11', email: 'luowowo@163.com' }
console.log(newObj);    //{ name: 'luowowo', age: '11', email: 'luowowo@163.com' }

// 4、es6中另一个合并对象的方法
let newObj2 = Object.assign({},obj1,obj2);  // 把第二个及第二个以上的参数都合并到第1个上面去。
console.log(newObj2);   //{ name: 'luowowo', age: '11', email: 'luowowo@163.com' }

6.3 ...在解构赋值中的使用

针对数组解构

let [a, b, c, ...arr] = [1, 2, 3, 4, 5, 6, 7];
console.log(a, b, c, arr); // a = 1, b = 2, c = 3, arr = [4,5,6,7]

七、箭头函数

7.1 this指向的总结

  1. 全局使用this----------指向window
  2. 函数全局调用 this----------指向window
  3. 对象方法中使用this------ 指向 这个对象
  4. 事件中使用this------------指向事件源
  5. 定时器中使用this-----------指向window
  6. 箭头函数没有自己的作用域，即箭头函数 this 指向其外层作用域
  7. 在构造函数中，this直接执行当前创建出来的新对象

7.2基本语法

// 固定语法:
(参数) => { 函数体 }

注意点:

  1. 形参个数如果为1个，可以省略小括号不写;

  2. 如果函数体里面只有一个语句，可以省略大括号不写, 并且他会默认返回 => 符号后面的数据。

  3. 如果函数体有多个语句，则不能省略大括号。

  4. 如果函数体只有一个语句，且返回一个对象，建议是，不要写简写的方式。

  5. 箭头函数不可以使用 arguments 获取参数列表，可以使用 rest 参数代替。

  6. 返回一句话,并且是一个对象, 不能简写 ( 对象的{}和函数{} 会分不清 )

// 无参数无返回
let func11 = () => console.log('func11');
func11();

// 无参数有返回
let func22 = () => 'func22';
console.log(func22());

// 有参数无返回
let func33 = x => console.log('func33', x);
func33(2);

// 有参数有返回
let func44 = (x, y) => {
    let sum = x + y; 
    return sum + 'func44';
};
console.log(func44(1, 2));

八、Promise介绍

8.1 Promise简介

功能：避免了回调地狱，把异步代码改成调用起来像同步代码。

一个 Promise 对象 有以下几种状态：

  • pending: 初始状态，既不是成功，也不是失败状态。
  • fulfilled: 意味着操作成功完成。
  • rejected: 意味着操作失败。

Promise对象有以下两个特点：

1.对象的状态不受外界影响。

2.一旦状态改变，就不会再变，任何时候都可以得到这个结果。

8.2 Promise 基本使用

Promise的基本语法

// 默认pending: 初始状态
var p=new Promise(function (resolve,reject) {
    if("操作成功"){
        resolve();//pending-->fulfilled  异步操作成功的回调函数
    }else{
        reject(); //pending-->reject     异步操作失败的回调函数
    }
})
p.then(data => {//在外面调用then处理成功的逻辑
    console.log("处理成功的逻辑");//fulfilled  
}).catch(err=>{//在外面调用catch处理失败的逻辑
    console.log("失败的逻辑");//reject
})
// then方法会在异步成功后调用，catch方法会在异步失败后调用

例如:

let flag = false;
let p = new Promise((resolve, reject) => {
    if (flag) {
        resolve("做一件大事");
    } else {
        reject("说句对不起");
    }
});
p.then((data) => {
    console.log("我要" + data); //fulfilled
}).catch((err) => {
    console.log("我要" + err); //reject
});

8.3 使用Promise解决回调函数地狱

Promise的then链式调用的特点： 1、第一个then执行完会执行第二个then 2、then里面的函数的返回值，会被下一个then的形参接收 3、如果返回的是一个promise对象，下一个then的形参接收到的不是这个promise对象，而是这个promise对象内部调用resolve时候的实际参数

8.4 Promise方法的使用

all方法：

  1. 只有p1、p2、p3的状态都变成fulfilled，p的状态才会变成fulfilled，此时p1、p2、p3的返回值组成一个数组，传递给p的回调函数。

  2. 只要p1、p2、p3之中有一个被rejected，p的状态就变成rejected，此时第一个被reject的实例的返回值，会传递给p的回调函数。

    const p1 = new Promise((resolve, reject) => {
    setTimeout(() => {
        reject("失败");
    }, 3000);
});
const p2 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("成功2");
    }, 2000);
});
const p3 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("成功3");
    }, 1000);
});

// 全部成功返回成功，有一个失败返回失败
let p = Promise.all([p1, p2, p3]).then((res) => console.log(res)).catch(err=>console.log(err));

**race方法：**只要p1、p2、p3之中有一个实例率先改变状态，p的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p的回调函数。

let p = Promise.race([p1, p2, p3])
.then((res) => {
    console.log(res);
})
.catch((err) => {
    console.log("网络状态不佳");
    console.log(err);
});

8.5 异步代码同步化

async函数和await关键字一般成对出现，当函数执行的时候，一旦遇到await就会先返回，等到异步操作完成，再接着执行函数体内后面的语句。

const p1 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("成功1");
    }, 3000);
});
const p2 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("成功2");
    }, 2000);
});
const p3 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve("成功3");
    }, 1000);
});
async function getVal(){
    await p1.then(res=>console.log(res))
    await p2.then(res=>console.log(res))
    await p3.then(res=>console.log(res))
}
getVal()

九、面向对象

9.1 对象的操作

  • 访问
    • person.name person["age"]
    • person.eat() person["sleep"]()
  • 增加、修改
    • person.name="xxx"
    • 已存在则修改，不存在则新增
  • 删除
    • delete person.name

9.2 字面量创建对象(掌握)

var book1 = {
    name:"JavaScript权威指南",
    price:100,
    author:"作者",
    showInfo:function () {
        console.log("描述信息");
    }
}
console.log(book1);

优点：方便直观，可以直接访问里面的属性方法； 缺点：创建大量相或相似对象时，会出现代码重复，只适合创建单个对象

9.3 内置构造函数创建对象

使用new关键字+内置的构造函数创建对象

var book = new Object();
book2.name="JS";
book2.price=10;
book2.author="作者";
book2.showInfo=function () {
    console.log("描述信息");
}
book2.showInfo();

缺点：和字面量创建存在一样问题：代码重复

9.4 简单工厂函数创建对象

function createPerson(name, age) {
    var p = new Object();
    p.name = name;
    p.age = age;
    return p;
}
console.log(createPerson("Neld", 10))

优点：值是活的，可以批量操作，减少重复代码 缺点：无法判断对象类型

9.5自定义构造函数创建对象(掌握)

语法:

function 函数名（参数列表）{
	this.key1=参数1,
	this.key2=参数2,
}
var obj = new 函数()

自定义构造函数创建对象

function CreatePerson(name, age, sex) {
    this.name=name;
    this.age=age;
    this.sex=sex;
}
var p = new createPerson("Neld", 10, 1);
var p2 = new createPerson("Song", 12, 0);
console.log(p);
console.log(p2);

注意点:

  1. 构造函数名的首字母要求大写
  2. 在函数中，不需要手动创建对象进行数据封装，会自动创建对象并封装数据
  3. 在函数最后，不需要手动返回创建好的对象，会自动返回
  4. 构造函数一样可以直接调用，此时内部的this执行window，这种方式不太安全，有可能会在函数内部修改当前的全局变量，不建议使用，而且这样做也不能创建对象，必须要搭配new关键字一起使用才能创建对象

new 这个关键字做了什么事情（实例化）：

  1. 在函数内部默认会创建一个空对象——var obj = new Object();
  2. 默认把创建好的对象赋值给this——this = obj;
  3. 通过this添加属性和方法——this.xx=xx……
  4. 默认会把内部创建的对象返回——return this;

十、构造器属性（必须掌握）

10.1 抽象

  • 构造器(类)：
    • 泛指一类事物
    • 把多个对象相同的部分抽象出来，成为一个类，就是一个函数，构造函数，和new一起来创建对象，
  • 对象：
    • 特质某一个具体事物
    • 使用构造函数创造出来的对象的类型就是构造函数这种类型

10.2 分类

10.2.1constructor属性

定义：使用constructor属性可以获取到创建对象使用的构造器函数（类）。

语法：对象.constructor——————获取到就是该对象的类

function Person(name) {
    this.name = name;
}
function Dog(name) {
    this.name = name;
}
var p = new Person("p");
var d = new Dog("d");
console.log(p.constructor);//打印得到Person函数对象
console.log(d.constructor);//打印得到Dog函数对象
if(p.constructor === Person){
    console.log("p是Person对象");
}
if(d.constructor === Dog){
    console.log("d是Dog对象");
}
10.2.2 instanceof关键字

定义：instanceof关键字用来判断对象的类型是否是某个类，如果是返回true，反之返回false。

语法：var ret = 对象名 instanceof 类名;————————获取到的是一个布尔值

function Person(name) {
    this.name = name;
}
function Dog(name) {
    this.name = name;
}
var p = new Person("p");
var d = new Dog("d");
console.log(p instanceof Person);//true
console.log(d instanceof Person);//false

十一、原型对象

11.1、原型对象释义（必须掌握）

定义：每一个构造函数都有一个与之相关联的对象，该对象称之为原型对象。

功能：每个实例对象都能共享其原型对象上的属性和方法，减少内存分配。

语法：

  1. 构造函数.prototype 获取原型对象
  2. 构造函数.prototype.成员名 = 成员值 在原型对象上添加成员的方法
function Person(name, age) {
    this.name = name;
    this.age = age;
}
//在原型对象上添加say函数，实例对象共享该函数
Person.prototype.say = function(){
    console.log("say hello");
};
var p = new Person("zs", 10);
p.say();
var p2 = new Person("zs", 10);
p2.say();

11.2 面向对象中的核心概念（理解）

构造函数：Person，和new关键字一起创建对象

原型对象：Person.prototype，

实例对象：由构造器创建出来的对象称之为实例对象

**实例化：**由构造器创建实例对象的过程称之为实例化

对象的成员：属性+方法

**实例成员：**实例对象上的属性和方法，name,age，只能当前实例对象才能访问

**原型成员：**原型对象上的属性和方法，say()，使用该原型对象对应构造器创建出来的所有实例对象都能访问

**静态成员：**直接添加在构造函数上的属性和方法，只能使用构造函数才能访问

11.3 获取原型对象的方法

11.3.1 __proto__属性(必须掌握)

语法： 实例对象.__ proto __;

实例对象.__ proto __ === 构造器.prototype；

11.3.2 getPrototypeOf方法（了解）

定义：Object构造器上的静态成员方法。

语法：Object.getPrototypeOf(实例对象) 获取指定实例对象的原型对象

11.3.3、构造函数创建实例对象补充（必须掌握）
function Person(name) {
    //默认创建一个Object对象 var obj = new Object();
    //将obj对象赋值给this   this = obj;
    this.name = name;//通过this添加属性和方法
    //返回封装好的this对象，return this;
}

让最终创建出来的对象拥有具体的类型

//设置obj的__proto__属性指向Person构造函数的原型对象
//obj.__proto__ = Person.prototype;

构造函数创建实例对象的完整过程：

  1. 在函数内部默认会创建一个空对象——var obj = new Object();
  2. 设置obj.__proto__ 属性指向构造器.prototype——obj.__proto__ = Person.prototype;
  3. 默认把创建好的对象赋值给this——this = obj;
  4. 通过this添加属性和方法——this.xx=xx……
  5. 默认会把内部创建的对象返回——return this;

十二、原型对象的设置和访问（掌握）

12.1、设置原型遇到的问题

先实例再添加方法.png

先添加方法再实例化.png

12.2、原型对象的访问规则

证明p.constructor是什么：

p.constructor === Object  //实例对象的constructor属性指向了Object构造函数
字面量对象.constructor===Object  //说明新的原型对象的constructor属性也指向了Object构造函数
字面量对象.__proto__===Object.prototype  //说明新的原型对象的构造函数和与之相对应的原型对象实例化了该对象

十三、原型相关属性学习（掌握）

13.1 in关键字

定义：用来检查对象中是否存在某个指定的属性(不区分实例属性和原型属性)，

语法："属性名" in 实例对象

用法：无论判断的成员是属于当前实例对象还是属于其原型对象的，都返回true，如果都不存在，则返回false。

13.2 hasOwnProperty方法

定义：Object的原型成员，所有实例对象都能访问的方法，

语法：实例对象.hasOwnProperty("属性名")

用法：只判断当前实例对象中是否存在实例的属性，存在返回true，反之返回false。

13.3、isPrototypeOf方法

定义：Object的原型成员，判断某个对象是否是指定对象的原型对象

语法：原型对象.isPrototypeOf(实例对象)

用法：A.isPrototypeOf(B) 判断的是A对象是否存在于B对象的原型链之中

13.4、instanceof关键字

定义：字面意思理解为判断当前对象是否是指定的类型，更深层次理解应该是，指定类型是否在当前实例对象的原型链上，如果是返回true，反之返回false。

语法：实例对象 instanceof 构造函数

用法：A instanceof B 判断的是B.prototype是否存在与A的原型链之中

十四、面向对象三大特性（了解）

14.1、混入式继承（了解）

实现原理：将父类成员拷贝到子对象中（浅拷贝）。

实现方法：for…in…循环遍历父类，子类[key]=父类[key]

缺点：共享数据安全问题，修改子类，会影响父类，引用数据类型浅拷贝，会修改引用地址

//混入式继承（拷贝继承）
//obj2继承到obj1中的成员，可以直接将obj1中的成员拷贝到obj2中即可
var obj1 = {name:"zs",age:10};
var obj2 = {};
// 将obj1中的成员拷贝到obj2中
for (var key in obj1){ 
    obj2[key] = obj1[key];
}
console.log(obj1);
console.log(obj2);

14.2、原型式继承（了解）

实现原理：将父类中的原型成员添加到子类的原型链中。

实现方式：子类.prototype = 父类.prototype

缺点：数据共享安全，只能继承父类原型对象中成员，不能继父类实例对象成员

function Animal() {
}
Animal.prototype.name="animal";

function Person() {
}
//修改Person的原型对象
Person.prototype= Animal.prototype;

Person.prototype.useTool = function () {
    console.log("use fire");
}
var p = new Person();
console.log(p);
var ani = new Animal();
console.log(ani);

4.3、原型链继承（掌握）

实现原理：将子类的原型对象指向父类的实例对象。

实现方法：子类.prototype = new 父类()

存在问题:存在数据共享问题,无法给父类构造函数传递参数

function Person(name,age) {
    this.name = name;
    this.age = age;
}
Person.prototype.getInfo = function () {
    console.log("name:",this.name,"age:",this.age);
}
function Student(score) {
    this.score = score;
}
Student.prototype = new Person("小明",10);//继承父构造函数并设置name和age的值
Student.prototype.getScore = function () {
    console.log("分数:"+this.score);
}
var p1 = new Student(100);
p1.name="xxx"//只能这样一个个修改，无法向父类传参
var p2 = new Student(12);
console.log(p1);
console.log(p2);

4.4、借用构造函数继承（掌握）

4.4.1、call方法和apply方法的基本使用（十分重要）

定义：将方法借给某个对象的方法。call和apply作用相同，写法不同

特点：可以设置方法中this的指向——方法中的this指向借用对象

被借用对象.方法.call(借用对象)
被借用对象.方法.apply(借用对象)

call和apply的区别（传参方式不同）：

// call传参，跟在借用对象后面，用逗号隔开
被借用对象.方法.call(借用对象,参数1,参数2……)
// apply传参，不能直接写在后面，要将参数封装在数组中跟在借用对象后面，用逗号隔开
被借用对象.方法.apply(借用对象,[ 参数1,参数2…… ])
4.4.2、借用构造函数继承说明

实现原理:子构造函数中调用父构造函数，达到继承并向父构造函数传参的目的。

这种继承方式都存在下面两个问题：

  1. 如果父子构造函数存在相同的成员，那么子构造函数会覆盖父构造函数中的成员
  2. 不能继承原型链中的成员

4.5 组合继承（必须掌握）

实现原理：基原型链继承+借用构造函数继承

function Student(name,age,score) {
   //Person.call(this,name,age);
   Person.apply(this,[name,age]);//继承构造函数中的成员
   this.score = score;
}
Student.prototype = new Person();//继承原型链上的成员
Student.prototype.constructor = Student

4.6、寄生组合继承（拓展）

// 寄生式组合继承，在父子类中间再加一层，去掉子类原型对象上的无用属性
(function () {// 4.创造一个独立的作用域，用完失效
    // 1.创建一个没有实例成员的Super类
    var Super = function () { };
    // 2.将Super类的原型对象指向父类的原型对象
    Super.prototype = Person.prototype;
    // 3.将Super类的实例作为子类的原型
    Student.prototype = new Super();
	Student.prototype.constructor = Student;
})();

十五、绘制完整的原型链结构图（掌握）

完整的原型链图.png

总结：

  1. 所有的函数对象都是Function类型，由Function构造函数创建
  2. Function的原型对象是一个匿名空函数，绑定了函数中的通用方法
  3. 空函数对象的类型是Object
  4. Function函数对象由自身的构造函数创建

十六、基本包装类型的使用（理解）

创建方式

// 方式一：
var str1 = new String("string1");
var num1 = new Number(123);
var bool1 = new Boolean(true);
// 方式二
var str2 = new Object("string2");
var num2 = new Object(456);
var bool2 = new Object(false);

十七、私有成员和特权方法（了解）

   // 构造函数(构造器, 类) Person
        function Person(name, age) {
            // 私有成员: className getClassName
            //   构造函数内部,声明的变量或者方法   
            var className = "前端最靓的靓仔!!!";
            // 实例成员 name age
            this.name = name;
            this.age = age;
            function getClassName() {
                return className;
            }
            // 特权方法: showClass
            //   在构造函数内部,使用了私有成员的实例方法
            //   功能: 局部变量 在 函数外部 可以访问(闭包)
            this.showClass = function () {
                console.log(this.name + "是" + getClassName());
            }
        }
        // 原型对象 Person.prototype
        // 原型成员 eat
        Person.prototype.eat = function () {
            console.log("每天都要吃饭");
        }
        // 静态成员 showInfo
        Person.showInfo = "我是一个人类";
        // 实例化的过程 new
        // 实例对象 p
        var p = new Person("欧阳三", 20);
        console.log(p);
        p.eat();
        console.log(Person.showInfo);
        p.showClass();

成员：对象的属性和方法

实例成员：实例对象的属性和方法 name\age | showName\showClass

静态成员：构造函数自己的属性和方法 info

原型成员：构造函数对应的原型对象的属性和方法 des

私有成员：在构造函数中声明的变量和函数，因为我们只能在函数内部访问，所以是私有的 className getClassName

特权方法：在函数内部使用了私有成员的实例方法被称为是特权方法（闭包） showClass

十八、Object成员（了解）

18.1 原型成员

  • constructor：获取当前对象的构造函数
  • hasOwnProperty：判断当前实例对象中是否存在指定的属性
  • isPrototypeOf：判断当前对象是否在指定对象的原型链中
  • valueOf：返回当前对象对应的值。
  • toString：返回数据特定的格式的字符串 [object 构造函数]。(判断类型)

18.2 静态成员

  • assign：将多个对象合并到一个对象中并返回
  • create：创建对象，并设置原型对象
  • is：判断两个参数是否相等，等同于===，注意下面两种特殊的判断即可
console.log(0 === -0); //true
console.log(Object.is(-0, 0)); //false
console.log(NaN === NaN); //false
console.log(Object.is(NaN, NaN)); //true
  • values：获取当前对象所有属性的值，合并成一个数组并返回

十九、ES6类的实现——class（必须掌握）

19.1 class的基本结构

定义:calss关键字定义类，创建构造函数，类名首字母大写

class 类名{
  constructor(参数1,参数2){
    // 构造函数体，添加实例对象成员
  }
  方法名(){
    // 添加原型对象成员
  }
  static 方法名{
    // 添加静态成员，只能用类调用
  }
}
var d=new 类名

19.2 class的继承解构

//  语法结构:
class 子类 extends 父类{
  constructor(参数1,参数2){
    //调用父类构造函数，将数据封装到对应属性中
    super(参数1,参数2);
  }
}

二十、异常捕获(了解)

try{
 	 // 可能出错的代码
}catch(e){
 	 // 处理try代码块中抛出的异常
 	 // e 错误信息
 	 throw //抛出自定义异常
}finally{
 	 // 无论什么情况都会执行代码块
}：

二十一、严格模式（了解）

限制1：不允许使用未声明的变量

限制2：严格模式定义在脚本开头，会对整个脚本执行严格模式

限制3：如果严格模式定义在函数头部，那么只在当前函数中使用严格模式，对函数外部的代码没有影响。

....

avatar
文章
阅读
粉丝