this定义
this是对象
this依靠函数实行的上下文
this存在于函数中（函数挪用的时刻被隐式传入）
直接看例子：
alert(this); //在全局环境挪用this, this指向window, 输出[Object window]
function Person(){
alert(this);
}
体式格局一:
Person(); // 全局环境用Person函数, this指向window, 输出[Object window]
体式格局二:
var obj = new Person(); //把Person当作组织函数, 实例化一个对象
//此时this指向了obj, 不再指向window, 输出[Object object]
function Person(){
alert(this.name); //此时没法推断this的身份
}
Person(); //this在全局环境中被挪用, this.name == window.name, 输出了窗口的名字
var obj = new Person(); //this在obj环境下被挪用, this.name == obj.name, 因为name没被赋值, 所以输出undefined
由此可以看出, 我们在浏览代码或许写代码时，看到某个函数中定义的this时, 还没法去推断谁人this身份，必需找到它依靠实行的环境(对象)。
再回头看看this的定义，人人就清晰天然了。再看constructor和prototype
constructor是一个对象的属性，这个属性存在在此对象的prototype中, 指向此对象的组织函数。剖析这句话
constructor是一个对象属性。
constructor在prototype中
constructor指向组织函数
例子1：
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype.getName = function(){
alert(this.name);
}
Person.prototype.getAge = function(){
alert(this.age);
}
var obj = new Person();
alert(obj.constructor == Person);// true
此种体式格局定义的prototype, constructor是隐蔽的, 默许指向Person
例子2：
function Person(name, age){
this.name = name;
this.age = age;
}
Person.prototype = {
getName: function(){
alert(this.name);
},
getAge: function(){
alert(this.age);
}
}
var obj = new Person();
alert(obj.constructor == Person);// false
为何是false? 这类定义prototype, 是把prototype重写了, 掩盖了默许的constructor。
换句话说, 实在这类体式格局就是给属性从新赋值了, 所以致使默许的constructor被掩盖。
此时的obj.constructor将指向的是Object。
改写一下上面的：
Person.prototype = {
constructor: Person, //强迫指向Person
getName: function(){
alert(this.name);
},
getAge: function(){
alert(this.age);
}
}
此时constructor就指向Person了。
prototype是一个函数属性, 此属性同时也是一个对象, 保存着对象实例所共有的属性和要领。
剖析这句话:
1.prototype是函数属性, 只如果函数, 就有prototype属性. 而不管是组织函数照样一般函数.
2.prototype同时也是对象.
2.prototype放的是大众的东西, 包含属性和要领.
例子1.
function Person(name, age){
this.name = name;
this.age = age;
}
//是函数就有prototype属性, 这个属性也是一个对象
Person.prototype = {
getName: function(){ //一切对象实例都同享
return this.name;
},
getAge: function(){//一切对象实例都同享
return this.age;
}
}
var obj = new Person('tom', 23);
obj.getName(); //'tom'
var obj2 = new Person('jack', 23);
obj2.getName(); //'jack'
obj.getName == obj2.getName; //true, 一切实例同享
Person.prototype.getName(); //当作一般函数属性, 依据this定义, 此时this指向的是Person.prototype, 所以返回undefined
以上就是this, constructor, prototype的定义和他们之间的关联. 能够还有些粗拙, 迎接人人补充.
综合例子:
var Tinker = function(){
this.elements = [];
};
Tinker.fn = Tinker.prototype = {
constructor: Tinker,
extend: function(obj){
var p;
for(p in obj){
this.constructor.prototype[p] = obj[p];//此处若看邃晓了, 那末前面的就理解了
}
}
}
Tinker.fn.extend({
get: function(){
var length = arguments.length,
i = 0;
for(; i < length; i++){
this.elements.push(document.getElementById(arguments[i])); //此处若看邃晓了, 那末前面的就理解了
}
return this;//此处若看邃晓了, 那末前面的就理解了
},
each: function(fn){
var i = 0,
length = this.elements.length;
for(; i < length; i++){
fn.call(this.elements[i], i, this.elements[i]);
}
return this;//此处若看邃晓了, 那末前面的就理解了
}
});
这个例子实在很简单, 就是向一个对象原型增加要领.一个要领是get, 用于查找页面id. 一个是each, 用于对找到的id元素实行一个要领
//假设有id = 'data', id = 'message'
var obj = new Tinker();
obj.get('data', 'message').each(function(i, item){
this.style.cssText = 'height:20px; background:#ff0000';
})