代理模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>代理模式</title> </head> <body> <script> // 先申明一个奶茶妹对象 var TeaAndMilkGirl = function (name) { this.name = name; }; // 这是京东ceo先生 var Ceo = function (girl) { this.girl = girl; // 送结婚礼物 给奶茶妹 this.sendMarriageRing = function (ring) { console.log("Hi " + this.girl.name + ", ceo送你一个礼物：" + ring); } }; // 京东ceo的经纪人是代理，来代替送 var ProxyObj = function (girl) { this.girl = girl; // 经纪人代理送礼物给奶茶妹 this.sendGift = function (gift) { // 代理模式负责本体对象实例化 (new Ceo(this.girl)).sendMarriageRing(gift); } }; // 初始化 var proxy = new ProxyObj(new TeaAndMilkGirl("奶茶妹")); proxy.sendGift("结婚戒"); // Hi 奶茶妹, ceo送你一个礼物：结婚戒 </script> </body> </html>
使用代理模式预加载图片
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>使用代理模式加载图片</title> </head> <body> <script> var myImage = (function () { var imgNode = document.createElement("img"); document.body.appendChild(imgNode); return { setSrc: function (src) { imgNode.src = src; } } })(); // 代理模式 var ProxyImage = (function () { var img = new Image(); img.onload = function () { myImage.setSrc(this.src); }; return { setSrc: function (src) { myImage.setSrc("http://img.lanrentuku.com/img/allimg/1212/5-121204193Q9-50.gif"); img.src = src; } } })(); // 调用方式 ProxyImage.setSrc("https://img.alicdn.com/tps/i4/TB1b_neLXXXXXcoXFXXc8PZ9XXX-130-200.png"); </script> </body> </html>
冒泡排序算法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <script> function bubbleSort(arr) { for (var i = 0; i < arr.length; i++) { for (var j = arr.length - 1; j > i; j--) { if (arr[j] < arr[j - 1]) { var temp = arr[j] arr[j] = arr[j - 1] arr[j - 1] = temp } } } return arr } var arr = [32, 55, 66, 77, 18, 20] console.log(bubbleSort(arr)) //[18, 20, 32, 55, 66, 77] </script> </body> </html>
删除数组中的undefine和null
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>删除数组中的null和undefined</title> </head> <body> <script> function clearNullArr(arr){ for(var i=0; i<arr.length; i++){ if(!arr[i]||arr[i]==''||arr[i]===undefined){ arr.splice(i, 1); arr.length--; i-- } } return arr } var geyao=["","2","3","5",undefined,null,undefined] console.log(clearNullArr(geyao))//["2","3","5"] </script> </body> </html>
删除数组的制定下标元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>删除数组的指定下标元素</title> </head> <body> <script> Array.prototype.del=function(index){ if(isNaN(index)||index>=this.length){ return false; } for(var i=0,n=0;i<this.length;i++){ if(this[i]!=this[index]){ this[n++]=this[i]; } } this.length-=1; return this }; var geyao=["1","2","3"] console.log(geyao.del(1))//["1","3"] </script> </body> </html>
前端this指向问题解决方案apply
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>前端this指向问题普通函数apply</title> </head> <body> <script> //口诀 谁调用就会指向谁 这边是普通函数 直接报错this.fang is not a function var name="geyao" var fangfang = { name : "fangfang", fang: function () { console.log(this.name) }, fun: function () { setTimeout( function () { this.fang() }.apply(this,fangfang),100); } }; fangfang.fun()//fang </script> </body> </html>
