原创 gulp 靜態資源打包 壓縮 合併

/*! * gulp * $ cnpm install gulp-rev gulp-rev-replace gulp-useref gulp-filter gulp-uglify gulp-csso --save-dev *

原创 閉包的理解(精簡)

一:閉包的含義: 1)在一個對象(函數)中的函數,引用了這個對象中的變量,這就叫閉包; 2)在一個對象(函數)中的函數的子函數,引用了這個對象中的變量,這也叫閉包; 3)在一個對象(函數)外的函數,引用了這個對象(函數)內的

原创 reactjs性能優化之shouldComponentUpdate

性能優化 每當開發者選擇將react用在真實項目中時都會先問一個問題:使用react是否會讓項目速度更快,更靈活,更容易維護。此外每次狀態數據發生改變時都會進行重新渲染界面的處理做法會不會造成性能瓶頸?而在react內部則是通過使

原创 js cookie 編碼解碼登錄成功返回原頁面

1.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <b

原创 jquery animate step 實現 transform css3方法

利用jquery animate step 實現 translate(), rotate(), scale(), skew(),等開發方法 animate()方法有個step參數規定動畫執行的每一步都要執行step這個回調函數。

原创 JS事件中防抖debounce和節流throttle以及requestAnimationFrame

瀏覽器的一些事件,如:resize,scroll,keydown,keyup,keypress,mousemove等。這些事件觸發頻率太過頻繁,綁定在這些事件上的回調函數會不停的被調用。這樣瀏覽器的目的是爲了保證信息的一致性,而對於我們來

原创 ES6總結--Proxy、Reflect

Proxy 攔截器 Proxy,見名知意,其功能非常類似於設計模式中的代理模式,該模式常用於三個方面: 攔截和監視外部對對象的訪問 降低函數或類的複雜度 在複雜操作前對操作進行校驗或對所需資源進行管理 在支持 Proxy 的瀏覽器環境

原创 web前端開發中的安全性問題

跨站腳本攻擊(XSS攻擊) 惡意攻擊者往Web頁面裏注入惡意Script代碼,用戶瀏覽這些網頁時,就會執行其中的惡意代碼,可對用戶進行盜取cookie信息、會話劫持等各種攻擊. 解決方案: 1. 輸入過濾,輸入符合預期的格式的數據,

原创 js百度地圖marker與swiper輪播圖聯動

項目需求,安卓、ios引入webview地圖內容與輪播聯動,效果與百度題圖wabapp效果相同,調用自己數據,地圖裏面放座標,地圖下部放輪播,並且單擊maker座標時候輪播圖滑到相應位置,滑動輪播圖,相應座標彈出信息 <!DOCTYPE

原创 ES6總結--Promise 、Generator 、Async/Await

1、Promise 開篇首先設想一個日常開發常常會遇到的需求:在多個接口異步請求數據,然後利用這些數據來進行一系列的操作。一般會這樣去寫: $.ajax({ url: '......', success: function

原创 js數組應用

1.找出元素 item 在給定數組 arr 中的位置 解: function indexOf(arr, item) { if(Array.prototype.indexOf){ return arr.index

原创 vue2.0 頁面在華爲自帶瀏覽器裏無法打開。

因爲華爲手機內置的瀏覽器內核版本太低! 解決方案1: npm install --save -dev babel-polyfill 在你的主入口文件app.js中import 'babel-polyfill'即可 解決方案2: 也就是使

原创 ES6總結--Symbol、Set 和 Map 、Iterator、Class

1、Symbol Symbol 值通過Symbol函數生成,表示獨一無二的值,可用於對象的屬性名,以保證不會與其他屬性名產生衝突。 Symbol函數前不能使用new命令,否則會報錯。這是因爲生成的 Symbol 是一個原始類型的值,不是

原创 ES6總結--數據類型的擴展

1、字符串 常用方法 includes():返回布爾值,表示是否找到了參數字符串。 startsWith():返回布爾值,表示參數字符串是否在源字符串的頭部。 endsWith():返回布爾值,表示參數字符串是否在源字符串的尾部。 這三個

原创 Formatting Context與佈局

BOX 概念:CSS佈局的基本單位 解釋:BOX是CSS佈局的基本單位,元素的類型和dispaly屬性,決定了這個元素的的BOX類型,BOX的類型分爲: 【block-level box】 display屬性值爲:block、lis