五. js的代码模块,面向对象

1.代码模块

示例:main.ljs

//返回的数utils中的module.exports
//第一次执行,加在utils.js文件,执行代码后返回module.exports
//如果不是第一次则直接返回module.exports
var utils = require("./utils");

var num = utils.random_int(10, 20);
console.log(num);
console.log(utils.arr);

utils.js

var utils = {
	random_int : function (start, end) {
		var num = start + (end - start) * Math.random();
		num = Math.floor(num);
		return num;
	},
	arr : [1,2,3,4,5,6]
};

//var num = utils.random_int(10, 20);
//console.log(num);
console.log("load utils");
//添加一条指令,module.exports指向这个对象  可以导出{},[],函数对象
module.exports = utils; // 导出代码模块 只能导一个

2.this

//this
function test_func(name, sex) {
	this.name = name;  //xiaoming.name
	this.sex = sex;	   //xiaoming.sex
}

//this,类似于一个参数一样,显式的传递this
//函数对象.call(示例, 参数)
var xiaoming = {};
test_func.call(xiaoming, "xiaoming", 10);
console.log(xiaoming);

//隐式的传递this
var xiaohong = {
	name : "xiaohong",
	test_func : function() {
		console.log(this);
	}
};
//将xiaohong作为this,传递给了这个 函数  谁调用谁就是this;xxx.test_fun(),xxx为this
xiaohong.test_func();

//强制传递this
var func = function() {
	console.log(this);
}.bind(xiaohong);
func();

func = function() {
	console.log(this);
}
//bind是在原来的对象基础上,产生的一个新的函数对象
func = func.bind(xiaohong);
func();

//优先级  强制 > 显示 > 隐示

//this的作用,面向对象
function person(name, age) {
	this.name = name;
	this.age = age;
}

person.prototype.test_func = function() {
	console.log("person test_func called!!!!!");
	console.log(this);
}
 
var p = new person("xiaoming", 11);
var p2 = new person("xiaotian", 22);

p.test_func();
p2.test_func(); 

//new prototype
//每一个函数对象,都会有一个prototype变量,指向这个对象
var func_temp = function() {
	 console.log("func_tmp###");
};
console.log(func_tmp.prototype);

//prototype为一个表对象,所以可以扩充这个表对象 key:value
func_tmp.prototype.test_func = function() {};
func_tmp.prototype.test_func2 = function() {};

3.面向对象

function Point() {
	this.xpos = 0;
	this.ypos = 0;
}

Point.prototype.set_pos = function (x, y) {
	this.xpos = x;
	this.ypos = y;
}

Point.prototype.get_ypos = function() {
	return this.ypos;
}

var p1 = new Point();
var p2 = new Point();

p1.set_pos(10, 100);
p2.set_pos(22, 88);

console.log(p1.get_ypos());
console.log(p2.get_ypos());

4.继承

//继承
var Person = function() {};
Person.prototype.set_name = function(name) {
	this.name = name;
}
Person.prototype.set_age = function(age) {
	this.age = age;
}

Person.prototype.test_func = function() {
	console.log("person_test_func");
}

var Man = function() {};
var Super = function() {};
Super.prototype = Person.prototype;
Man.prototype = Super.prototype;

Man.prototype.set_sex = function(sex) {
	this.sex = sex;
};

Man.prototype.test_func = function() {
	//Person.prototype.test_func.call(this); 如果想调用基类  只能显示调用
	console.log("man_test_func");
}

var m = new Man();
m.set_name("xiaoming");
m.set_age(10);
m.set_sex(0);
console.log(m);
m.test_func();//就近原则  man_test_func

//class写法
function Class(params) {
	var new_class = function() {};

	//继承基类的方法
	if(params.extend) {
		var Super = function() {};
		Super.prototype = params.extend.prototype;
		new_class.prototype = Super.prototype;
	}
	
	//扩充
	for(var key in params) {
		if(key == "extend") {
			continue;
		}
		new_class.prototype[key] = params[key];
	}

	return new_class;

}

var Student = Class({
	extend: Person,

	set_class: function(class_num) {
		this.class_num = class_num;
	},
	set_grade: function(grade) {
		this.grade = grade;	
	}
});

var s = new Student();
s.set_class(10);
s.set_grade(2);
s.set_age(100);

console.log(s);