js基于对象编程-----new一个构造函数时的四步走

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/enjoy_sun_moon/article/details/83511241

 // 1.函数内部建立一个私有域,悄悄的建立一个局部变量,是空对象{}
// 2.函数将自己的上下文设置成这个空对象{},也就是将函数中的this表示这个空对象
// 3.函数执行所有语句
// 4.所有的有语句执行完毕后,函数返回这个对象,也就是将自己的this返回
//return 会打断构造函数的执行,如果返回的是基本类型(int,string,float,null)的话会忽略返回的内容 还是返回this,

//每个函数都有一个prototype属性,这个prototype不用定义,只要函数写出来就自动有这个属性,这个属性对函数本身没有任何意义。

每个构造函数的prototype属性都指向一个对象,当这个构造函数被new时,它的每个实例化对象的__proto__属性也指向这个对象

 自治

<script type="text/javascript" src="underscore.js"></script>
<script type="text/javascript">
function Girl(){
	this.x 		= 0;
	this.status = 0;//1,2,3,4,5,6,7
	this.isMove = true;
	this.speed 	=  _.random(1,10);
	this.dom 	= document.createElement("div");
	this.isMove = true;
	document.body.appendChild(this.dom);
	var self = this;
	self.dom.onclick = function(){
		if(self.isMove){
			clearInterval(self.timer);
			self.isMove = false;
		}else{
			self.move()
			self.isMove = true;
		}
		
	}
	self.move()
}
Girl.prototype.move = function(){
	var self = this;
	self.timer = setInterval(function(){
		self.x  += self.speed;
		self.status++;
		if(self.status > 7){
			self.status = 0;
		}
		self.dom.style.backgroundPosition = -108 * self.status + "px -232px";
		self.dom.style.left = self.x + "px";
		//反应咋dom上
	},200)
}
new Girl()
new Girl()
new Girl()
new Girl()
new Girl()
</script>

猜你喜欢

转载自blog.csdn.net/enjoy_sun_moon/article/details/83511241
今日推荐