JavaScript this使用方法图解

前言 在函数调用时,arguments和this会被静默的传递给函数,并可以在函数体内引用它们,借以访问函数相关的一些信息. 其中arguments是一个类数组结构,它保存了调用时传递给函数的所有实参:this是函数执行时的上下文对象, 这个对象有些让人感到困惑的行为. 下面分别对他们进行讨论. 1. arguments 1.1 背景 JavaScript 允许函数在调用时传入的实参个数和函数定义时的形参个数不一致, 比如函数在定义时声明了 n 个参数, 在调用函数时不一定非要传入 n 个参数,

一般我们都是在main.js中引入vue,然后在vue文件中直接使用this(this指向的是vue实例),但是在实际开发中,我们往往会引入外部的js文件使用this,这个this就会指向window,并不是我们期待的vue实例,那么就需要重新引入vue文件(import Vue from 'vue'),这样很麻烦.在目前项目中我使用的方法是mian.js导出vue实例,然后在需要使用的js中引入. 步骤一:main.js导出vue实例 var vue = new Vue({ el: '#app

this 的定义 表示当前执行代码的环境对象 因此可将 this 的剖析分为"全局环境" 和 "函数环境" 两种类型的环境对象 全局环境 console.log(this === window); // true var a = 10; console.log(this.a); // 10 函数环境 在函数内部,this 的取值取决于函数被调用时的运行环境. 这里涉及到内存里的数据结构相关的知识点,当我们定义以下字面量对象时会发生一系列的关联关系 var obj =

Javascript中this的指向一直是困扰我很久的问题,在使用中出错的机率也非常大.在面向对象语言中,它代表了当前对象的一个引用,而在js中却经常让我觉得混乱,它不是固定不变的,而是随着它的执行环境的改变而改变. 在Javascript中this总是指向调用它所在方法的对象.因为this是在函数运行时,自动生成的一个内部对象,只能在函数内部使用. 下面我们分几种情况深入分析this的用法: 1.全局的函数调用 function globalTest() { this.name = "glob

前言 箭头函数极大地简化了this的取值规则. 普通函数与箭头函数 普通函数指的是用function定义的函数: var hello = function () { console.log("Hello, Fundebug!"); } 箭头函数指的是用=>定义的函数: var hello = () => { console.log("Hello, Fundebug!"); } JavaScript箭头函数与普通函数不只是写法上的区别,它们还有一些微妙的不

我喜欢在JS中更改函数执行上下文的指向,也称为 this 指向. 例如,咱们可以在类数组对象上使用数组方法: const reduce = Array.prototype.reduce; function sumArgs() { return reduce.call(arguments, (sum, value) => { return sum += value; }); } sumArgs(1, 2, 3); // => 6 另一方面,this 很难把握. 咱们经常会发现自己用的 this

箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this. 由于箭头函数没有自己的this指针,通过 call() 或 apply() 方法调用一个函数时,只能传递参数(不能绑定this),他们的第一个参数会被忽略. 前言 阅读下面的内容要先看下<你不知道的javascript(上)>中的第二部分:this和对象原型(里面对于this指向的理论部分主要来源于该书). 问题 这周在写代码的时候,听同事在说箭头函数无法更改this的指向,并且使用下面代码进行验证: // (1)

这篇文章主要介绍了JavaScript this使用方法图解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 本文我们介绍下js中this的用法. 由上图可得,默认this指向window,而在node.js中this默认指向global. 由上图可得: 1.原型链为o->MyClass.prototype. 2.函数如果没有明确返回值默认返回this. 由上图可得:call和apply功能相同,不同之处为apply传调用参数时应为数组. 由上图

JavaScript Math.ceil 方法 Math.ceil 方法用于对数值向上取整,即得到大于或等于该数值的最小整数.语法如下: Math.ceil(x) 参数说明: 参数 说明 x 必需.必须是一个数值. 提示:该方法与 Math.floor 方法正好相反. Math.ceil 方法实例 <script language="JavaScript"> document.write( Math.ceil(0.35) + "<br />"

JavaScript Math.floor 方法 Math.floor 方法用于对数值向下取整,即得到小于或等于该数值的最大整数.语法如下: Math.floor(x) 参数说明: 参数 说明 x 必需.必须是一个数值. 提示:该方法与 Math.ceil 方法正好相反. Math.floor 方法实例 <script language="JavaScript"> document.write( Math.floor(0.35) + "<br />&q

JavaScript数组sort()方法排序数组的元素. 语法 array.sort( compareFunction ); 下面是参数的详细信息: compareFunction : 指定一个函数,定义排序次序.如果省略,数组字典顺序排序. 返回值: 返回一个排序的数组 例子: <html> <head> <title>JavaScript Array sort Method</title> </head> <body> <s

javascript Date.setSeconds()方法按照本地时间的设置秒指定日期. 语法 Date.setSeconds(secondsValue[, msValue]) 注:括号内外的数据是可选的 下面是参数的详细信息: secondsValue : 0到59之间的整数. msValue : 一个数字在0和999之间,表示毫秒. 如果不指定msValue参数,使用从方法使用getMilliseconds返回的值.如果指定的参数是预期范围之外,调用setSeconds尝试相应地更新Dat

javascript Date.getFullYear()方法按照本地时间返回指定日期的年份.通过getFullYear返回的值是一个绝对的数字.对于1000年和9999之间的日期,getFullYear返回一个4位数字,例如2008年. 语法 Date.getFullYear() 下面是参数的详细信息: NA 返回值: 按照本地时间返回指定日期的年份. 例子: <html> <head> <title>JavaScript getFullYear Method<

1. 概述 删除后的节点虽然不在文档树中了,但其实它还在内存中,可以随时再次被添加到别的位置. 当你遍历一个父节点的子节点并进行删除操作时,要注意,children属性是一个只读属性,并且它在子节点变化时会实时更新 // 拿到待删除节点: var self = document.getElementById('to-be-removed'); // 拿到父节点: var parent = self.parentElement; // 删除: var removed = parent.remove