JavaScript學習筆記(五)js技巧
阿新 • • 發佈:2019-04-27
操作 soft on() 作用域 類型 ont rgs and height
1. 安全的類型檢測
Object.prototype.toString.call(value) // ‘[object Array]‘
2.作用域安全的構造函數
function Person(name) { if (this instanceof Person) { this.name = name } else { return new Person(name) } }
繼承
function Polygon(sides) { if (this instanceof Polygon) { this.sides = sidesthis.getArea = function() { return 0 } } else { return new Polygon(sides) } } function Rectangle(width, height) { Polygon.call(this, 2) //這裏只是簡單用Polygon給this添加一些屬性而已的操作 this.width = width this.height = height this.getArea = function() { return this.width * this.height } } Rectangle.prototype = new Polygon() // 指定原型會使instanceof代碼生效
3. 惰性載入函數
(1)第一次調用時覆蓋原函數
function createXHR() { if (typeof XMLHttpRequest !== ‘undefined‘) { createXHR = function() { return new XMLHttpRequest() } } else if (typeof ActiveXObject !== ‘undefined‘) {return new ActiveXObject(‘Microsoft.XMLHTTP‘) } else { createXHR = function() { throw new Error(‘No XHR object available‘) } } }
(2)使用立即執行函數直接給指定函數
const createXHR = (function() { if (typeof XMLHttpRequest !== undefined) { return function() { return new XMLHttpRequest() } } else if (typeof ActiveXObject !== ‘undefined‘) { return function() { return new ActiveXObject(‘Microsoft.XMLHTTP‘) } } else { return function() { throw new Error(‘No XHR object available‘) } } })()
4. 函數綁定
var handler = { msg: ‘Event handled‘, handleClick: function(event) { console.log(this.msg, event.type) } } var btn = document.getElementById(‘my-btn‘) window.addEventListener(btn, ‘click‘, handler.handleClick.bind(handler))
5. 函數柯裏化
(1)未指定上下文
function curry (fn) { var args = Array.prototype.slice.call(arguments, 1) return function() { var innerArgs = Array.prototype.slice.call(arguments) var finalArgs = args.concat(innerArgs) return fn.apply(null, finalArgs) } } function add(num1, num2) { return num1 + num2 } var curriedAdd = curry(add, 5) console.log(curriedAdd(3))
(2)指定上下文
function curry (fn, context) { var args = Array.prototype.slice.call(arguments, 2) return function() { var innerArgs = Array.prototype.slice.call(arguments) var finalArgs = args.concat(innerArgs) return fn.apply(context, finalArgs) } } function add(num1, num2) { return num1 + num2 } var curriedAdd = curry(add,this, 5) console.log(curriedAdd(3))
JavaScript學習筆記(五)js技巧