論js閉包的重要性


很久沒寫博客了,今天發現了一個很有意思的問題,寫下來分享一下

話不多說,貼前端代碼:

<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
	$(function(){
		$("#btnky").bind('click',function(){
			 //發送給服務端
			 var postMoney=getMoney();
			 alert("發送給后台:"+postMoney);
			 $.post("to_json.html",{postMoney:postMoney},function(data){
				 alert(data);
			 });
		});
	})
	function getMoney(){
			return 1; 
	}
</script>
</head>
<body>
<input type="button" value="發送后台" id="btnky">
</body>

 前端一個很簡單的ajax提交代碼,對不對?通過getMoney()函數 得到一個值,然后發送給后台,注意,該函數是不包含在$()代碼塊里面的

 后台代碼:

 也是很簡單的,只是響應用戶的發送數據,代碼如下:

@RequestMapping("/to_json.html")
@ResponseBody
public String to_Json(@RequestParam("postMoney") int postMoney){
	System.out.println("前端發送的錢:"+postMoney);
	return "你給服務端發送的money是:"+postMoney;
}

OK,萬事具備,頁面走起!!

頁面點擊發送

看后台:

 

貌似沒錯,后台如願得到我們要的數據

只是,如果有些搗蛋鬼喜歡搗蛋呢?比如我用火狐的firefox注入一個getMoney()方法

好吧,我注入了一個和頁面上相同的函數getMoney(),居然返回100000.太壞了..

OK,讓我們在點擊發送后台按鈕,看看是什么情況呢?

天吶.......居然真給變了...

好吧,再看看我們的服務端,是不是也會隨波逐流呢?

我已經無語了,這別個搗蛋鬼豈不是能隨便傳送數據...

不然,如果頁面修改一下呢?代碼如下:

<script type="text/javascript">
	$(function(){
		$("#btnky").bind('click',function(){
			 //發送給服務端
			 var postMoney=getMoney();
			 alert("發送給后台:"+postMoney);
			 $.post("to_json.html",{postMoney:postMoney},function(data){
				 alert(data);
			 });
		});
		function getMoney(){
			return 1; 
		}
	})
	
</script>
</head>
<body>
<input type="button" value="發送后台" id="btnky">
</body>

 

注意,這次我的getMoney()函數寫在$()這個里面去了

OK,我們在刷新頁面,做相同的操作,注入一個getMoney

很奇怪呢,居然沒有變化,不放心,再看看后台:

也沒有變化,是不是很有意思呢?

呵呵,各位有什么看法呢?暢所欲言哦


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM