//javascript高级话题
console.log("hello world!");
//一.常用js类定义的方法有哪些
//1. 构造方法定义类
function Person(){
this.name = "fan bb";
}
Person.prototype.sayName = function () {
//alert(this.name);
console.log(this.name);
}
var person = new Person();
person.sayName();
//2.对象方法定义类
var Person = {
name:"li bb",
sayName:function () {
console.log("my name is .." + this.name);
}
}
var person = Object.create(Person);
person.sayName();
//=========================================================================================
console.log("2--------------------------------");
//二、js类继承的方法有哪些
//0) 自己写的继承方法
//构造方法定义类 Animal
function Animal(){
this.name = "animal";
}
//增加Animal 类的原型属性sayName
Animal.prototype.sayName = function(){
console.log(this.name);
}
//构造方法定义类 Person
function Dog(){
//this.name = "personnn";
}
//Person类继承Animal
Dog.prototype = new Animal();
//(1) 原型链法:例子中增加的写法
//Dog.prototype = Animal.prototype;
Dog.prototype.constructor = "Dog" //更新构造函数,构造函数恢复自己的Person
//创建person对象
var dog = new Dog();
dog.sayName();
//------------------------------
//2.属性自制法, 遍历父类的原型属性, 将父类的原型属性 复制到子类这边,并且最后要恢复子类原型属性中的 构造函数属性
function Cat() {
this.name = "this is Cat't Name"
}
(function () {
var n = 0;
for(everyKey in Animal.prototype)
{
Cat.prototype[everyKey] = Animal.prototype[everyKey];
n++;
console.log("is have prototype " + n + everyKey);
}
//只是继承了Animal中的prototype属性。
//name 属性没有被继承
})();
Cat.prototype.constructor = "Cat";
var cat = new Cat();
cat.sayName();
//=========================================================================================
//三、js类 多重继承的实现方式 就是复制所有基类的 prototype属性
//=========================================================================================
console.log("4--------------------------------");
//四、js里的作用域是什么样子的?
//大多数语言的作用域都是{} , js里面不是 , js里面是函数作用域。
var globalVar = 'global var';
(function testGlobalVar() {
console.log(globalVar); //undefine ,因为global在函数内定义了,导致全乎的global失效
var globalVar = "jububianliang";
console.log(globalVar);
})();
//testGlobalVar();
console.log(globalVar);
//=========================================================================================
//五、js里面的this指的是什么?
//this指的是调用对象本身
console.log("5--------------------------------");
function funTestthisObject() {
}
funTestthisObject.prototype.sayName = function () {
console.log(this.name);
}
var funTestthisObj = new funTestthisObject();
funTestthisObj.name = "what's this \"this\"";
funTestthisObj.sayName();
//=========================================================================================
//六、apply call bind
//三者都可把一个函数应用到其他对象上,注意不是自身对象。
//apply call是直接进行调用; apply接受数组做参 call接受多个参数 参数间逗号分隔
//bind 是绑定 ,执行需要再次调用
console.log("6--------------------------------");
//构造函数
function apply_Call_Bind_test()
{
}
apply_Call_Bind_test.prototype.sayName = function () {
console.log("---");
console.log(this.name);
console.log("-");
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
console.log(arguments[3]);
console.log("---");
}
var other_apply_Call_bind_test_obj = {
name : "first usally obj name"
};
var obj_1 = {
name :"obj_1",
age :11
};
var obj_2 = {
name :"obj_2"
};
var obj_3 = {
name :"obj_3"
};
function obj_4(){
this.name = "bij_4";
}
apply_Call_Bind_test.prototype.sayName.apply(other_apply_Call_bind_test_obj,[obj_2,obj_3,obj_1, 1212]);
apply_Call_Bind_test.prototype.sayName.call(other_apply_Call_bind_test_obj,"ning an1","ning an2");
var bind_obj = apply_Call_Bind_test.prototype.sayName.bind(other_apply_Call_bind_test_obj);
bind_obj("fengxiang1", "fengxiang2");
bind_obj(["fengxiang3", "fengxiang4",obj_4]);
//=========================================================================================
console.log("7--------------------------------");
//七、caller,callee和arguments 分别都是什么?
//caller callee 调用者和被调用者
//argument 包含函数所有参数的 参数数组变量
function Caller_callee(par1,par2,par3) {
child(par1,par2,par3);
}
function child(p1, p2, p3) {
console.log(p1);
console.log(arguments);
console.log(child.caller);
console.log(arguments.callee);
}
Caller_callee("callp1","callp2","");
//=========================================================================================
//八、闭包
//=========================================================================================
//九、
//Object.defineProperty(obj,prop,descriptor); 用于给obj对象定义属性
//hasOwnProperty 检查属性是否存在于对象的本身 ,继承来的不算
//isEnumberable 用于检测某一属性是否可以遍历(枚举出来 for(属性 in 对象))
//十、js常用设计模式的实现思路,单例,工厂,代理装饰,观察者模式
console.log("10--------------------------------");
//任意对象都是单例
var singleObj = {
name:"wang wi",
age :99
};
//---------------------
//工厂,就是同样形式参数返回不同的实例
function inStance_one() {
this.name = "the one";
console.log("是否构造了")
}
function inStance_two() {
this.name = "the two";
}
function Factory() {
}
Factory.prototype.getInstance = function (className) {
return eval('new '+ className + '()');
}
var factory = new Factory();
console.log(factory.getInstance("inStance_one").name);
console.log(factory.getInstance("inStance_two").name);
//---------------------
//代理:就是新建个类 调用老类的接口,包一下、
function old_Obj(){}
old_Obj.prototype.sayName = function () {
console.log("Micha");
}
old_Obj.prototype.sayAge = function () {
console.log(300);
}
function old_Obj_proxy(functionName) {
//代理类属性 增加老类的实例,这样就能调用老类的接口了
this.old_o = new old_Obj();
//传递this
var that = this;
this.callMethod = function(functionName){
console.log('before proxy:', functionName);
//新类调用老类的接口
that.old_o[functionName]();
console.log('after proxy:', functionName);
}
}
var pp = new old_Obj_proxy();
pp.callMethod('sayName');
pp.callMethod('sayAge');
//---------------------
//观察者:就是事件模式,比如按钮的onclick这样的应用
console.log("观察者模式,把一个对象(信息), 通知给其他对象");
//构造方法 定义发布者类
function Publisher(){
//增加一个监听属性,用来压入想要压入对象的集合
this.listeners = [];
}
Publisher.prototype = {
//增加监听方法
'addListener':function(listener){
//其实先前可以加入判断,如果该对象未被监听则压入
this.listeners.push(listener);
},
//增加删除监听方法
'removeListener':function (listener) {
delete this.listeners[listener];
},
//增加通知方法
'notify':function(obj){
for(var i = 0; i < this.listeners.length; i++)
{
var listener = this.listeners[i];
if (typeof listener != "undefined") {
//发一个对象给所有监听者
listener.process(obj);
}
}
}
};
//构造方法定义 订阅者(监听者)类
function Subscriber() {
}
Subscriber.prototype = {
'process':function(obj){
console.log(obj);
}
};
var publisher = new Publisher();
publisher.addListener(new Subscriber());
publisher.addListener(new Subscriber());
publisher.notify({name: "huaha", age:16});
publisher.notify("nimabn");
javascript高级(定义类、继承、this、argument、观察者)
猜你喜欢
转载自blog.csdn.net/baidu_19552787/article/details/87632398
今日推荐
周排行