<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//第一个用途:函数上下文模式改变this的指向
var age=19;
function fun() {
console.log(this.age);
} var obj={
age:26
};
fun.apply(obj);
fun.call(obj)
//总结:apply和call,第一个参数功能都是一样,都是可以改变this指向为第一个参数对象。
//当传递对象为null的时候,为window调用 //应用1:将参数用“-”拼接
function fun2() {
//arguments是一个伪装数组,不能调用join方法,通过apply转换替代对象来调用
console.log(Array.prototype.join.apply(arguments, ["-"]));
console.log(Array.prototype.join.call(arguments, "-"));
}
fun2(1,2,3,4); //应用4:借用构造函数实现继承
function Persion() {
this.name="张三";
this.age=18;
}
function Student() {
Persion.apply(this);
}
var stu=new Student();
console.log(stu); //第二个用途:第二个到第N个参数的处理
function fun1(name,work) {
console.log("名字为"+name+";年龄为"+this.age+"职业"+work);
}
var obj1={
age:30
};
/*
* apply和call第二个参数都是函数的参数
* apply是传递的数组,执行的时候是将数组遍历然后作为参数传递。
* call传递的是分开的参数
* */
fun1.apply(obj1,["张三","金融"]);
fun1.call(obj1,"张三","金融"); //应用2:apply的遍历
window.onload=function () {
var divs=document.querySelectorAll("div");
var spans=document.querySelectorAll("span");
var arr=[];
arr.push.apply(arr,divs);
arr.push.apply(arr,spans); for(var i=0;i<arr.length;i++){
arr[i].style.backgroundColor="red";
}
} //应用3:求最大值
var arr1=[3,6,1,78,23];
console.log(Math.max.apply(null, arr1));
</script>
<style>
div,span{
display: inline-block;
width: 50px;
height: 50px;
border: 1px solid pink;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<span></span>
<span></span>
<span></span>
<span></span>
</body>
</html>

js的apply和call的更多相关文章

  1. 原生JS中apply()方法的一个值得注意的用法

    今天在学习vue.js的render时,遇到需要重复构造多个同类型对象的问题,在这里发现原生JS中apply()方法的一个特殊的用法: var ary = Array.apply(null, { &q ...

  2. js中apply方法的使用

    js中apply方法的使用   1.对象的继承,一般的做法是复制:Object.extend prototype.js的实现方式是: Object.extend = function(destinat ...

  3. js中apply,call的用法

    最近一直在用 js 写游戏服务器,我也接触 js 时间不长,大学的时候用 js 做过一个 H3C 的 web的项目,然后在腾讯实习的时候用 js 写过一些奇怪的程序,自己也用 js 写过几个的网站.但 ...

  4. JS之apply,call,bind区别

    为了加深对基础知识的理解,今天再复习下js中的apply,call,bind的区别和用法.整理笔记的过程也是一个再次学习的过程. apply和call js中的调用apply和call方法可以改变某个 ...

  5. js call apply bind简单的理解

    相同点:JS中call与apply方法可以改变某个函数执行的上下文环境,也就是可以改变函数内this的指向.区别:call与apply方法的参数中,第一个参数都是指定的上下文环境或者指定的对象,而ca ...

  6. js的apply()与call()的区别

    1.各自对应的不同的语法: /*apply()方法*/ function.apply(thisObj[, argArray]) /*call()方法*/ function.call(thisObj[, ...

  7. JS中apply和call的区别和用法

    Javascript中有一个call和apply方法,其作用基本相同,但是它们也有略微不同的地方. JS手册中对call方法的解释是: call方法:调用一个对象的一个方法,以另一个对象替换当前对象. ...

  8. js中apply的用法(转)

    之一------(函数的劫持与对象的复制)关于对象的继承,一般的做法是用复制法: Object.extend见protpotype.js 的实现方法: Object.extend = function ...

  9. 关于JS call apply 对象、对象实例、prototype、Constructor、__proto__

    关于call与apply的理解容易让人凌乱,这里有个方法可供参考 tiger.call(fox,arg1,arg2...) tiger.apply(fox,[arg1,arg2...]) 理解为 fo ...

  10. JS中apply与call的用法

    JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别. 先来看看JS手册中对call的解释: call 方法调用一个对象的一个方法,以另一个对象替换当前对象. cal ...

随机推荐

  1. XMLHttpRequest实现Ajax异步请求

    一.XMLHttpRequest的方法 方法 描述 abort()                                                                    ...

  2. getContextPath、getServletPath、getRequestURI,getRealPath的区别

    假定你的web application 项目名称为news,你在浏览器中输入请求路径: http://localhost:8080/news/main/list.jsp 则执行下面向行代码后打印出如下 ...

  3. Introduction to Partial View

    By Jignesh Trivedi on May 14, 2015 http://www.c-sharpcorner.com/UploadFile/ff2f08/partial-view-in-mv ...

  4. 第02章-装配Bean

    1. Spring配置的可选方案 在XML中进行显式配置: 在Java中进行显式配置: 隐式的bean发现机制和自动装配. 2. 自动化装配bean Spring从两个角度来实现自动化装配: 组件扫描 ...

  5. Struts2 校验数据问题

    我们会经常遇到一下问题,例如我在前端输入数据,把数据发送到和后台,我首先要校验这个数据, 比如说:前端必须输入一个日期类型的数据,后端才能正确接收,要是输入一个不是日期型的数据, 那么后端就要把数据打 ...

  6. Alpha冲刺(三)

    Information: 队名:彳艮彳亍团队 组长博客:戳我进入 作业博客:班级博客本次作业的链接 Details: 组员1(组长)柯奇豪 过去两天完成了哪些任务 ssm框架的使用并实现简单的数据处理 ...

  7. [Lua快速了解一下]Lua的语法

    -注释 -- 两个减号是行注释 -块注释 --[[ 这是块注释 这是块注释 --]] -变量 Lua的数字只有double型,64bits, Lua的字符串string支持双引号或者单引号 以下例子会 ...

  8. Android下拉选择框之PopupWindow

    1.效果图 2.思路分析 1.点击弹出对话框 popupwindow 2.对popupwindow进行相关设置,popupwindow中设置view为listview 3.listview中item设 ...

  9. spring的一些配置和重要的接口和类

    spring的配置文件 通常是applicationContext.xml(具体的bean配置会在后面内容中详解) setter方法注入: <property name=“” value=“ja ...

  10. angular ng-content

    <p> child works! </p> <ng-content></ng-content> <app-child> 父组件投影 < ...