javascript--面向对象

一、

1.在类中使用constructor来放置属性

2.extends 关键字可以实现子类继承父类

3.super可以实现子类继承父类的方法和构造函数

4.利用 insertAdjacentHTML() 可以直接把字符串格式元素添加到父元素中 

语法：

 var li = '<li class="liactive"><span>新建</span><span class="iconfont icon-guanbi"></span></li>'

            that.ul.insertAdjacentHTML('beforeend', li);

5.原型：每一个构造函数都有一个 prototype 属性，指向另一个对象。这个 prototype 就是一个对象，这个对象的所有属性和方法，都会被构造函数所拥有。原型的作用：资源共享。

6.继承call（）;

(1)call() 可以条用函数   语法：fn.call();

(2)call() 可以改变这个函数的this指向  此时这个函数的this 就指向了o这个对象

语法：var o = { name: 'andy'}; fn.call(o);

7.forEach 迭代（遍历数组）

语法： var  arr = [1,2,3];

arr.forEach(function(value,index,array){

      console.log('每个数组元素' + value);

       console.log('每个数组元素的索引号' + index);

       console.log('数组本身' + array);

}) 

8.filter()方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素,主要用于筛选数组，注意它是直接返回一个新数组

语法：var arr = [1,23,30,4,24,11];

var newArr = arr.filter(function(value,index,array){

       return value % 2 === 0 ; //求出偶数

});

     console.log(newArr);//打印最终值

9.some()方法用于检测数组中的元素是否满足指定条件。查找数组中是否有满足条件的元素,它到返回值是布尔型，如果有这个元素就返回true，如果没有就返回false，如果找到第一个满足条件到元素则会终止循环，不在继续查找 

语法：var arr = ['red','blue'];

 var flag1 = arr.some(function(value){

      return value  == 'blue';

});

  console.log(flag);//返回的是true

二、字符串方法

1.trim方法去除字符串两侧空格

语法： var str = '  an dy    ';

            var str1 = str.trim();

           console.log(str1);//最终结果是an dy，两侧空格去掉字符之间中到空格会保留；

三、对象方法

1.Object.keys()用于获取对象自身所有的属性 ；//Object.keys(obj);

2.Object.defineProperty()定义对象中新属性或修改原有的属性。

语法：Object.defineProperty(obj，prop，descriptor)

（1）obj : 必需。目标对象 

（2）prop: 必需。需定义或修改的属性的名字

（3）descriptor: 必需。目标属性所拥有的特性

descriptor以对象形式｛｝书写

 属性一是value:: 设置属性的值

属性二是writable: false/true;如果值为false 不允许修改这个属性值 默认值也是false

属性三是enumerable: false/true;如果值为false 则不允许遍历, 默认的值是 false

属性四是configurable: false/true;如果为false 则不允许删除这个属性 不允许在修改第三个参数里面的特性 默认为false

四、改变函数this的指向 call()  apply()   bind()

1.call()  第一可以调用函数  第二可以改变函数内的this指向。

   call() 的主要作用可以实现继承

语法：var o  = { name :  'andy'}

           function fn(a,b){console.log(this); console.log(a + b)};

            fn.call(o , 1 ,2);

语法2 function Father(uname, age, sex){ this.uname = uname}

          function Son (uname){ Father.call(this,uname);}

          var son = new Son(' 张三 ');

           console.log(son);

2.apply()

（1）也是调用函数 第二个可以改变函数内部的this指向

（2）但是它的参数必需是数组（伪数组）

（3）主要应用 比如说可以利用apply 借助于数学内置对象求最大值Math.max();

语法： var arr = [ 1,22,34,66];

var max = Math.max.apply(Math.arr);

console.log(max);

3.bind() 绑定 捆绑的意思

（1） 不会调用原来的函数  可以改变原来函数内部的this指向

（2） 返回的是原函数改变this之后产生的新函数

（3）如果有的函数我们不需要调用，但是又想改变这个函数内部的this指向此时用bind

（4）我们有一个按钮，当我们点击之后，就禁用了这个按钮，3秒钟之后开启这个按钮

语法：

<button>按钮</button>

    <button>按钮</button>

    <button>按钮</button>

    <script>

        var btn = document.querySelectorAll('button');

        for (var i = 0; i < btn.length; i++) {

            btn[i].onclick = function() {

                this.disabled = true;

                setInterval(function() {

                    this.disabled = false;

                }.bind(this), 3000);

            }

        }

    </script>

四、call和apply以及bind总结

相同点：都可以改变 this 指向

不同点：

call 和 apply  会调用函数 , 并且改变函数内部 this 指向

call 传递参数使用逗号隔开传递 ,apply 传递参数使用数组传递

bind  不会调用函数

应用场景 :

call 经常做继承

apply 经常跟数组有关系 .  比如借助于数学对象实现数组最大值最小值

bind  不调用函数 , 但是还想改变 this 指向 . 比如改变定时器内部的 this 指向