javascript中call(),apply()用法
//上下文模式:根据用户传递的参数产生不同的结果
//实现方式:call/apply:这两个都是定义在Function.prototype.call——>目的:任何函数都可以访问到call/apply
//call方法的第一个参数表示(本次调用该函数,)函数内部的this的值
function fn(){
console.log(this.name);//张三
}
fn();//函数调用模式——>this指向window window自带一个name属性:""
fn.call({name:"张三"});
var o={};
fn.call(o);//本次调用,fn函数内部的this的值指向o对象
//——>打印结果:undefined(一个对象中访问不到某个属性的时候,值就是undefined) function foo(){
console.log(this.name);
return [1,3,5];
}
foo();//函数调用模式——>foo函数内部的this指向window,返回值由return决定
//window.name——>""
var f1=foo.call({name:"张三"});//上下文调用模式——>foo函数内部this指向传递的参数
//this.name——>"张三"
console.log(f1.__proto__);//返回值由return语句决定
//——>Array.prototype
var f2=new foo();//构造函数调用模式——>foo函数内部this指向构造函数的实例
//——>this.name:undefined
console.log(f2.__proto__);//——>Array.prototype
function fn(){
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]);
}
}
//利用call方法来调用fn函数的时候,如果需要传递实参,将实参作为call方法的的第二个参数开始依次传递
fn.call(null,1,3,5);//call方法的第二个参数是fn方法的第一个实参,第三个参数是fn方法的第二个实参
fn.apply(null,[1,3,5]);//apply方法的第二个参数是一个数组对象,这个数组中第一个元素是fn的第一个实参,数组的第二个元素是fn的第二个实参。。。
//fn.apply(函数内部的this的值,[实参1,实参2。。。实参n])
//面试题:call/apply方法有什么异同?
//1、相同点:a、他们都是Function.prototype对象中定义的方法
// b、第一个参数都是表示函数内部的this的值
//2、不同点:如果需要给函数传递参数的时候,利用call方法,将函数的参数从第二个参数开始依次排开
// 利用apply方法,apply方法的第二个参数是一个数组对象,数组的第一个参数表示函数的第一个实参,依次以此类推 //数组里面的push方法实现的功能:往数组里面添加一个元素
var arr=[1,3,5];//{0:1,1:3,2:5,length:3}
arr.push(10);//{0:1,1:3,2:5,3:10,length:4}
//伪数组
var o={0:10,length:1};
// o[1]=20;
// o.length++;
// o[2]=30;
// o.length++;
// o[3]=50;
// o.length++;
//借用数组的push方法:首先需要访问到push方法
//使用场景1、借用数组的push方法往伪数组里面添加元素
[].push.call(o,10,30,50,70,80,100);
[].push.apply(o,[10,30,50,70,80,100]);
//使用场景2:借用数组的push方法往数组中添加多个元素(这多个元素在一个数组中)
var arr1=[1,3,5];
var arr2=[10,20,30];
//要将arr2中的元素依次添加到arr1中
// for (var i = 0; i < arr2.length; i++) {
// arr1.push(arr2[i]);
// }
//[].push.call(arr1,arr2);//——>往arr1中添加一个元素,该元素是一个数组
[].push.apply(arr1,arr2);//——>往arr1中添加了多个元素
//——>push方法内部通过隐式迭代的方式添加多个元素 /借用构造函数实现继承:需要2个构造函数
function Person(name,age){
this.name=name;
this.age=age;
}
// function Student(name,age,number){
// this.name=name;
// this.age=age;
// this.number=number;
// }
function Student(name,age,number){
//借用构造函数实现继承
Person.call(this,name,age);
this.number=number;
}
var s1=new Student("张三",20,666);
//借用构造函数实现继承:子类构造函数(Student)借用父类构造函数(Person)来完成:给子类的实例添加属性
//注意条件:由于要借用父类构造函数,所以父类构造函数的功能要对子类对象通用
javascript中call(),apply()用法的更多相关文章
- javascript中call,apply,bind的用法对比分析
这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们. 关于call,apply,bind这三个函数的用法,是学习java ...
- JavaScript中this的用法 及 如何改变this的指向
要懂得JavaScript中this的用法,首先需要知道,JavaScript中的作用域相关知识. var fun = function(){ var flag = 1; console.log(fl ...
- 从函数调用的角度,探讨JavaScript中this的用法
js函数调用方式大概可分为:函数调用,构造器调用,call或apply,方法调用四种方式.下面结合一些基础概念和实测代码,从函数调用的角度,探讨JavaScript中this的用法. 1. new对函 ...
- JavaScript中return的用法详解
JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 t ...
- javascript中 try catch用法
javascript中 try catch用法 投稿:hebedich 字体:[增加 减小] 类型:转载 时间:2015-08-16我要评论 JS try catch语句一般在什么情况下使用?是必须使 ...
- JavaScript中this的用法详解
JavaScript中this的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 thi ...
- 在HTML页面中实时获取新消息的方法 “JavaScript中的setInterval用法”
JavaScript中的setInterval用法(资料来源:博主---八神吻你 ) setInterval动作的作用是在播放动画的时,每隔一定时间就调用函数,方法或对象.可以使用本动作更新来自数 ...
- javascript中的继承用法
本文实例汇总了javascript关于继承的用法,希望本文所述对大家的javascript程序设计有所帮助.分享给大家供大家参考.具体如下:代码如下: /** * 实现子类继承父类,但不会产生多余的属 ...
- javascript中的apply,call,bind详解
apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. Jav ...
随机推荐
- jmeter uniq 取值方式设置
- 《JAVA设计模式》之工厂方法模式 (Factory)
在阎宏博士的<JAVA与模式>一书中开头是这样描述工厂方法模式的: 工厂方法模式是类的创建模式,又叫做虚拟构造子(Virtual Constructor)模式或者多态性工厂(Polymor ...
- Linux-第一篇linux基本认识
1.在Linux世界中,一切皆是文件,Linux文件采用级层式的树状目录结构,在此结构中根目录是“/”. 一般linux系统的目录结构如下 目录结构说明 目录 说明 bin 存放二进制可执行文件(ls ...
- elementUI 导航栏点击之后改变背景色,背景色悬停
一开始设置的是: .menuLeft .el-menu-item:hover{ background: #6db6ff !important; } .menuLeft .el-submenu__tit ...
- 安装weblogic界面安装
如果中间有任何问题请联系作者:291562721 界面安装weblogic首先 需要工具: 链接:https://pan.baidu.com/s/1x3uYxsnycjT2Xi2TOTbDdQ 提取码 ...
- k3 cloud成本调整单提示期末余额不存在调整单分录的维度,请先出库核算确认是否存在核算维度的数据
成本调整单提示期末余额不存在调整单分录的维度,请先出库核算确认是否存在核算维度的数据,如下图所示: 解决办法:先做出库核算,然后做成本调整单,再做出库核算(出库成本核算)
- rpmgraph - 显示 RPM 软件包依赖关系图
SYNOPSIS rpmgraph PACKAGE_FILE ... DESCRIPTION rpmgraph 使用 PACKAGE_FILE 参数来产生一个软件包依赖关系图.每个 PACKAGE_F ...
- C语言文件读写操作
C语言实现文件读写,注意区分几个方法: 写入: fwrite() //个人认为这个最好,可是实现写入任何数据类型,任何长度 fputs() //写入一个字符串,字符串长度不能太长,具体的长度未知,但估 ...
- Sass函数:random()函数
random() 函数是用来获取一个随机数 >> random() 0.03886 >> random() 0.66527 >> random() 0.8125 & ...
- 固定内网ip的方法
ip最后一位找一个不常用的,比如200之后的,ping不通它就用它. 子网掩码,默认网关保持和原来的一样. DNS要填公司的,网上查的不能用,因为他们是互联网上的.主备:XXXXXX/XX (之前填的 ...