博客 / 列表

你好2007 - 理解prototype和__proto__(繼承與原型鏈)

從關係圖中可以看出來,ECMAScript中創建一個對象是通過new構造函數實現的,而本質上來説這個對象其實是以構造函數的屬性prototype指向的對象為基本模板的,因此新對象的__proto__屬性表明了自己來源於誰。 prototype 該屬性用來指向創建一個對象的基本模板,默認指向new構造函數,也可以修改,或者通過改屬性為新對象添加屬性。 需要注意的是,該屬性只有函數才有。 //構造函

prototype , 前端 , Javascript

你好2007 - 關於字符串解析的一點理解 (以解析一段HTML字符串為例)

在分析一段字符串的時候,可以藉助字符串的indexOf等方法,或者是正則表達式,可是,如果需要解析的是下面這段字符串: group arc c-bind:cx='_width*0.5' c-bind:cy='_height*0.5' c-bind:radius1='_min*0.5' radius2='100' deg='120deg' /arc group c-for='

vue-loader , 算法 , webpack , template-engine , 前端

你好2007 - vue 如何實現表單校驗

安裝並使用 首先,在你的vue項目中進行安裝: npm install --save vue-input-check 接着根據不同的vue版本註冊: vue2.js import Vue from 'vue'; Vue.use(inputCheck); vue3.js+ import { createApp } from 'vue'; let app = createApp(App); app

vue.js , validate , form , submit , Javascript

你好2007 - React 如何添加路由懶加載

主體説明 我們會把流程分成兩步:『配置路由』和『添加懶加載』。 如果你知道路由,或者已經配置好了,可以直接跳轉到『添加懶加載』 配置路由 react有兩個包react-router和react-router-dom,如果只是h5開發,選擇後者即可。 安裝依賴 因此,我們首先安裝好需要的路由包: npm install --save react-router-dom 配置 比如我們有兩個頁面page

react , lazyload , jsx , route , 前端

你好2007 - v-solt 插槽(基礎使用、具名插槽、作用域插槽等)

基本使用 組件通過slot預留位置,使用組件的時候,可以通過傳遞具體的內容去替換slot佔用的地方,這就是插槽。 比如現在定義了一個組件: !-- simple-use.vue -- template div slot/slot /div /template 組件slot/slot佔用的位置具體內容不確定,需要使用的時候傳遞進來,我們就可以這樣使用: simple-use em

vue.js , htm , template.js , 前端 , Javascript

你好2007 - Git版本管理工具常用命令整理和説明

工作區:就是你在電腦裏能看到的目錄。 暫存區:英文叫stage, 或index。一般存放在 ".git目錄下" 下的index文件(.git/index)中,所以我們把暫存區有時也叫作索引(index)。 版本庫:工作區有一個隱藏目錄.git,這個不算工作區,而是Git的版本庫。 第一步:用户名和郵箱。 分別修改用户名和郵箱,其中--global帶和不帶的區別在於操作文件是.git/config還

terminal , Git

你好2007 - input或textarea中關於光標移動問題

什麼是光標 頁面上輸入框中閃爍的光標其實是一個選區,也就是選區的左邊界和右邊界直接形成的選區。 非IE瀏覽器 輸入框結點input=document.getElementById('#input')有二個屬性: selectionStart、selectionEnd,分別代表選區開始位置,選區結束位置。 通過修改這二個值就可以形成選區,寬度為0也就實現了光標的位置控制和獲取。 IE瀏覽器 IE瀏覽

input , textarea , selection , HTML , 前端

你好2007 - Transform + Transitions + Animation

Transform 轉換 一些常用的屬性: transform: none | transform-functions;【通過設置該屬性的值,我們可以對元素使用轉換,具體的屬性值在下面會專門介紹。】 transform-origin: x-axis y-axis z-axis;【設置元素轉換的中心點,最直觀的例子旋轉圖片,改變圖片選擇依賴的旋轉中心。】 transform-style: f

animation , transition , css3 , transform , Css

你好2007 - 關於CSS中設置overflow屬性的值為hidden的相關理解

包裹元素剪裁條件 是不是包裹元素overflow設置為hidden以後,內部元素如果超過包裹元素的話就會被剪裁?答案是不一定,這要看此刻的CSS環境。 根據對CSS2.1規範的理解,可以這樣表述:如果一個元素的包含塊的overflow屬性設置為hidden,那麼超過這個包含塊部分的內容就會被剪裁。 因此我們需要學會尋找一個元素的包含塊,不過在這之前,讓我們先簡單的知道如果一個元素的overflow

overflow , bfc , hidden , Css

你好2007 - Symbol + Generator函數 + Promise

一:Symbol 1.1 基本使用 簡單的説,Symbol就是一個絕對唯一的key值,類似之前obj['key']='value'這種操作的字符串'key',好處是絕對不會重複,避免覆蓋之前的值。 Symbol是一個方法,會返回一個唯一的symbol,可以帶參數,比如:var sy=Symbol('sy-name'),不過這只是為了方便查看,加不加目前沒有區別。 var sy1=Symbol(),

ecmascript-6 , promise , symbol , generator , Javascript

你好2007 - 從vue-loader開始理解webpack的一些設計思想

寫在前面 為了更好的説明,我們模仿Vue.js開發了一個類似的簡化版本的前端框架Quick Paper(文檔) 來幫助你理解一些細節。因此在開始之前,讓我們先大致瞭解一下此項目的結構,方便後續描述。 温馨提示:我們推薦你在開始之前去Github上把此項目clone下來後,對照着源碼進行學習! 目錄結構 其實你只需要關注下面四個文件夾: src:框架源碼; loader:類似vue-loade

vue-loader , vue.js , loader , webpack , Javascript