首页
学习
活动
专区
圈层
工具
发布
50 篇文章
1
前端学习(0)~vscode工具使用
2
前端学习(1)~html标签讲解(一)
3
前端学习(2)~html标签讲解(二)
4
前端学习(3)~html5详解(一)
5
前端学习(4)~html5详解(二)
6
前端学习(6)~html回顾
7
前端学习(7)~css学习(一):字体属性和文本属性
8
前端学习(8)~css学习(二):背景属性
9
前端学习(9)~css学习(三):样式表和选择器
10
前端学习(10)~css学习:选择器:伪类
11
前端学习(11)~css学习(五):样式表的继承性和层叠性
12
前端学习(12)~css学习(六):盒模型详解
13
前端学习(13)~css学习(七):浮动
14
前端学习(14)~css学习(八):定位属性
15
前端学习(15)~css3学习(九):选择器详解
16
前端学习(16)~css3属性学习(十)
17
前端学习(18)~css3属性学习(十一):动画详解
18
前端学习(19)~css3属性(十二):Flex布局图片详解
19
前端学习(20)~css布局(十三)
20
前端学习(21)~css学习:如何让一个元素水平垂直居中?
21
前端学习(22)~css问题讲解
22
前端学习(23)~js学习(一)
23
前端学习(24)~js学习(二):变量
24
前端学习(25)~js学习(三):变量的数据类型
25
前端学习(26)~js学习(四):基本数据类型vs引用数据类型
26
前端学习(27)~js学习(五): typeof和数据类型转换
27
前端学习(28)~js学习(六):运算符
28
前端学习(30)~js学习(七):流程控制语句-选择结构(if,switch)
29
前端学习(31)~js学习(八):流程控制语句:循环结构(for和while)
30
前端学习(32)~js学习(九):对象简介和对象的基本操作
31
前端学习(33)~js学习(十):函数
32
前端学习(34)~js学习(十一):作用域和变量提升
33
前端学习(35)~js学习(十二):预编译
34
前端学习(36)~js学习(十三):this
35
前端学习(37)~js学习(十四):对象的创建
36
前端学习(38)~js学习(十五):原型对象
37
前端学习(39)~js学习(十六):数组
38
前端学习(40)~js学习(十七):数组的常见方法&数组的遍历
39
前端学习(42)~js学习(十九):内置对象-Date
40
前端学习(43)~js学习(二十):内置对象 - String
41
前端学习(44)~js学习(二十一):包装类
42
前端学习(45)~正则表达式
43
前端学习(46)~事件简介
44
前端学习(47)~DOM简介和DOM操作
45
前端学习(48)~通过style对象获取和设置行内样式
46
前端学习(49)~offset相关属性和匀速动画(含轮播图实现)
47
前端学习(50)~事件的绑定和事件对象
48
前端学习(51)~事件的传播和事件冒泡
49
前端学习(52)~事件委托
50
前端学习(53)~键盘事件

前端学习(36)~js学习(十三):this

解析器在调用函数每次都会向函数内部传递进一个隐含的参数,这个隐含的参数就是this,this指向的是一个对象,这个对象我们称为函数执行的 上下文对象。

根据函数的调用方式的不同,this会指向不同的对象:【重要】

  • 1.以函数的形式调用时,this永远都是window。比如fun();相当于window.fun();
  • 2.以方法的形式调用时,this是调用方法的那个对象
  • 3.以构造函数的形式调用时,this是新创建的那个对象
  • 4.使用call和apply调用时,this是指定的那个对象

箭头函数中this的指向:

ES6中的箭头函数并不会使用上面四条标准的绑定规则,而是会继承外层函数调用的this绑定(无论this绑定到什么)。

类数组 arguments

在调用函数时,浏览器每次都会传递进两个隐含的参数:

  • 1.函数的上下文对象 this
  • 2.封装实参的对象 arguments

例如:

代码语言:javascript
复制
    function foo() {
        console.log(arguments);
        console.log(typeof arguments);
    }

    foo();

arguments是一个类数组对象,它可以通过索引来操作数据,也可以获取长度。

arguments代表的是实参。在调用函数时,我们所传递的实参都会在arguments中保存。有个讲究的地方是:arguments只在函数中使用

1、返回函数实参的个数:arguments.length

arguments.length可以用来获取实参的长度。

举例:

代码语言:javascript
复制
    fn(2,4);
    fn(2,4,6);
    fn(2,4,6,8);

    function fn(a,b) {
        console.log(arguments);
        console.log(fn.length);         //获取形参的个数
        console.log(arguments.length);  //获取实参的个数

        console.log("----------------");
    }

打印结果:

我们即使不定义形参,也可以通过arguments来使用实参(只不过比较麻烦):arguments[0] 表示第一个实参、arguments[1] 表示第二个实参...

2、返回正在执行的函数:arguments.callee

arguments里边有一个属性叫做callee,这个属性对应一个函数对象,就是当前正在指向的函数对象。

代码语言:javascript
复制
    function fun() {

        console.log(arguments.callee == fun); //打印结果为true
    }

    fun("hello");

在使用函数递归调用时,推荐使用arguments.callee代替函数名本身。

3、arguments可以修改元素

之所以说arguments是伪数组,是因为:arguments可以修改元素,但不能改变数组的长短。举例:

代码语言:javascript
复制
    fn(2,4);
    fn(2,4,6);
    fn(2,4,6,8);

    function fn(a,b) {
        arguments[0] = 99;  //将实参的第一个数改为99
        arguments.push(8);  //此方法不通过,因为无法增加元素
    }
下一篇
举报
领券