美文网首页
JS创建对象和实现继承的方式

JS创建对象和实现继承的方式

作者: Huang_jing | 来源:发表于2019-08-06 17:22 被阅读0次

前端知识点:

一、创建对象的方式

工厂模式、构造函数模式、原型模式、组合使用构造函数模式和原型模式、动态原型模式、寄生构造函数模式、稳妥构造函数模式、

1.工厂模式

function createPerson(name,age,job){

var o = new Object();

o.name = name;

o.age = age;

o.job = job;

o.sayName = function(){

alert(this.name)

}

return o;

}

var person1 = createPerson(‘Hj’,24,‘Teacher’);

2.构造函数模式

function Person(name,age,job){

this.name = name;

this.age = age;

this.job = job;

this.sayName = function(){

alert(this.name)

}

}

var person1 = new Person(‘Hj’,24,‘Teacher’);

3.原型模式

function Person(){ }

Person.prototype = {

constructor: Person,

name:‘Hj’,

age: 24,

job:’Teacher’,

sayName: function(){

alert(this.name)

}

}

组合使用构造函数模式和原型模式(使用最广泛、认同度最高)

function Person(name,age){

this.name = name;

this.age = age;

Person.prototype = {

constructor: Person,

sayName: function(){

alert(this.name)

}

}

4.动态原型模式

function Person(name,age){

this.name = name;

this.age = age;

if  (typeof this.sayName !=“function”){

Person.prototype.sayName = function(){

alert(this.name)

}

}

5.寄生构造函数模式

function Person(name,age,job){

var o = new Object();

o.name = name;

o.age = age;

o.job = job;

o.sayName = function(){

alert(this.name)

}

return o;

}

var person1 = new Person(‘Hj’,24,‘Teacher’);

6.稳妥构造函数模式

function Person(name,age,job){

var o = new Object();

//在这里定义私有变量和函数

o.sayName = function(){

alert(this.name)

}

return o;

}

除了调用sayName()方法外,没有别的方式访问对象的数据

二、继承

原型链、借用构造函数、组合继承、原型式继承、寄生式继承、寄生组合式继承

1.原型链

2.子类原型指向父类的实例对象

SubType.prototype = new SuperType();

3.借用构造函数

function SubType(){

//继承了SuperType

SuperType.call(this);

}

4.组合继承(最常用的继承模式)

function SubType(name,age){

//继承了SuperType属性

SuperType.call(this,name);

this.age = age;

}

//继承方法

SubType.prototype = new SuperType();

SubType.prototype.constructor = subType;

三、函数

1.递归

function factorial(num){

if(num < 1){

return 1;

} else {

return num * arguments.callee(num -1);

}

}

factorial(5)    // 120

2.闭包

闭包是指有权访问另一个函数作用域中的变量的函数。

常用创建方式:在一个函数内部创建另一个函数。

四、BOM浏览器对象模型

window对象

window.open(‘url’,  target属性或窗口名称)

_blank - URL加载到一个新的窗口。这是默认

_parent - URL加载到父框架

_self - URL替换当前页面

_top - URL替换任何可加载的框架集

name-窗口名称

关闭打开的窗口

var newWindow = window.open(‘http://www.baidu.com’);

newWindow.close();

五、DOM操作

选择符API

querySelector() 返回该模式匹配的第一个css选择符元素

querySelectorAll()  返回该模式匹配的所有css选择符元素

相关文章

  • JS创建对象和实现继承的方式

    前端知识点: 一、创建对象的方式 工厂模式、构造函数模式、原型模式、组合使用构造函数模式和原型模式、动态原型模式、...

  • js中的继承-原型与原型链

    面向对象的语言支持两种继承方式,接口继承和实现继承js无法实现接口继承,只支持实现继承,主要通过原型链来实现。具体...

  • JS对象和继承

    JS 对象创建的三种方式 字面量创建方式 系统内置构造函数方式 自定义构造函数 继承方式 for in 继承 原型...

  • JS继承的实现的几种方式

    前言 JS作为面向对象的弱类型语言,继承也是非常强大的特性之一,那么如何在JS实现继承呢? JS继承的实现方式 既...

  • JavaScript 10

    js继承的概念 1.通过原型链方式实现继承(对象间的继承) 2.类式继承(构造函数间的继承) 由于js不像Java...

  • 设计模式

    构造函数模式 利用原型继承的方式创建对象,以实现功能 混合模式 本质上也是利用原型继承的方式创建对象,但更加具象了...

  • 设计模式总结

    使用create方法,实现原型的继承,创建prototype和对象之间的关联关系 体现多态 最常用的原型继承方式 ...

  • JS中继承的实现

    JS中继承的实现 #prototype (js原型(prototype)实现继承) 全局的Function对象没有...

  • call-apply 实现继承

    改变调用对象的两种方式: JS可以通过 call 和 apply 方法来实现继承 call(): ------ ...

  • 创建对象方式和继承

    Object构造函数模式方法:先创建Object对象,再动态添加属性/方法适用场景:起始时不确定对象内部数据缺点:...

网友评论

      本文标题:JS创建对象和实现继承的方式

      本文链接:https://www.haomeiwen.com/subject/lxmwdctx.html