call , apply的this指向实现原理并自己实现封装
实现this指向原理
var value = 'value'
var obj = {
value: 'obj'
} function func() {
console.log(this.value)
}
func() // obj
func.call(obj) // obj
obj.func = func // 相当于obj变成了 obj = { value: 'obj', func: function func() {console.log(this.value)}} --创建后记得删除
obj.func() // obj 相当于调用obj内的func函数
实现this指向并传参原理
// 将newCall赋到Function的父对象上
Function.prototype.newCall = function () {
var ctx = arguments[0] || window // 判断是否传了一个对象进来,如果有将this指向这个对象
ctx.fn = this
var args = []
for(var i = 1; i<arguments.length; i++) {
args.push('arguments[' + i + ']')
}
// args = ['arguments[i]','arguments[2]'].join(',')
// eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。缺点是会改变作用域
var result = eval('ctx.fn(' + args.join(',') + ')')
delete ctx.fn // 删除在ctx对象内创建的fn函数
return result
}
call , apply的this指向实现原理并自己实现封装的更多相关文章
- bind、call、apply的区别与实现原理
1.简单说一下bind.call.apply的区别 三者都是用于改变函数体内this的指向,但是bind与apply和call的最大的区别是:bind不会立即调用,而是返回一个新函数,称为绑定函数,其 ...
- this的指向问题、bind/call/apply改变this指向
this的指向问题 全局作用域下的this指向 无论是否是严格模式,全局作用域下的this始终指向window 函数内部的this 严格模式下: function test() { 'use stri ...
- js 中 new call apply bind JSON.stringify 的原理以及模拟实现
1.new的原理和实现 它创建了一个全新的对象. 它会被执行 [[Prototype]](也就是 __proto__)链接. 它使 this指向新创建的对象. 通过 new创建的每个对象将最终被 [[ ...
- call,apply,bind的内部原理实现
call call 方法使用一个函数执行的时候更改本身 this 指向,并传入一个或者多个参数. var obj = { name: '$call' } function _fun() { conso ...
- 谈谈Angular关于$watch,$apply 以及 $digest的工作原理
这篇文章主要是面向那些刚开始学AngularJs和想要了解数据绑定(data-binding)是怎么工作的, 如果你已经熟悉如何使用angularjs了,我强烈建议你不用阅读了. angularjs使 ...
- call()与apply() 改变this指向
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Consolas; color: #a5b2b9 } span.Apple-tab-span ...
- call/apply以及this指向的理解
javascript是面向对象的语言,Function也是一种对象,有自己的属性和方法.call和apply就是js函数自带方法,挂在Fucntion.prototype上. 一般调用某函数时,直接“ ...
- jsonp的原理介绍及Promise封装
什么叫jsonp? jsonp是json with padding(填充式json或参数式json)的简写,是通过ajax请求跨域接口,获取数据的新实现方式 jsonp的实现原理: 动态创建scrip ...
- ajax请求原理及jquery $.ajax封装全解析
.ajax原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其中最关键的一步就是从服务器获得 ...
随机推荐
- ABP开发框架前后端开发系列---(14)基于Winform的ABP快速开发框架
前面介绍了很多ABP系列的文章,一步一步的把我们日常开发中涉及到的Web API服务构建.登录日志和操作审计日志.字典管理模块.省份城市的信息维护.权限管理模块中的组织机构.用户.角色.权限.菜单等内 ...
- SpringCloud的入门学习之概念理解、Zuul路由网关
1.Zuul路由网关是什么? 答:Zuul包含了对请求的路由和过滤两个最主要的功能,其中路由功能负责将外部请求转发到具体的微服务实例上,是实现外部访问统一入口的基础而过滤器功能则负责对请求的处理过程进 ...
- 在nodejs中怎么使用redis缓存组件
redis量个强大的缓存组件,可以部署在windows和linux环境之上,它有五大存储结构,其中有一种为列表list,它可以实现quene和stack的功能,即队列和堆栈的功能. 当然使用先安装py ...
- fiddler抓包syntaxview窗口乱码
只需再fiddler界面GO往右第二个Decode点击一下,让他出现蓝色边框即可 注意:抓取前的他不会进行自动解码,要再重新刷新页面才能获取界面后的内容
- Script - 检查当前的undo配置和建议设置 (Doc ID 1579035.1)
Script - Check Current Undo Configuration and Advise Recommended Setup (Doc ID 1579035.1) APPLIES TO ...
- Linux—文件管理
文件操作 创建文件 [root@localhost ~]# touch a.txt # 创建单个文件 [root@localhost ~]# touch b.txt c.txt # 创建多个文件 删除 ...
- Octave计算数据
设A=[1 2;3 4;5 6] B=[11 12;13 14;15 16] A.*B = :对A以及B中的对应的元素进行相乘 11 24 39 56 75 96 A.^2 :对A中的每一个元 ...
- c/c++概述
c/c++的学习分为两个部分 一.语言标准 语言标准定义了功能特性和标准库两部分. 功能特性由编译器负责具体实现,比如linux下gcc,windows下Visual Studio 标准库实现依赖于具 ...
- TensorFlow从1到2(十五)(完结)在浏览器做机器学习
TensorFlow的Javascript版 TensorFlow一直努力扩展自己的基础平台环境,除了熟悉的Python,当前的TensorFlow还实现了支持Javascript/C++/Java/ ...
- go语言设计模式之template
template.go package template import ( "strings" ) type MessageRetriever interface { Messag ...