JavaScript把局部變量變成全局變量的方法
首先我們要知道函數(shù)的自調(diào)用
函數(shù)的自調(diào)用——自調(diào)用函數(shù)一次性的函數(shù)——聲明的同時(shí)，直接調(diào)用了例如：
(function () { console.log('函數(shù)');})();
我們會(huì)看到瀏覽器直接打印 函數(shù) 兩個(gè)字
頁(yè)面加載后.這個(gè)自調(diào)用函數(shù)的代碼就執(zhí)行完了
使用形式
(function (形參) { })(實(shí)參);
注意
自調(diào)用構(gòu)造函數(shù)的方式,分號(hào)一定要加上
那么如何把局部變量變成全局變量?把局部變量給window就可以了
(function (win) { var num=10;//局部變量 //js是一門動(dòng)態(tài)類型的語(yǔ)言,對(duì)象沒(méi)有屬性,點(diǎn)了就有了 win.num=num;})(window);console.log(num);
頁(yè)面打印出num了
應(yīng)用案例1——將隨機(jī)數(shù)對(duì)象賦給window
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>title</title> <script> //通過(guò)自調(diào)用函數(shù)產(chǎn)生一個(gè)隨機(jī)數(shù)對(duì)象,在自調(diào)用函數(shù)外面,調(diào)用該隨機(jī)數(shù)對(duì)象方法產(chǎn)生隨機(jī)數(shù) (function (window) { //產(chǎn)生隨機(jī)數(shù)的構(gòu)造函數(shù) function Random() { } //在原型對(duì)象中添加方法 Random.prototype.getRandom = function (min,max) { return Math.floor(Math.random()*(max-min)+min); }; //把Random對(duì)象暴露給頂級(jí)對(duì)象window--->外部可以直接使用這個(gè)對(duì)象 window.Random=Random; })(window); //實(shí)例化隨機(jī)數(shù)對(duì)象 var rm=new Random(); //調(diào)用方法產(chǎn)生隨機(jī)數(shù) console.log(rm.getRandom(0,5)); //全局變量 </script></head><body></body></html>
應(yīng)用案例2——產(chǎn)生隨機(jī)位置小方塊
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <meta > <title>title</title> <style> .map{ width: 800px; height: 600px; background-color: #CCC; position: relative; } </style></head><body><div class='map'></div><script src='http://m.lshqa.cn/bcjs/common.js'></script><script> //產(chǎn)生隨機(jī)數(shù)對(duì)象的 (function (window) { function Random() { } Random.prototype.getRandom=function (min,max) { return Math.floor(Math.random()*(max-min)+min); }; //把局部對(duì)象暴露給window頂級(jí)對(duì)象,就成了全局的對(duì)象 window.Random=new Random(); })(window);//自調(diào)用構(gòu)造函數(shù)的方式,分號(hào)一定要加上 //產(chǎn)生小方塊對(duì)象 (function (window) { //console.log(Random.getRandom(0,5)); //選擇器的方式來(lái)獲取元素對(duì)象 var map=document.querySelector('.map'); //食物的構(gòu)造函數(shù) function Food(width,height,color) { this.width=width||20;//默認(rèn)的小方塊的寬 this.height=height||20;//默認(rèn)的小方塊的高 //橫坐標(biāo),縱坐標(biāo) this.x=0;//橫坐標(biāo)隨機(jī)產(chǎn)生的 this.y=0;//縱坐標(biāo)隨機(jī)產(chǎn)生的 this.color=color;//小方塊的背景顏色 this.element=document.createElement('div');//小方塊的元素 } //初始化小方塊的顯示的效果及位置---顯示地圖上 Food.prototype.init=function (map) { //設(shè)置小方塊的樣式 var div=this.element; div.style.position='absolute';//脫離文檔流 div.style.width=this.width+'px'; div.style.height=this.height+'px'; div.style.backgroundColor=this.color; //把小方塊加到map地圖中 map.appendChild(div); this.render(map); }; //產(chǎn)生隨機(jī)位置 Food.prototype.render=function (map) { //隨機(jī)產(chǎn)生橫縱坐標(biāo) var x=Random.getRandom(0,map.offsetWidth/this.width)*this.width; var y=Random.getRandom(0,map.offsetHeight/this.height)*this.height; this.x=x; this.y=y; var div=this.element; div.style.left=this.x+'px'; div.style.top=this.y+'px'; }; //實(shí)例化對(duì)象 var fd=new Food(20,20,'green'); fd.init(map); console.log(fd.x+'===='+fd.y); })(window); // function refresh(){ // window.location.reload(); // } // setTimeout(refresh(), 1000);</script></body></html>
到此這篇關(guān)于JavaScript把局部變量變成全局變量的方法的文章就介紹到這了,更多相關(guān)JavaScript 局部變量變成全局變量?jī)?nèi)容請(qǐng)搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！
相關(guān)文章：
1. Spring security 自定義過(guò)濾器實(shí)現(xiàn)Json參數(shù)傳遞并兼容表單參數(shù)(實(shí)例代碼)2. Java8內(nèi)存模型PermGen Metaspace實(shí)例解析3. python tkinter實(shí)現(xiàn)下載進(jìn)度條及抖音視頻去水印原理4. 一文搞懂 parseInt()函數(shù)異常行為5. 聊聊python在linux下與windows下導(dǎo)入模塊的區(qū)別說(shuō)明6. python學(xué)習(xí)之plot函數(shù)的使用教程7. python 實(shí)現(xiàn)"神經(jīng)衰弱"翻牌游戲8. ASP.NET MVC使用正則表達(dá)式驗(yàn)證手機(jī)號(hào)碼9. Python基于百度AI實(shí)現(xiàn)抓取表情包10. python中用Scrapy實(shí)現(xiàn)定時(shí)爬蟲(chóng)的實(shí)例講解
網(wǎng)公網(wǎng)安備