javaScript中的匿名函数和闭包(第3篇)

最新推荐文章于 2024-08-25 19:13:29 发布
程宇寒
最新推荐文章于 2024-08-25 19:13:29 发布
阅读量163
点赞数
文章标签： javaScript 函数变量 js 匿名函数
本文链接：https://blog.csdn.net/czh500/article/details/100162328
版权
javaScript中的匿名函数和闭包(第3篇)

javaScript中的匿名函数和闭包(第1篇)
javaScript中的匿名函数和闭包(第2篇)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javaScript中的匿名函数和闭包(第3篇)</title>
<script type="text/javascript">
	//块级作用域(即私有作用域)，javascript中没有块级作用域，其他语言是有的
	
	function f1(){
		for (var i = 0; i < 3; i++) {//块级作用域(js中没有这个东西)
			console.log('i = ' + i);
		}
		//出for循环，还是可以访问到i变量
			console.log(i);
	}
	
	//
	f1();
	
	function f2(){
		for (var i = 0; i < 2; i++) {//块级作用域(js中没有这个东西)
			console.log('i的值为' + i);
		}
		//就算重新声明，也不会影响之前声明初始化的数据
			var i;
			console.log(i);
	}
	
	//
	f2();
	
	function f3(){
		for (var i = 0; i < 3; i++) {//块级作用域(js中没有这个东西)
			console.log('i的值=' + i);
		}
			var i;
			console.log(i);
			i = 3789;
			console.log(i);
			var i = 66;
			console.log(i);
			i = 88;
			console.log(i);
	}
	
	//
	f3();
	
	/*
		块级作用域(私有作用域)的好处就是
		  防止命名冲突，变量之间相互污染就不存在了
	*/
	//使用块级作用域(即私有作用域)
	function f4() {
		(function() {//包含在自我执行的匿名函数中，就可以实现块级作用域(私有作用域)
			for (var i = 0; i < 3; i++) {
				console.log('****** i = ' + i);
			}
		//如果在这里定义了变量a,b,c
		})();//出了这个私有作用域，变量立即被销毁
		//出了自执行匿名函数,变量a,b,c就会被销毁
		//这里可以继续定义a,b,c变量，和上面的a,b,c变量完全没有联系和冲突
		
		//这里已经访问不到i变量了
// 		console.log(i); //报错i is not defined
		var i = 80;
		console.log(80);
	}

	//
	f4();
	
	//
	var age = 20;
	console.log(age);
	age = null; //销毁掉age变量,每次都要写=null;这句话手动销毁，很繁琐
	console.log(age);
	
	//私有作用域来表示全局
	(function() { //一打开网页，自执行函数就会执行
	//这里就是全局的私有作用域(防止了变量被污染)
		var address = '===江西省赣州市于都县===';//一打开网页，自执行函数就会执行,address这个私有变量此时就相当于全局变量
		console.log(address);
	})();//出了自执行函数，address变量就会自动销毁，所以不需要像上面的案例一样，每次都手动写=null这句话来手动销毁变量
	
	//出了自执行函数，address变量就会自动销毁
// 		console.log(address); //报错address is not defined

	//私有变量
	function f5() {
		var hometown = '江西省于都县'; //私有变量，外部无法访问
	}
	
	//
	function Message(){
		this.hometown = '中国江西省于都县******'; //属性，公有的
		this.run = function (){ //方法，公有的
			return '运行中.........';
		}
	}
	
	var message = new Message();
	console.log(message.hometown);
	console.log(message.run());
	
	//
	function Message2(){
		var hometown = '中国江西省于都县========='; //私有变量
		function run(){ //私有函数
			return '运行中=======';
		}
	}
	
	var message2 = new Message2();
	//访问不到私有的
// 	console.log(message2.hometown); //undefined
// 	console.log(message2.run()); //message2.run is not a function

	//
	function Message3(){
		var hometown = '******China江西省于都县******'; //私有变量
		function run(){ //私有函数
			return '******运行中******';
		}
		this.publicFun = function (){ //对外可见的公共接口(即特权方法)
			return hometown + run();
		};
		this.getHometown = function (){
			return hometown;
		};
	}
	
	var message3 = new Message3();
	//
	console.log(message3.publicFun());
	console.log(message3.getHometown());
	
	//通过构造函数传参
	function Person(value){
		var userName = value; //私有变量
		this.getUserName = function (){
			return userName; 
		};
	}
	
	var Person1 = new Person('令狐冲');
	console.log(Person1.getUserName());
	
	var Person2 = new Person('韦小宝');
	console.log(Person2.getUserName());
	
	console.log(Person1.getUserName());
	
	//
	function Dog(value){
		var userName = value; //私有变量
		this.getUserName = function (){
			return userName; 
		};
		this.setUserName = function (userNameValue){
			userName = userNameValue;
		};
	}
	
	var dog = new Dog('张无忌');
	console.log(dog.getUserName());
	dog.setUserName('杨过');
	console.log(dog.getUserName());
	
	
	//
	(function (){
		var userName = '郭靖'; //私有变量
// 		function Cat(){console.log('哈哈哈');}//构造函数，但在函数里写构造函数，不支持，因为私有作用域里的函数，外部无法访问

//没有使用var关键字声明的变量是全局变量
// 		Cat  = function (){
// 			console.log('哈哈哈');
// };

//没有使用var关键字声明的变量是全局变量
		Cat = function (value){
			userName = value;
			console.log('this = ' + this);
			this.getUserName = function (){
				return userName; 
			};
		};
	})();	//全局，构造函数
	
	
// 	var cat = new Cat(); //报错Cat is not defined
	
// 	var cat = new Cat();

	var cat = new Cat('建宁公主');
	console.log(cat.getUserName());
	
	var cat2 = new Cat('双儿');
	console.log(cat.getUserName());
	
	var cat3 = new Cat('曾柔');
	console.log(cat.getUserName());
	
	
	//
	(function (){
		var userName = ''; //私有变量
// 		function Cat(){console.log('哈哈哈');}//构造函数，但在函数里写构造函数，不支持，因为私有作用域里的函数，外部无法访问
//没有使用var关键字声明的变量是全局变量
		Pig = function (value){//全局，构造函数
			userName = value;
			console.log('this是' + this);
		};
		//使用了prototype导致方法共享了，而userName也就变成静态属性了(所谓静态属性，即共享于不同对象中的属性)
		Pig.prototype.getUserName = function (){//原型方法
			return userName;
		};
		Pig.prototype.setUserName = function (val){
			userName = val;
		};
	})();	
	
	var pig = new Pig('沐剑屏'); //第1次实例化
	console.log(pig.getUserName());
	
	var pig2 = new Pig('方怡'); //第2次实例化
	console.log(pig.getUserName());
	
	pig2.setUserName('阿珂');
	console.log(pig.getUserName());
	
	//什么叫做单例，就是永远只实例化一次，其实就是字面量对象声明方式
	var v1 = {//第1次实例化，无法第2次实例化，那么就是单例
		user:'任盈盈',
		run:function (){
			return 'run........';
		}
	};
	
	
	//
	var v2 = function (){
		var user = '段誉'; //私有变量
		function run(){//私有函数
			return '运行ing......';
		}
		return {
			publicGo:function (){ //对外公共接口的特权方法
				return user + run();
			}
		};
	}();
	
	console.log(v2.publicGo());
	
	
	//
	var v3 = function (){
		var user = '乔峰'; //私有变量
		function run(){//私有函数
			return '运行ing......';
		}
		var obj = {
			publicGo:function (){ //对外公共接口的特权方法
				return user + run();
			}
		};
		return obj;
	}();
	
	console.log(v3.publicGo());
	
/*
	var v4 = function (){console.log('aaaaaaaaaaa');}();
	var v5 = function (){return 'bbbb';}();
	console.log(v5);
	var v6 = function (){return 'ccc';};
	console.log(v6);
	console.log(v6());
*/
 
 function Sheep(){}
 
 var v7 = function (){
	 var user = '虚竹'; //私有变量
	 function run(){//私有函数
		return '运行ing......';
	}
	 var sheep = new Sheep();

	 sheep.publicGo = function (){
		 return user + run();
	 };

// 	 sheep.prototype.publicGo = function (){
// 		 return user + run();
// 	 }; //报错sheep.prototype is undefined
	 console.log('dddddddddd');
	 return sheep;
 }();
 
//  console.log(v7);
 console.log(v7.publicGo());
	
</script>
</head>
<body>
<h1>javaScript中的匿名函数和闭包(第3篇)</h1>
</body>
</html>