亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

Javascript 設(shè)計模式 應(yīng)用級講解

chengtao1633 / 3042人閱讀

摘要：繼承關(guān)鍵字傳給父類執(zhí)行實際應(yīng)用就是提取公共部分，復(fù)用代碼。關(guān)于封裝，完全開發(fā)對子類開放對自己開放，目前還不支持。

首先npm init一路回車 新建webpack.dev.config.js，修改package.json文件，安裝webpack-dev-server可以幫助你在代碼發(fā)生變化后自動編譯代碼

修改package.json文件

 "scripts": {
    "dev": "webpack-dev-server --config ./webpack.dev.config.js --mode development"
  },

webpack.dev.config.js

const path = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")

module.exports = {
    entry: "./src/index.js",
    output: {
        path: __dirname,
        filename: "./release/bundle.js"  // release 會自動創(chuàng)建
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: "./index.html"  // bundle.js 會自動注入
        })
    ],
    devServer: {
        contentBase: path.join(__dirname, "./release"),  // 根目錄
        open: true,  // 自動打開瀏覽器
        port: 9000,   // 端口
        proxy: {
            "/api/*": {
                target: "http://localhost:8880"
            }
        }
    },
    module: {
        rules: [{
            test: /.js?$/,
            exclude: /(node_modules)/,
            loader: "babel-loader"
        }]
    }
}

package.json 依據(jù)上面的方式，安裝以下依賴

{
  "name": "es6",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "webpack-dev-server --config ./webpack.dev.config.js --mode development"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.4",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-polyfill": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-latest": "^6.24.1",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.8.3",
    "webpack-cli": "^2.1.3",
    "webpack-dev-server": "^3.1.4"
  },
  "dependencies": {
    "javascript-state-machine": "^3.0.1",
    "jquery": "^3.3.1"
  }
}

面向?qū)ο笕兀悍庋b、多態(tài)、繼承，子類繼承父類，封裝對數(shù)據(jù)的權(quán)限和保密，多態(tài)，同一個接口不同的實現(xiàn)，不從事后臺開發(fā)很難真正理解這幾個概念。
class People {
    constructor(name, age) {
        this.name = name
        this.age = age
    }
    eat() {
        alert(`${this.name} eat something`)
    }
    speak() {
        alert(`My name is ${this.name}, age ${this.age}`)
    }
}

class Student extends People {     //繼承關(guān)鍵字extends
    constructor(name, age, number) {
        super(name, age)  //super 傳給父類執(zhí)行
        this.number = number
    }
    study() {
        alert(`${this.name} study`)
    }
}

let xiaoming = new Student("xiaoming", 10, "A1")
xiaoming.study()
console.log(xiaoming.number)
let xiaohong = new Student("xiaohong", 11, "A2")
xiaohong.study()

實際應(yīng)用就是提取公共部分，復(fù)用代碼。

關(guān)于封裝，public完全開發(fā)、protected對子類開放、private對自己開放，目前es6還不支持。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/96988.html

相關(guān)文章

  • 面試寶典

    摘要：有談?wù)劽嬖嚺c面試題對于前端面試的一些看法。動態(tài)規(guī)劃算法的思想及實現(xiàn)方法幫大家理清動態(tài)規(guī)劃的解決思路以及原理方法前端經(jīng)典面試題從輸入到頁面加載發(fā)生了什么這是一篇開發(fā)的科普類文章，涉及到優(yōu)化等多個方面。極客學院前端練習題道練習題，面試季練練手。 由數(shù)據(jù)綁定和排序引入的幾個 JavaScript 知識點 在 JavaScript 的數(shù)據(jù)綁定和做簡單的表格排序中遇到的幾個知識點 [[JS 基礎(chǔ)...

    neu 評論0 收藏0

  • 深入講解js中的位運算及實際用法

    摘要：雖然在內(nèi)部，數(shù)值都是以位浮點數(shù)的形式儲存，但是做位運算的時候，是以位帶符號的整數(shù)進行運算的，并且返回值也是一個位帶符號的整數(shù)。如下表應(yīng)用場景取整對于一般的整數(shù)，返回值不會有任何變化。例如，結(jié)果為負數(shù)存儲采用的形式是二進制補碼。 什么是位運算？ 位運算是在數(shù)字底層（即表示數(shù)字的 32 個數(shù)位）進行運算的。由于位運算是低級的運算操作，所以速度往往也是最快的（相對其它運算如加減乘除來說），并...

    jifei 評論0 收藏0

  • JavaScript中的閉包

    摘要：閉包引起的內(nèi)存泄漏總結(jié)從理論的角度將由于作用域鏈的特性中所有函數(shù)都是閉包但是從應(yīng)用的角度來說只有當函數(shù)以返回值返回或者當函數(shù)以參數(shù)形式使用或者當函數(shù)中自由變量在函數(shù)外被引用時才能成為明確意義上的閉包。 文章同步到github js的閉包概念幾乎是任何面試官都會問的問題,最近把閉包這塊的概念梳理了一下,記錄成以下文章。 什么是閉包 我先列出一些官方及經(jīng)典書籍等書中給出的概念,這些概念雖然...

    HmyBmny 評論0 收藏0

  • JavaScript 事件詳解

    摘要：事件監(jiān)聽函數(shù)標準的事件監(jiān)聽函數(shù)如下上面的示例表示先獲得表示節(jié)點的對象，然后在這個對象上面添加了一個事件監(jiān)聽器，當監(jiān)聽到事件發(fā)生時，則調(diào)用回調(diào)函數(shù)，即在控制臺輸出。 JavaScript 事件解讀 1. 事件基本概念 事件是指在文檔或者瀏覽器中發(fā)生的一些特定交互瞬間，比如打開某一個網(wǎng)頁，瀏覽器加載完成后會觸發(fā) load 事件，當鼠標懸浮于某一個元素上時會觸發(fā) hover 事件，當鼠標點擊...

    Object 評論0 收藏0

  • 雙十二大前端工程師讀書清單

    摘要：本文最早為雙十一而作，原標題雙大前端工程師讀書清單，以付費的形式發(fā)布在上。發(fā)布完本次預(yù)告后，捕捉到了一個友善的吐槽讀書清單也要收費。這本書便從的異步編程講起，幫助我們設(shè)計快速響應(yīng)的網(wǎng)絡(luò)應(yīng)用，而非簡單的頁面。 本文最早為雙十一而作，原標題雙 11 大前端工程師讀書清單，以付費的形式發(fā)布在 GitChat 上。發(fā)布之后在讀者圈群聊中和讀者進行了深入的交流，現(xiàn)免費分享到這里，不足之處歡迎指教...

    happen 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<