zoukankan      html  css  js  c++  java
  • js_面向对象设计和行为委托设计模式

    最近换了新工作,面试过程中有多多少少的问题没有给的出答案,为自己的技术短板而促急。

    javascript中万物皆对象(键:值构成的一种数据),暂且不讨论这个句话的对与错,可以想象对象在javascript中的重要性,而面向对象的设计模式更是走向高级前段开发的必须要技能。


    创建对象的三种方式

    字面量创建对象

    1 //1.创建一个空对象
    2 var obj = {};
    3 
    4 //2.obj对象添加属性
    5 obj.name = 'obj';
    6 //3.obj对象添加方法
    7 obj.toString = function(str){
    8     return str;
    9 }

    new + 构造函数创建对象

     1 //1.创建Base构造函数
     2 function Base(){
     3     console.log(888)
     4 }
     5 
     6 //2.使用new+Base()创建obj对象
     7 var obj = new Base();
     8 /*new具体做了下面三件事情
     9 var obj = {};
    10 obj.__proto__ = Base.prototype;
    11 Base.call(obj);
    12 return obj;
    13 第一行, 我们创建了一个空对象obj
    14 第二行, 我们将这个空对象的__proto__成员指向了Base函数对象prototype成员对象
    15 第三行, 我们将Base函数对象的this指针替换成obj, 然后再调用Base函数, 于是我们就给obj
    16 对象赋值了一个id成员变量, 这个成员变量的值是” base”, 关于call函数的用法。
    17 第四行,返回新的对象。
    18 * */
    19 
    20 //3.给obj对象添加原型方法,注意这里不是obj.prototype,而是Base.prototype。
    21 Base.prototype.toString = function(){
    22     return this.id;
    23 }
    24 
    25 console.log(obj);

    行为委托模式创建对象(Object.create())

     1 //1.创建一个行为对象foo
     2 foo = {
     3     init: function(who) {
     4         console.log(9999)
     5     },
     6     indentify: function() {
     7         console.log(8888)
     8     }
     9 };
    10 //2.bar行为对象继承foo行为对象(把foo行为对象委托给bar行为对象)
    11 bar = Object.create(foo);
    12 
    13 //3.b1和b2继承bar行为对象(把bar行为对象委托给b1和b2行为对象)
    14 var b1 = Object.create(bar);
    15 var b2 = Object.create(bar);
    16 
    17 
    18 //上面的行为委托都是通过原型链的形式进行委托。
    19 console.log(foo);
    20 console.log(bar);
    21 console.log(b1);
  • 相关阅读:
    屏蔽指定IP访问网站
    如何辨别一个网站是否是基于织梦搭建
    PC端访问移动站跳转PC站
    点击/swt/直接跳转商务通(1)
    页面加入视频
    dedecms教程:搜索页显示条数更改
    青蛙走迷宫问题(体力值)
    计算n的阶乘(n!)末尾0的个数
    Leetcode27--->Remove Element(移除数组中给定元素)
    Leetcode26--->Remove Duplicates from Sorted Array(从排序数组中移除相同的元素)
  • 原文地址:https://www.cnblogs.com/wush-1215/p/9238663.html
Copyright © 2011-2022 走看看