继承及ES5中的新增方法

继承

ES6之前并没有给我们提供extends继承.我们可以通过构造函数+原型对象模拟实现继承,被称为组合继承.

call()

可以使函数进行调用 --- 语法结构是：函数名.call()
可以改变函数里边this的指向 call(第一个参数是前边函数this的指向，第二个参数开始才是实参),call的主要作用是可以实现继承
call的缺点就是在改变this指向的同时也调用了前边这个函数

 <button>按钮</button>
    <script>
        var btn = document.querySelector('button');
        // btn.onclick = btns.call()
        // function btns() {
        //     fn.call(this)
        // }
        // // btn.click.call(window)
        function fn(a, b) {
            console.log(this);
            console.log(a);
            console.log(b);
        }
        // // fn()
        fn.call(10, 20)
  </script>

apply()

fun.apply(thisArg,[argsArray])

thisArg:在fun函数执行时指定的this值
argsArray:传递的值必须包含在数组里面
返回值就是函数的返回值,因为它就是调用函数
因此apply主要跟数组有关系,比如使用Math.max()求数组的最大值

 var o = {
            name: 'andy'
        };

        function fn(arr) {
            console.log(this);
            console.log(arr); // 'pink'

        };
        fn.apply(o, ['pink']);
        // 1. 也是调用函数 第二个可以改变函数内部的this指向
        // 2. 但是他的参数必须是数组(伪数组)
        // 3. apply 的主要应用 比如说我们可以利用 apply 借助于数学内置对象求数组最大值 
        // Math.max();
        var arr = [1, 66, 3, 99, 4];
        var arr1 = ['red', 'pink'];
        // var max = Math.max.apply(null, arr);
        var max = Math.max.apply(Math, arr);
        var min = Math.min.apply(Math, arr);
        console.log(max, min);

bind()

bind()不会调用函数,但是能改变this的指向

fun.bind(thisArg,arg1,arg2...)

// 1. 不会调用原来的函数可以改变原来函数内部的this 指向
// 2. 返回的是原函数改变this之后产生的新函数

    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
  var btns = document.querySelectorAll('button');
        for (var i = 0; i < btns.length; i++) {
            btns[i].onclick = function() {
                this.disabled = true;
                setTimeout(function() {
                    this.disabled = false;
                }.bind(this), 2000);
            }
        }
还有一种简单方法就是将var关键字改成let关键字

数组方法

迭代(遍历)方法:forEach()、map()、filter()、some()、every（）

filter()

array.filter(function(value,index,arr){})

filter()方法创建一个新的数值,数组中的元素是通过检查指定数组中复合条件的所有元素,主要用于筛选数组,注意它直接返回一个新数组
value:数组当前项的值
index:数组当前项的索引
arr:数组对象本身

 var arr = [11,22,33]
 var newArr=arr.filter(function(value){
   return value>20;
   })
  console.log(newArr)

some()

array.some(function(value,index,arr){})

some()方法用于检测数组中的元素是否满足指定条件,通俗点查找数组中是否有满足条件的元素
它的返回值是布尔值,如果查找不到这个元素,就返回false,否则就返回true
如果找到第一个满足条件的元素,则终止循环,不再继续查找
value:数组当前项的值
index:数组当前项的索引
arr:数组对象本身

map()

array.map(function(value,index,arr),thisIndex)

map()方法返回一个新数组,数组中的元素为原始数组调用函数处理后的值
map()不会对空数组进行检测,返回一个undefined
map()不会改变原始数组
返回值和原始值都是数组

var new_array=array.map(function(item){...});//这里的item是array的参数
demo1:
var data=[[1,2,3],[2,3,4],[3,4,5],[]]
var new_data=data.map(function(item){
      return item[0]
})
console.log(new_data)//[1,2,3,undefined]
demo2:
let array=[1,2,3,4,5]
let newArray=array.map((item)=>{
  return item*item
})
console.log(newArray)//[1,4,9,16,25]

对象方法

Object.keys()方法返回一个元素为字符串的数组.

Object.keys(obj)

效果类似for...in
输出对象中值大于2的key的数组

var obj={
  pname:'张三',
   age:'18',
   sex:'男'
}
console.log(Object.keys(obj));

Object.defineProperty()定义新属性或修改原有的属性.

Object.defineProperty(obj,prop,descriptor)

obj:必需.目标对象
prop:必需.需定义或修改的属性的名字
descriptor:必需.目标属性所拥有的特性

var obj={
  id:1,
  pname:'小米',
  price:1999
}
 Object.defineProperty(obj, 'address', {
            value: '中国山东蓝翔技校xx单元',
            // 如果只为false 不允许修改这个属性值 默认值也是false
            writable: true,
            // enumerable 如果值为false 则不允许遍历, 默认的值是 false
            enumerable: true,
            // configurable 如果为false 则不允许删除这个属性 默认为false
            configurable: true
        });
 console.log(obj.address);

函数定义的方式

函数声明方式function关键字(命名函数)
函数表达式(匿名函数)
new Function()