ES5、ES6自学笔记( 三 )


Array.prototype.sum = function () {var sum = 0;for (let i = 0; i < this.length; i++) {const element = this[i];sum += element;}return sum;}var arr = [1, 2, 3];console.log(arr.sum());
继承call()
调用这个函数, 并且修改函数运行时的 this 指向
// call 方法function fn(x, y) {console.log('我想喝手磨咖啡');console.log(this);console.log(x + y);}var o = {name: 'andy'};// fn();// 1. call() 可以调用函数fn.call();// 我想喝手磨咖啡//Window {window: Window, self: Window, document: document, name: "", location: Location, …}// NaN// 2. call() 可以改变这个函数的this指向 此时这个函数的this 就指向了o这个对象fn.call(o, 1, 2);// 我想喝手磨咖啡// {name: "andy"}name: "andy"__proto__: Object// 3
借用构造函数继承父类型属性、方法
// 1.父构造函数function Father(uname, age) {// this指向父构造函数的对象实例this.uname = uname;this.age = age;}// 2.子构造函数function Son(uname, age, sex) {// this指向子构造函数的对象实例Father.call(this, uname, age);this.sex = sex;}var son = new Son("lv", 19, "男");console.dir(son);
// 给父的原型上添加方法Father.prototype.money = function () {console.log(10000);}// Son.prototype = Father.prototype;这样直接赋值会有问题,如果修改了子原型对象(__proto__),父原型对象也会跟着一起变化,因为父构造函数的原型中的prototype指向的是父的原型对象Son.prototype = new Father(); // 让子的构造函数原型指向父的构造函数原型,这样子的构造函数原型就可以使用父的构造函数原型,但是父类的原型对象是要使用__proto__才可以指向// 如果利用对象的形式修改了原型对象,别忘了利用constructor 指回原来的构造函数Son.prototype.constructor = Son;// 子的原型独有的方法Son.prototype.exam = function () {console.log("考试");}
类的本质
class本质还是.
类的所有方法都定义在类的属性上
类创建的实例,里面也有 指向类的原型对象
所以ES6的类它的绝大部分功能,ES5都可以做到,新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已 。
所以ES6的类其实就是语法糖.
语法糖:语法糖就是一种便捷写法. 简单理解, 有两种方法可以实现同样的功能, 但是一种写法更加清晰、方便,那么这个方法就是语法糖
实例对象.proto === 实例对象.. === 类构造函数. === 类的原型
ES5新增方法 数组方法:数组当前项的值index:数组当前项的索引arr:数组对象本身() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素,主要用于筛选数组注意它直接返回一个新数组: 数组当前项的值index:数组当前项的索引arr:数组对象本身some() 方法用于检测数组中的元素是否满足指定条件. 通俗点 查找数组中是否有满足条件的元素注意它返回值是布尔值, 如果查找到这个元素, 就返回true , 如果查找不到就返回false.如果找到第一个满足条件的元素,则终止循环. 不在继续查找.: 数组当前项的值index:数组当前项的索引arr:数组对象本身
// forEach 迭代(遍历) 数组var arr1 = [1, 2, 3];var sum = 0;arr1.forEach(function (value, index, array) {console.log('每个数组元素' + value);console.log('每个数组元素的索引号' + index);console.log('数组本身' + array);sum += value;})// filter 筛选数组var arr2 = [12, 66, 4, 88, 3, 7];console.log(sum);var newArr = arr2.filter(function(value, index) {// return value >= 20;return value % 2 === 0;});console.log(newArr);// some 查找数组中是否有满足条件的元素 var arr1 = ['red', 'pink', 'blue'];var flag1 = arr1.some(function(value) {return value =http://www.kingceram.com/post/= 'pink';});console.log(flag1);// 1. filter 也是查找满足条件的元素 返回的是一个数组 而且是把所有满足条件的元素返回回来(在filter中就算return也不会停止迭代)// 2. some 也是查找满足条件的元素是否存在返回的是一个布尔值 如果查找到第一个满足条件的元素就终止循环(如果返回true就停止迭代,false就接着迭代)