this

解析器（浏览器）在调用函数时每次都会向函数内部传递进一个隐含的参数

1、this的定义

function fun(){
  //console.log("a=" +a+",b="+b);
  console.log(this.name);
}
fun();//输出object.window

//创建一个对象
var obj = {
  name:"孙悟空",
  sayName:fun
};

var obj2 = {
  name:"沙和尚",
  sayName:fun
};

//console.log(obj.sayName == fun);//输出true

var name = "全局的name属性"
obj.sayName();//输出object.object   [name:"孙悟空",sayName:fun]
//以函数形式调用,this时window
fun();
//以方法的形式调用，this是调用方法的对象
obj.sayName();
obj2.sayName();

2、this补充

//创建一个name变量
var name = "全局";

//创建一个fun()函数
function fun(){
  console.log(this.name);
}

//创建两个对象
var obj = {
  name:"孙悟空",
  sayName:fun
};

var obj2 = {
  name:"沙和尚",
  sayName:fun
};

//调用obj.sayName()时输出obj的名字
obj.sayName();//输出 孙悟空
obj2.sayName();//输出 沙和尚

对象

1、使用工厂方法创建对象

可以使用该方法大批量创建对象

使用工厂方法创建的对象使用的构造函数都是Object

所以创建的对象都是Object类型，导致无法区分出多种不同类型的对象

function createPerson(name,age,gender){
  //创建一个新的对象
  var obj = new Object();
  //向对象中添加属性
  obj.name = name;
  obj.age = age;
  obj.gender = gender;
  obj.sayName = function(){
    alert(this.name);
  }
  
  //将新的对象返回
  return obj;
}
var obj2 = createPerson("猪八戒",18,"男");
var obj3 = createPerson("白骨精",17,"女");
var obj4 = createPerson("蜘蛛精",16,"女");

console.log(obj2);
console.log(obj3);
console.log(obj4);
obj2.sayName();

2、构造函数

构造函数的执行流程：

使用同一个构造函数创建的对象，称为一类对象，也将构造函数称为一个类

使用instanceof可以检查一个对象是否是一个类的实例

语法： 对象 instanceof 构造函数

//创建一个构造函数，专门用来创建Person对象
var per = new Person();
function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
  this.sayNmae = function(){
    alert(this.name);
  };
}

var per = new Person("孙悟空",18，"男")
var per = new Person("玉兔精",17，"女")

console.log(per);

console.log(per instanceof Person);

this的情况：

3、构造函数修改

在Person构造函数中，为每一个对象都添加了一个sayName方法

//创建一个Person构造函数
function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
  //向对象中添加一个方法
  this.sayName = function(){
    alert("Hello大家好，我是："+this.name);
  };
}
//创建一个Person的实例
var per = new Person("孙悟空",18,"男");
var per = new Person("猪八戒",19,"男");

per.sayName();

• 方法是在构造函数内部创建的，构造函数每执行一次就会创建一个新的sayName方法， 也就是所有实例的sayName都是唯一的
• 会导致构造函数每执行一次就会创建一个新的方法

可以将将sayName方法在全局作用域中定义（尽量不要将函数定义在全局作用域）

//创建一个Person构造函数
function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
  //向对象中添加一个方法
  this.sayName = fun;
  };
}
//将sayName方法在全局作用域中定义
function fun(){
    alert("Hello大家好，我是："+this.name);
//创建一个Person的实例
var per = new Person("孙悟空",18,"男");
var per = new Person("猪八戒",19,"男");

per.sayName();

4、原型对象

原型 prototype

创建的每一个函数，解析器都会向函数中添加一个属性prototype

function MyClass(){
  
}

//向MyClass的原型中添加属性a
MyClass.prototype.a = 123;

//向MyClass的原型中添加一个方法
MyClass.prototype.sayHello = function(){
  alert("hello");
};

var mc = new MyClass();

console.log(MyClass.prototype);
console.log(mc.__proto__ == MyClass.prototype);//输出true
console.log(mc.a);//输出123
//向mc中添加a属性
mc.a = "我是mc中的a";
console.log(mc.a);//输出 我是mc中的a

mc.sayHello();//输出 弹窗hello

创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中

这样不用分别为每一个对象添加，就可以使每个对象都具有这些属性和方法，也不会影响到全局作用域

例：

//创建一个Person构造函数
function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
  //向中添加一个方法
  // this.sayName = fun;
  };
}
//向原型中添加sayName方法
Person.prototype.sayName = function(){
    alert("Hello大家好，我是："+this.name);
//创建一个Person的实例
var per = new Person("孙悟空",18,"男");
var per = new Person("猪八戒",19,"男");

per.sayName(); // 输出弹窗

补充：

//创建一个构造函数
function MyClass(){
  
}
//向MyClass的原型中添加一个name属性
MyClass.prototype.name = "我是原型中的name";

var mc = new MyClass();
console.log(mc.name);
//使用in检查对象中是否含有某个属性时，如果对象中没有单数原型中有，也会返回true
console.log("name" in mc); //输出 true
//可以使用对象的hasOwnProperty()来检查对象自身是否含有该属性
//使用该方法只有当对象自身含有该属性时才会返回true
console.log(mc.hasOwnProperty("name"));//返回false
console.log(mc.hasOwnProperty("hasOwnProperty"));//返回false
console.log(mc.__protp__.hasOwnProperty("hasOwnProperty"));//输出false
console.log(mc.__proto__.__proto__.hasOwnProperty("hasOwnProperty"));//输出true

5、toString

function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
}

//修改Person原型中的toString
Person.prototype.toString = function(){
  return "Person[name="+this.name+",age="+this.age+",gender="+this.gender+"]"
};

//创建一个Person实例
var per = new Person("孙悟空",18,"男");
var per2 = new Person("猪八戒",28,"男");

//console.log(per);
//console.log(per.toString);//与上面相同
/*输出Person[name=孙悟空,age=18,gender=男]
per.toString = function(){
  return "Person[name="+this.name",age="+this.age",gender="+this.gender"]"
}; */

var result = per.toString();
//console.log("result = "+result);
//console.log(per.__pro__.__pro__.hasOwnProperty("toString"));//返回true

console.log(per);
console.log(per2);

6、垃圾回收（GC）

1. 当一个对象没有任何的变量或者属性对它进行引用时，将永远无法操作该对象，此时这种对象就是一个垃圾
2. 这种对象过多会占用大量的内存空间，导致程序运行过慢，所以这种垃圾必须进行清理

//创建一个对象
var obj = new Object();
//对对象进行各种操作。。。。
obj = null;

{nextPage/}

内建对象

对象的类型：内建对象、宿主对象、自定义对象

一、数组

1、数组（Array）的简介

//创建数组对象
var arr = new Array();
//使用typeof检查一个数组时，会返回Object
console.log(typeof arr);
//向数组中添加元素
arr[0] = 10;
arr[1] = 33;
arr[2] = 22;
arr[3] = 25;
//arr[10] = 21;
//arr[100] = 210;
//console.log(arr[3]);//输出undefined
//获取数组的长度
console.log(arr.length);
console.log(arr);

//修改length
/* 如果修改的length大于原长度，则会空出多出的元素
如果修改的length小于原长度，则会删除多出的元素
*/
//arr[10] = 21;
arr[2] = 22;

//向数组的最后一个位置添加元素
arr[arr.length] = 20;

console.log(arr.length);
console.log(arr);

2、数组字面量

使用字面量来创建数组，语法：[]

//var arr = new Array();
/* 无意义
arr[0] = 123;
arr.hello = "abc";
console.log(arr.hello);
*/
//使用字面量来创建数组
//var arr = [];
var arr = [1,2,3,4,5,6,10];

console.log(arr[1]);
console.log(arr.length);

var arr = new Array(10,20,30);
console.log(arr2);

//创建一个数组中只有一个元素10
arr = [10];

//创建一个长度为10的数组
arr2 = new Array(10);

console.log(arr[0]);
console.log(arr2);

//数组中的元素可以是任意的数据类型
arr = [10,"hello",true,null,undefined];

var obj = {name:"孙悟空"};
arr[arr.length] = obj;
arr = [{name:"孙悟空"},{name:"沙和尚"},{name:"猪八戒"}]
console.log(arr[1].name);

arr = [function()
,function({alert(2)})];
//console.log(arr);
arr[0]();

//数组中可以放数组，如下这种数组称为二维数组
arr = [[1,2,3],[3,4,5],[5,6,7]];
console.log(arr[1]);

3、数组的方法

（1） push() ：

语法： 数组.push(参数一,参数二,参数N);

可以向数组的末尾添加一个或多个元素，并返回数组新的长度

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];
var result = arr.push("唐僧","蜘蛛精","白骨精");

console.log(arr);
console.log("result = "+result);

（2） pop() :

语法： 数组.pop();

该方法可以删除啊数组的最后一个元素，并将被删除的元素作为返回值返回，删除几次就写几次

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];
var result = arr.push("唐僧","蜘蛛精","白骨精","玉兔精");

arr.pop();
arr.pop();
console.log(arr);
console.log("result = "+result);

（3） unshift()

语法： 数组.unshift(参数一,参数二，参数N);

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];
var result = arr.push("唐僧","蜘蛛精","白骨精","玉兔精");

arr.unshift("牛魔王","二郎神");
console.log(arr);
console.log("result = "+result);

（4） shift()

语法： 数组.shift();

可以删除数组的第一个元素，并将被删除的元素作为返回值返回,要删除几个就写几个

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];
var result = arr.push("唐僧","蜘蛛精","白骨精","玉兔精");

arr.shift();
console.log(arr);

result = arr.shift();
console.log("result = "+result);

（5） slice()

语法： 数组.slice(参数一,参数二);

可以从已有的数组中返回选定的元素

参数：

1. 截取开始的位置的索引，包含开始索引
2. 截取结束的位置的索引，不包含结束索引

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚","唐僧","玉兔精"];

var result = arr.slice(0,2);
console.log(result);

（6） splice()

语法： 数组.splice(参数一,参数二,参数三,参数N);

可以用于删除数组中的指定元素，并向数组中添加新的元素

参数：

1. 第一个：开始的位置的索引
2. 第二个：删除的数量
3. 第三个及以后的参数可以传递一些新的元素，这些元素将会自动插入到开始位置的索引前面

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚","唐僧","玉兔精"];

var result = arr.splice(1,0,"牛魔王","红孩儿");
console.log(result);

（7）数组去重练习

//创建一个数组
var arr = [1,2,3,2,1,3,4,2,5];
//去除数组中重复的数字

解法：

//创建一个数组
var arr = [1,2,3,2,2,1,3,4,2,5];
//去除数组中重复的数字
//获取数组中的每一个函数
for(var i=0; i<arr.lenth; i++){
  //console.log(arr[i]);
  for(var j=i+1; j<arr.lenth; j++){
    //console.log(arr[j]);
    //判断两个元素的值是否相等
    if(arr[i] == arr[j]){
      //如果相等则证明出现了重复的元素，删除j对应的元素
      arr.splice(j,1);
      //当删除了当前j所在的元素以后，后面的元素会自动补位
      //此时将不会再比较这个元素，需要再比较一次j所在位置的元素
      //当删除一个元素后，使j自减
      j--;
    }
  }
} 

console.log(arr);

（8） concat()

语法： 数组.concat();

连接两个或多个数组，并将新的数组返回

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];
var arr2 = ["白骨精","玉兔精","蜘蛛精"];
var arr2 = ["二郎神","太乙真人","太上老君"];

var result = arr.concat(arr2,arr3,"牛魔王");

console.log(result);

（9） join()

语法： 数组.join("连接符");

该方法可以将数组转换为一个字符串

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];

var result = arr.join("-");

console.log(typeof result);//输出string
console.log(result);//输出 孙悟空-猪八戒-沙和尚

（10） reverse()

语法： 数组.reverse();

该方法用来反转数组（前边的去后边，后边的去前边）

该方法会直接修改原数组

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚"];

arr.reverse();
console.log(arr);//输出 沙和尚,猪八戒,孙悟空

（11） sort()

语法： 数组.sort();

该方法可以用来对数组中的元素进行排序

该方法会影响原数组，默认会按照Unicode编码进行排序

//创建一个数组
var arr = [5,4,2,1,3,6,8,7];

arr.sort();
console.log(arr);//输出 a,b,d
//arr.reverse();
console.log(arr);//输出 d,b,a

arr.sort(function(a,b){
  // if(a>b){
  //   return 1;
  // }else if(a<b){
  //   return -1;
  // }else{
  //   return 0;
  // }
  //升序排列
  return a - b;
  //降序排列
  return b - a;
});
console.log(arr);

4、数组的遍历

遍历数组：就是将数组中的所有元素都取出来

//创建一个数组
var arr = ["孙悟空","猪八戒","沙和尚","唐僧","玉兔精"];
/*console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
*/
for(var i=0; i<arr.length; i++){
  console.log(arr[i]);
}

5、数组练习

创建一个函数，可以将perArr中的满18岁的Person提取出来，然后封装到一个新的数组中并返回，arr 形参：要提取信息的数组

function Person(name,age,gender){
  this.name = name;
  this.age = age;
}

//修改Person原型中的toString
Person.prototype.toString = function(){
  return "Person[name="+this.name+",age="+this.age+"]"
};
//创建一个Person对象
var per = new Person("孙悟空",18);
var per2 = new Person("猪八戒",28);
var per3 = new Person("红孩儿",8);
var per4 = new Person("蜘蛛精",16);
var per5 = new Person("二郎神",38);

//将这些person对象放入到一个数组中
var perArr = [per,per2,per3,per4,per5];

/*创建一个函数，可以将perArr中的满18岁的Person提取出来，然后封装到一个新的数组中并返回
arr 形参，要提取信息的数组
*/
function getAdult(arr){
  //创建一个新的数组
  var newArr = [];
  
  //遍历arr，获取arr中的Person对象

  //判断Person对象的age是否大于等于18

  //如果大于等于18，则将这个对象添加到newArr中

  //将新的数组返回
  return newArr;
}

var result = getAdult(perArr);
console.log(result);

解法：

//遍历arr，获取arr中的Person对象
for(var i=0; i<arr.length; i++){
  var p = arr[i];
  //判断Person对象的age是否大于等于18
  if(p.age>=18){
    //如果大于等于18，则将这个对象添加到newArr中
    newArr.push(p);
  }
}

6、 forEach()

一般都是使用for循环遍历数组，JS中还提供了一个 forEach() 方法来遍历数组，但是只支持IE8以上浏览器，所以需要兼容IE8尽量不要使用该方法

var arr = ["孙悟空","猪八戒","沙和尚","唐僧","玉兔精"];
arr.forEach(function(value,index,obj){
  console.log("value ="+value);
  console.log("index ="+index);
  console.log("obj ="+obj);
});