美文网首页
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创建对象和实现继承的方式

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