8.this

1.举例说说apply方法和call方法的作用和区别

2.读下面代码,写程序结果

function identify () {
return this.name.toUpperCase()
} function speek () {
var greeting = 'hello, 我是' + identify.call(this)
console.log(greeting)
} var p1 = {
name: 'xiaoHong'
}
var p2 = {
name: 'XiaoLi'
}
identify.call(p1) // 输出?
identify.call(p2) // 输出?
speek.call(p1) // 输出?
speek.call(p2) // 输出?

3.读下面代码,写程序结果

function foo (num) {
console.log('foo:' + num)
this.count++
}
foo.count = 0
for (var i = 0; i < 10; i++) {
if ( i > 5) {
foo(i)
}
}
console.log('foo.count被调用了多少次?:'+foo.count)

4.this到底是什么?

1、this的绑定和函数的声明位置没有关系,只取决于函数的调用方式
2、当一个函数被调用时,会创建一个活动记录(有时候也称为执行上下文)。这个记录会包含函数在哪里调用、函数的调用方式、传入的参数等信息,this就是这个活动记录的一个属性,会在函数执行的过程中用到

5.读下面代码,写出运行结果(知识点,默认绑定)

function foo () {
console.log(this.a)
}
var a = 2
foo() //输出?
function foo () {
"use strict"
console.log(this.a)
}
var a = 2
foo() // 输出?
function foo () {
console.log(this.a)
}
var a = 2
;(function () {
"use strict"
foo()
})()

6.读下面代码,写出运行结果(知识点,隐式绑定)

function foo () {
console.log(this.a)
}
var obj = {
a: 2,
foo: foo
}
obj.foo() // 输出?
function foo () {
console.log(this.a)
}
var obj2 = {
a: 42,
foo: foo
}
var obj1 = {
a: 2,
obj2: obj2
}
obj1.obj2.foo() //输出?

7.读下面代码,写出运行结果(知识点,绑定丢失)

function foo () {
console.log(this.a)
}
var obj = {
a: 2,
foo: foo
}
var bar = obj.foo
var a = '我是全局属性a'
bar() //输出?
function foo () {
console.log(this.a)
}
function doFoo (fn) {
fn()
}
var obj = {
a: 2,
foo: foo
}
var a = '我是全局变量a'
doFoo(obj.foo) //输出?
function foo () {
console.log(this.a)
}
var obj = {
a: 2,
foo: foo
}
var a = '我是全局变量a'
setTimeout(obj.foo, 100) // 输出

8.读下面代码,写出运行结果(知识点,call)

function foo () {
console.log(this.a)
}
var obj = {
a: 2
}
foo.call(obj) //输出多少?

思考,如何解决绑定丢失问题?直接使用call方法能不能实现?

9.读下面代码,写出运行结果(知识点,硬绑定)

function foo (something) {
console.log(this.a, something)
return this.a + something
}
var obj = {
a: 2
}
var bar = function () {
return foo.apply(obj, arguments)
}
var b = bar(3) //输出多少?
console.log(b) //输出多少?

10.简单写一个通用的辅助函数bind

function foo (something) {
console.log(this.a, something)
return this.a + something
} function bind(fn, obj) {
// 补充代码
...
}
var obj = {
a: 2
}
var bar = bind(foo, obj) var b = bar(3) // 2 3
console.log(b) // 5

11.读下面代码,写出运行结果(知识点,new绑定)

function foo (a) {
this.a = a
}
var bar = new foo(2)
console.log(bar.a) //输出多少?

12.读下面代码,写出运行结果(知识点,箭头函数的this)

function foo () {
return (a) => {
console.log(this.a)
}
}
var obj1 = {
a: 2
}
var obj2 = {
a: 3
}
var bar = foo.call(obj1)
bar.call(obj2) //输出多少?
function foo() {
setTimeout(() => {
console.log(this.a)
}, 100)
}
var obj = {
a: 2
}
foo.call(obj) //输出多少?

13.总结判断this指向的方法

1. 函数是否在new中调用?如果是的话this指向的是新创建的对象

2.函数是否通过call、apply或者硬绑定调用?如果是的话,this指向的是指定的对象

3.函数是否在某个上下文对象中调用?如果是的话,this指向的是那个上下文对象

4.如果都不是的话,使用默认绑定,如果在严格模式下,绑定到undefined,否则指向全局对象

螺钉课堂视频课程地址:http://edu.nodeing.com

js基础练习题(3)的更多相关文章

  1. js基础练习题(1)

    1.字符串 视频教程地址: js基础练习题 1.如何连接两个或者两个以上字符串? var cssname = 'box' var num = 1 var html = '<div class=& ...

  2. js基础练习题(2)

    5.函数 1.按要求封装两个函数 1.封装一个函数,要求输入字符串转化成数组弹出 2.封装一个函数,要求能求出三个数中的最小值,注意:不准使用js内置函数 2.封装一个函数,求参数的和,注意:参数不固 ...

  3. js基础练习题(6)

    10.其他 1.选择题 var name = 'World!'; (function () { if (typeof name === 'undefined') { var name = 'Nodei ...

  4. js基础练习题(4)

    9.对象 阅读代码,回答问题 function User(name) { var name1 = name; this.name2 = name; function getName1() { retu ...

  5. js基础练习--控制多组图片切换

    js基础练习题,一个按钮控制两组图片的切换,做这题的时候我忽然想到了将num1.mun2……都存放在一个数组中,根据索引值匹配到对应相应组的图片,这样不管有多少组图片都简单的搞定切换,可惜js基础都没 ...

  6. JS 基础学习随想

    2012年就已经接触过了js,给我的印象:这是一门谈不上复杂的语言.大概这就是所谓的学的越浅,用的越少,觉得自己会的东西好像得更多吧!开始做基础练习题的时候觉得好像都十分简单.可是后来在做到对象数组的 ...

  7. 【2017-03-28】JS基础、windows对象、history对象、location对象

    一.JS基础 JS - javaScript 1.js功能: 1).进行数据的运算.2).控制浏览器的一些功能.3).控制元素(属性.内容.样式) js引用位置: 可以放在html页的任意位置. 推荐 ...

  8. js 基础篇(点击事件轮播图的实现)

    轮播图在以后的应用中还是比较常见的,不需要多少行代码就能实现.但是在只掌握了js基础知识的情况下,怎么来用较少的而且逻辑又简单的方法来实现呢?下面来分析下几种不同的做法: 1.利用位移的方法来实现 首 ...

  9. Linux基础练习题(二)

    Linux基础练习题(二) 1.复制/etc/skel目录为/home/tuer1,要求/home/tuser1及其内部文件的属组和其它用户均没有任何访问权限. [root@www ~]# cp -r ...

随机推荐

  1. Rocket - util - MaskGen

    https://mp.weixin.qq.com/s/_aJqf1cFJDK5RVRBhxTWOw   介绍MaskGen的实现.   ​​   1. 基本介绍   给定总线宽度beatBytes,根 ...

  2. jchdl - RTL实例 - MOS6502 ALU

    https://mp.weixin.qq.com/s/nMxYVC2djk7DdAforerZPA   使用jchdl RTL实现MOS6502 CPU的ALU.   参考链接 https://git ...

  3. 【Storm】核心组件nimbus、supervisor、worker、executor、task

    nimbus 是整个集群的控管核心,负责topology的提交.运行状态监控.任务重新分配等工作. zk就是一个管理者,监控者. 总体描述:nimbus下命令(分配任务),zk监督执行(心跳监控wor ...

  4. 【Linux】ntp服务-时间同步

    ntp简易安装与时间同步 yum -y install ntp ntpdate //安装ntp服务 ntpdate cn.pool.ntp.org //更新时间 hwclock --systohc / ...

  5. Java实现 LeetCode 365 水壶问题

    365. 水壶问题 有两个容量分别为 x升 和 y升 的水壶以及无限多的水.请判断能否通过使用这两个水壶,从而可以得到恰好 z升 的水? 如果可以,最后请用以上水壶中的一或两个来盛放取得的 z升 水. ...

  6. Java实现蓝桥杯模拟元音单词的验证

    问题描述 小明对类似于 hello 这种单词非常感兴趣,这种单词可以正好分为四段,第一段由一个或多个辅音字母组成,第二段由一个或多个元音字母组成,第三段由一个或多个辅音字母组成,第四段由一个或多个元音 ...

  7. java实现第六届蓝桥杯密文搜索

    密文搜索 福尔摩斯从X星收到一份资料,全部是小写字母组成. 他的助手提供了另一份资料:许多长度为8的密码列表. 福尔摩斯发现,这些密码是被打乱后隐藏在先前那份资料中的. 请你编写一个程序,从第一份资料 ...

  8. PAT 有理数四则运算

    本题要求编写程序,计算 2 个有理数的和.差.积.商. 输入格式: 输入在一行中按照 a1/b1 a2/b2 的格式给出两个分数形式的有理数,其中分子和分母全是整型范围内的整数,负号只可能出现在分子前 ...

  9. PAT 数字黑洞

    给定任一个各位数字不完全相同的 4 位正整数,如果我们先把 4 个数字按非递增排序,再按非递减排序,然后用第 1 个数字减第 2 个数字,将得到一个新的数字.一直重复这样做,我们很快会停在有“数字黑洞 ...

  10. 5、vue的传值

    1-父组件向子组件  -父组件向孙子组件传值(属性传值) //父组件<template> <div id='app'> <headera v-bind:hea=" ...