js的call和apply

最新推荐文章于 2024-05-18 06:08:29 发布

doublesXu

最新推荐文章于 2024-05-18 06:08:29 发布

阅读量159

点赞数

分类专栏： JavaScript 文章标签： JavaScript call apply

本文链接：https://blog.csdn.net/xyr0709/article/details/98208610

版权

JavaScript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>call和apply</title>
	<script>
		//定义一个对象，包含属性和方法
		var stu={
			name:'tom',
			age:21,
			study:function(){
				console.log('我叫'+this.name+',正在学习....');
			}
		}
		// stu.study();

		//定义一个函数
		function show(){
			console.log('welcome to itany');
		}
		// show();

		/**
		 * 如果stu也想调用show()函数，怎么办？
		 */
		//方式1：为stu添加show方法，永久拥有
		// stu.show=show; //将show属性指向show()函数
		// stu.show();
		//方式2：只想临时调用
		// window.show();
		// show.call(stu);
		// show.apply(stu); //stu对象临时调用show()函数

		//this的转变
		function show2(){
			console.log(this);
		}
		// show2(); //直接调用，this表示window
		// show2.call(stu); //对象临时调用，this表示调用的对象，即stu
		// show2.apply(stu);


		/**
		 * call和apply
		 * 作用：调用一个对象的方法，但是是以另一个对象来调用
		 * 区别：功能完全相同，只是传参方式有所不同
		 * 		1.第一个参数相同，都是指向某个对象，由该对象来调用方法
		 * 		2.后面的参数不同
		 * 			call是逐个传参，后面参数可以有多个，逗号隔开
		 * 			apply是以数组形式传参，后面参数只能有一个
		 */
		 function add(num1,num2){
		 	console.log(num1+num2);
		 }
		 // add.call(stu,3,8);
		 // add.apply(stu,[3,8]);
  		

  		/**
  		 * 应用场景
  		 */
  		//实例1
  		var obj={
  			name:'tom',
  			age:22
  		}
  		/*var arr=new Array();
  		arr[0]=12;
  		arr[1]='alice';
  		arr['sex']='male';*/
  		// console.log(typeof Array);	//function
  		// console.log(Array.prototype); //js中函数也是对象，函数名是对Function对象的引用
  		/*obj.sex='male';
  		Array.prototype.push.call(obj,'aaa');
  		Array.prototype.push.call(obj,'bbb');
  		console.log(obj);*/

  		//实例2：用来判断对象的类型
  		var data=12;
  		// var data=[12,4,34];
  		// var data;
  		// var data=null;
  		// var data=true;
  		// console.log(typeof data);
  		// console.log(data.constructor.name);
  		// console.log(Object.prototype); //toString()方法是定义在Object.prototype中的，用来判断值的类型
  		var str=Object.prototype.toString.call(data);
  		// console.log(str); //[object 类型]
  		if(Object.prototype.toString.call(data)==='[object Array]'){
  			console.log('这是一个数组');	
  		}
  		//注意：要与普通对象的toString()方法区分开，作用：将一个值转换为字符串形式
  		// console.log(data.toString());

  		//实例3：继承，通过call之后，extend可以继承到base的属性和方法
  		function parent(){
  			this.name='tom',
  			this.age=25;
  			this.play=function(){
  				console.log(this.name+',正在玩。。。。');
  			}
  		}
  		function child(){
  			parent.call(this);
  			this.sex='female',
  			this.show=function(){
  				console.log(this.name+','+this.age+','+this.sex);
  			}
  		}
  		var c=new child();
  		c.play();
  		c.show();
	</script>
</head>
<body>
	
</body>
</html>