js高级（一）

目录

类和对象的关系

创建对象的7种方法

instanceof 用法

call方法的作用

apply方法的作用

用apply去求最大值和最小值 

利用call方法去继承父类的属性 

 利用原型对象去继承父类的方法

类

定时器

立即执行函数 和严格模式

变量的作用域

遍历从 页面中获取的li

---

视频观看来源：黑马前端js高级（含es6）--pink老师。

两个编程思想：面向对象(OOP)和面对过程。

面向对象的特性：多态性，继承性和封装性。

ES6之前通过构造函数去编程，ES6之后通过类去编程。

类和对象的关系

 一、类：一类事物的抽象；(如：人类、猫类)

​ 二、对象：类里面具体的某个事物；(如：人类中的小明、猫类中的叮当猫)

 三、函数（方法）：对象有很多属性，比如：身高、体重、性别等；而函数是对象的会执行的动作 比如：吃、喝、拉、撒、睡

创建对象的7种方法

• 通过对象字面量来创建
• 

• 通过 new Object() 创建对象

• 通过工厂函数来创建对象
• 

• 通过构造函数来创建对象
• 

原型方式

//用空函数创建一个类
function Obj(){
}
//在类的原型链上添加属性和方法
Obj.prototype.name="xxx";
Obj.prototype.say=function(){
    alert("我是xxx");
}
//生成对象
var obj1=new Obj();

 原型/构造联合方式

.动态原型方式

instanceof 用法

    function f(){}
      console.log(f instanceof Object);  //instanceof 判断前者属不属于后者

instanceof运算符测试构造函数的prototype属性是否出现在对象的原型链中的任何位置。

如果忘记写new关键字了，我们可以用instanceof 运算符来解决。

function Person(name) {
    // 判断this是否指向了当前的实例
    if (this instanceof Person) {
      // this指向了当前的实例，外部使用了关键字new
      this.name = name
    }else {
      // this指向window，外部没有使用关键字new
      return new Person(name)
    }
  }
  var p1 = new Person("咚咚")
  var p2 = new Person("锵锵")
  console.log("p1",p1);
  console.log("p2",p2);

控制台打印：

ES6引入了Class这个概念，作为对象的模板。通过class关键字，可以定义类。

类里面的共有属性和方法，使用时要加this

ES6，全程ECMAScrikpt6.0,2015.06发版，但是目前浏览器的java Script是ES5版本，大多数高版本的浏览器也支持ES6，不过只实现了ES6的部分特性和功能。

在ES6之前，对象不是基于类创建，而是用一种成为构造函数的特殊函数来定义对象和他们的特征。

 

 

构造函数方法很好用，但是存在浪费内存的问题。

 

 

对象原型（_proto_）和构造函数（prototype）原型对象里面都有一个属性constructor属性，这个属性称为构造函数，因为它指回构造函数本身。

call方法的作用

1.可以调用函数

函数.call();

2.可以改变this的指向

函数.call(X);//X为新传的一个对象，此时在运行函数内部时，函数里的this指向X。输出this.name，实际输出的是X对象的name.

//call(X，2,3);call的第一个参数为this的指向，其他参数可以当正常参数来使用

apply方法的作用

apply方法与call()方法相似，都可以改变this的指向，但第二个参数要求是数组。

函数.apply(this指向对象，[ "pink"]);

用apply去求最大值和最小值 

利用call方法去继承父类的属性 

bind(); 

 function haha(){
            console.log(this);
        }
        
        function haha1(a,b){
            console.log(this);
            console.log(a+b);
        }
        var fun = haha1.bind(haha,3,4);
        fun();

call()和apply()写了立刻调用，这样不好放在触发事件中。

 利用原型对象去继承父类的方法

想继承父类的方法，直接把父类的prototype赋给子类的话，会一改全改。

可以用父类new 一个对象，把对象赋值给子类的prototype，最后记得把子类的constructor=子类。

son.prototype = new Father();

类

类的本质其实还是一个函数，我们也可以简单的认为类是构造函数的另一种写法。

1.类有原型对象

2.类原型对象里面有constructor

3.类可以通过原型对象添加方法

4.类的实例对象有_proto_

ES5中新增的方法

迭代遍历方法：forEach(),map(),filter(),some(),every();

array.filter(function(currenrValue,index,arr)),主要用来筛选数组，它会返回一个新数组

 some()查看是否满足条件，返回值是个布尔值

 

定时器

如果没有特殊指向，setInterval和setTimeout的回调函数中this的指向都是window。

函数的定义方式

1.函数声明方式function关键字（命名函数）

function fn(){}

2.函数表达式（匿名函数）

var fun = functiong(){};

3.new Function();

var fun=new Function();

立即执行函数 和严格模式

    (function(){
            'use strict'; //给一个立即函数里添加了严格模式代码
            num = 10;
            alert(num);
        })(); 

严格模式语句需要放在函数最前面，也可以直接放在js代码最前面。

1.不能随便delete删除变量。

2.

高阶函数

函数也是一种数据类型。

函数作参数传进来或者返回值是函数时就是高阶函数。

变量的作用域

闭包

遍历从 页面中获取的li

var ul = document.querySelector(".nv").querySelectorAll("li");
        for(var i=0;i<ul.length;i++)
        {
            ul[i].index = i; 
            ul[i].onclick = function()
            {
                    alert(this.index);
            }
        
        } 

js面试题常考 

(function(i){ //通过立即执行函数的方式加上闭包的方式
				ul[i].onclick = function()
				{
					alert(i);
				}
			})(i);//第二个括号为调用的括号，是可以传递参数的
//这也存在内存泄漏的问题，它一直不点击，i就一直得不到释放

递归

自己调用自己就是递归，递归容易出现栈溢出，记得加上return，给它一个退出条件。

		function hh(n){ //通过递归计算阶乘
			if(n==1)
			{
				return 1;
			}
			return n*hh(n-1);
		};
		console.log(hh(3));

 利用递归实现斐波那契数列，给出位置信息，找出该位置的值，位置信息不包含0。从1—N。

1 1 2 3 5 8 13 21 ,这个数列前两位之和等于第三位。

	function hh(n){ //通过递归计算阶乘
			if(n==1 || n==2)
			{
				return 1;
			}
			return hh(n-2)+hh(n-1);
		};
		console.log(hh(3));