083js学习-this和arguements

参考文章：
参考教程:【尚硅谷】JavaScript基础&实战丨JS入门到精通全套完整版

参考文章:Han_python的博客的JavaScript专栏7.8.11

代码参考链接:Js apply()使用详解

<script type="text/javascript">

    function PutAgeGrage(age, grade) {
        this.age = age;
        this.grade = grade;
    }
    function PutName(name) {
        this.name = name;
    }
    /*定义一个学生类*/
    function Student(name, age, grade, gender) {

        PutName.apply(this, arguments);
        PutAgeGrage.call(this, age, grade);
    }

    //创建一个学生类 
    var stu = new Student("Li", 22, "一年级", "male");
    //测试
    document.write(stu.name + " / " + stu.age + " / " + stu.grade + " / " + stu.gender);

</script>

this,arguements

调用函数时，浏览器每次都会传递这两个隐含参数。

函数的上下文对象this

以函数形式直接调用时,this相当于window;

function han() {
  	console.log(this);      // window
}
han();      

若以变量.方法()的形式调用,this则是指那个变量。

以对象.方法()的形式调用,this则是指那个对象。

function han() {
  	console.log(this);      // object
}
var obj = {
	name: "hanmeng",
	sayName: han;         // 这里,函数对象han是变量obj的属性
};
obj.sayName();

构造函数可以创建自定义的类，那么this是新创建类的对象(或称实例)

构造函数的创建方式和普通函数相同，但需要使用new关键字来调用。在使用new关键字调用构造函数时，构造函数会执行下面的流程：

1.立即创建一个新的对象
2.将新的对象设置为函数中的this，可以使用this来引用新建的对象
3.逐行执行函数中的代码
4.将新建的对象作为返回值返回

 function PutName(name) {
	this.name = name;
    this.sayThis = function () {
        console.log(this);
    }
    this.sayName = function () {
        document.write("PutName2: " + this.name);
    }
}

var p2 = new PutName("LiLiSan");
p2.sayThis()	// PutName类的对象,截图在下
p2.sayName()	// PutName2: LiLiSan

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

console.log(p2 instanceof PutName);		// true

Object类是所有类的基类。

• 工厂方法创建对象，是一种可以大批量创建对象的方法，格式大致如下：

function createobj(name,...){
	var obj = new Object();
	obj.name = name;
	...
	obj.sayName = function(){...};
	return obj;
};
var obj1 = createobj("han",27,"male");

使用call()或者apply()并传入参数调用时，this是指定的那个对象

也就是传入哪个,就是哪个。例子顶头处便是。

封装实参的对象arguments

• 它是一个数组类的对象。
  类数组参考下一篇文章：084js学习-数组类Array

• 它还含有一个callee属性，它代表正在执行的函数对象。
  可以直接打印出来，会显示这个函数。

document.write(arguments.callee)

call()和apply()

功能是,在调用一个函数时,能够显式指定默认参数this。

使用方法：

call()方法可以将实参在对象之后依次传递:fun.call(obj,2,4);

<script>
  function PutAgeGrage(age, grade) {
   	document.write(age + "/" + grade)
  }
  PutAgeGrage.call(this, 18, "一年级");
</script>

apply()方法需要将实参封装在数组中统一传递:fun.apply(obj,[2,3]);

<script>
  function PutAgeGrage(age, grade) {
   document.write(age + "/" + grade)
  }
  PutAgeGrage.apply(this, [18, "一年级"]);   // 这是个Array类的对象
</script>

上面的结果都是一样的,是18/一年级

• 当然,上面那种调用,和直接调用相比,没什么特别作用了。
  直接调用的时候，是这样写得： PutAgeGrage( 18, "一年级");

但是,一开始的样例(top)中写的,就能显出传this入函数的一部分功效。

• 那么，什么时候用apply,什么情况下用call呢？

在给对象参数的情况下,如果参数的形式是数组的时候,比如apply示例里面传递了参数arguments,这个参数是数组类型,并且在调用Person的时候参数的列表是对应一致的(也就是Person和Student的参数列表前两位是一致的) 就可以采用 apply 。
如果我的Person的参数列表是这样的(age,name),而Student的参数列表是(name,age,grade),这样就可以用call来实现了,也就是直接指定参数列表对应值的位置(Person.call(this,age,name,grade));

• apply()可以将一个数组默认的转换为一个参数列表
  即: 将 [param1,param2,param3] 转换为 param1,param2,param3

用法欣赏

• 求最大值
  让Math.max(param1,param2,param3…)接纳数组进行运算。

<script>
	var max = Math.max(3, 2, 4, 6, 5)
    console.log(max)        // 6
    max2 = Math.max.apply(null, [3, 2, 4, 6, 5])
    console.log(max2)		// 6
</script>

同理，Math.min 可求得最小值

• 实现两个数组合并
  Array.prototype.push(param1,param,…paramN)的使用。

<script>
   	var arr1 = new Array("1", "2", "3");
    var arr2 = new Array("4", "5", "6");
    Array.prototype.push.apply(arr1, arr2);
    console.log(arr1)   // ["1", "2", "3", "4", "5", "6"]
</script>

这里，理解为对象arr1调用了push()方法。

构造函数var stu = new Student(...)

function Student(name, age, grade, gender) {
	......
}

//创建一个学生类 
var stu = new Student("Li", 22, "一年级", "male");

参见构造函数可以创建自定义的类

查看原型 prototype

// ...接着top的代码

console.log(stu.__proto__);
console.log(Student.prototype);
console.log(stu.__proto__ == Student.prototype);

每一个函数,都有属性prototype,它指向该函数。该函数称为原型。但是，只有当函数作为构造函数，原型才有意义。(原型本身也是对象,所以可以称为原型对象)
类的对象可以通过属性__proto__来访问它。

原型对象就相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象。所以，我们可以将对象中共有的内容（属性或方法），统一设置到原型对象中。

设置共同的属性/方法

// ...接着上面的代码
Student.prototype.cont = 1;
Student.prototype.SayName = function fun() {
   console.log(this.name)
}

console.log(stu.cont)		// 1
stu.SayName()				// Li

当我们访问对象的一个属性或者方法时，它会现在对象自身中寻找，如果有则直接使用，如果没有则去原型对象中寻找，如果没有，则去原型的原型加粗样式中找，直到找到Object对象的原型。

查看属性或方法,是否在对象中

两种情况:

在对象中,或者原型中 in
仅查看是否在对象中 hasOwnProperty(XXX)

console.log("cont" in stu);			//true
console.log("SayName" in stu);		//true
console.log(stu.hasOwnProperty("cont"));		//false
console.log(stu.__proto__.hasOwnProperty("cont"));	//true

应用: 打印对象,需添加tostring()函数

直接打印对象时，会输出输出[object Object]
它实际上是输出对象的toString()方法的返回值。

如果我们希望打印某对象时不一样，可以为对象添加一个toString()方法。
如果想改变每个对象的打印内容，可以给构造函数添加一个toString()方法。

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

Person.prototype.toString = function () {
    return "我是" + this.name;	
};
var obj = new Person("LiLiSan", 18, "male");
document.write(obj)		// 我是LiLiSan
</script>

如果,一个对象不再用了,只需把它置空null即可。js会自动销毁。