题目1

if (!("a" in window)) {
var a = 1;
}
alert(a); // undefined, ~~~所有全局变量都是window的属性,声明语句会被提升至作用域顶部

代码含义:如果window不包含属性a,就声明一个变量a,然后赋值为1。

你可能认为alert出来的结果是1,然后实际结果是“undefined”。要了解为什么,需要知道JavaScript里的3个概念。

首先,所有的全局变量都是window的属性,语句 var a = 1;等价于window.a = 1; 你可以用如下方式来检测全局变量是否声明:

"变量名称" in window

第二,所有的变量声明都在范围作用域的顶部,看一下相似的例子:

alert("a" in window);
var a;

此时,尽管声明是在alert之后,alert弹出的依然是true,这是因为JavaScript引擎首先会扫墓所有的变量声明,然后将这些变量声明移动到顶部,最终的代码效果是这样的:

var a;
alert("a" in window);

这样看起来就很容易解释为什么alert结果是true了。

第三,你需要理解该题目的意思是,变量声明被提前了,但变量赋值没有,因为这行代码包括了变量声明和变量赋值。

你可以将语句拆分为如下代码:

var a;    //声明
a = 1; //初始化赋值

当变量声明和赋值在一起用的时候,JavaScript引擎会自动将它分为两部以便将变量声明提前,不将赋值的步骤提前是因为他有可能影响代码执行出不可预期的结果。

所以,知道了这些概念以后,重新回头看一下题目的代码,其实就等价于:

var a;
if (!("a" in window)) {
a = 1;
}
alert(a);

这样,题目的意思就非常清楚了:首先声明a,然后判断a是否在存在,如果不存在就赋值为1,很明显a永远在window里存在,这个赋值语句永远不会执行,所以结果是undefined。

提前这个词语显得有点迷惑了,你可以理解为:预编译。

题目2

var a = 1,
b = function a(x) { // ~~~ 函数表达式
x && a(--x);
};
alert(a); //~~~ 声明语句提升 函数名在函数体内总是可见的

这个题目看起来比实际复杂,alert的结果是1;这里依然有3个重要的概念需要我们知道。

首先,在题目1里我们知道了变量声明在进入执行上下文就完成了;第二个概念就是函数声明也是提前的,所有的函数声明都在执行代码之前都已经完成了声明,和变

量声明一样。澄清一下,函数声明是如下这样的代码:

function functionName(arg1, arg2){
//函数体
}

如下不是函数,而是函数表达式,相当于变量赋值:

var functionName = function(arg1, arg2){ //~~~function前面有=号,function被认为是函数对象而并非函数声明,然后赋值给变量
//函数体
};

澄清一下,函数表达式没有提前,就相当于平时的变量赋值。

第三需要知道的是,函数声明会覆盖变量声明,但不会覆盖变量赋值,为了解释这个,我们来看一个例子:

function value(){
return 1;
}
var value;
alert(typeof value); //"function"

尽管变量声明在下面定义,但是变量value依然是function,也就是说这种情况下,函数声明的优先级高于变量声明的优先级,但如果该变量value赋值了,那结果就完全不一样了: ~~~函数是一等对象

function value(){
return 1;
}
var value = 1;
alert(typeof value); //"number"

该value赋值以后,变量赋值初始化就覆盖了函数声明。

重新回到题目,这个函数其实是一个有名函数表达式,函数表达式不像函数声明一样可以覆盖变量声明,但你可以注意到,变量b是包含了该函数表达式,而该函数表达式的名字是a;不同的浏览器对a这个名词处理有点不一样,在IE里,会将a认为函数声明,所以它被变量初始化覆盖了,就是说如果调用a(–x)的话就会出错,而其它浏览器在允许在函数内部调用a(–x),因为这时候a在函数外面依然是数字。基本上,IE里调用b(2)的时候会出错,但其它浏览器则返回undefined。

理解上述内容之后,该题目换成一个更准确和更容易理解的代码应该像这样:

var a = 1,
b = function(x) {
x && b(--x);
};
alert(a);

这样的话,就很清晰地知道为什么alert的总是1了。

题目3

function a() {
return 1 ;
}
var a;
alert(a);

这个题目比较简单:即函数声明和变量声明的关系和影响,遇到同名的函数声明,不会重新定义

题目4

function b(x, y, a) {
arguments[2] = 10;
alert(a);
}
b(1, 2, 3);

关于这个题目,ECMAsCRIPT 262-3的规范有解释的。

活动对象是在进入函数上下文时刻被创建的,它通过函数的arguments属性初始化。arguments属性的值是Arguments对象.

关于 Arguments对象的具体定义,看这里:ECMAScript arguments 对象

题目5

function a() {
alert(this);
}
a.call(null);

这个题目可以说是最简单的,也是最诡异的!关于这个题目,我们先来了解2个概念。

这个问题主要考察 Javascript 的 this 关键字,具体看这里:

关于Javascript语言中this关键字的用法

关于 a.call(null);  根据ECMAScript262规范规定:如果第一个参数传入的对象调用者是null或者undefined的话,call方法将把全局对象(也就是window)作为this的值。所以,不管你什么时候传入null,其this都是全局对象window,所以该题目可以理解成如下代码:

function a() {
alert(this);
}
a.call(window);

所以弹出的结果是[object Window]就很容易理解了。

—————

总结:

这5个题目虽然貌似有点偏,但实际上考察的依然是基本概念,只有熟知了这些基本概念才能写出高质量代码。

转:你真的懂得JS吗?的更多相关文章

  1. UCloud EIP 你真的懂得如何使用么? - SegmentFault

    UCloud EIP 你真的懂得如何使用么? - SegmentFault UCloud EIP 你真的懂得如何使用么?

  2. 你真的了解js伪数组吗?深入js伪数组

    关于js伪数组 具有length属性: 按索引方式存储数据: 不具有数组的push().pop()等方法: 你可能知道怎么把伪数组转换为数组,但是你知道这里边的原理吗? 假如页面有一组li元素 < ...

  3. 真的了解js生成随机数吗

    由js生成一切随机数的基础都是Math.random()这个方法,这个方法比较特别,生成的随机数落在的区间是[0,1),进行一次操作的话,js只能生成一个类似于[n,m)这样,左闭右开的区间.所以当有 ...

  4. 你真的理解js的赋值语句么

    之前谢亮兄和我一起讨论的一个问题: var a = {}; a.x = a = 3; a 的值是什么. 其实当执行赋值语句的时候,js 的 = 左侧不是原始变量地址,而是一个新值.怎么理解这句话呢? ...

  5. 8个问题看你是否真的懂 JS

    文章转载: https://juejin.im/post/5d2d146bf265da1b9163c5c9#heading-20 原文地址: https://dev.to/aman_singh/so- ...

  6. 你真的了解JS里的"new"吗?

    我们常常喜欢用new关键字去创建一些对象如new Vue(),但是这个关键字的背后究竟做了什么其实没太多人去关注. 想象我们是苹果公司,要生产30部iPod,规定: 每台iPod都会有自己的ID 每台 ...

  7. 真的了解JS么?

    1.setTimeout setTimeout(function(){ }),1000) setTimeout(function(num){ alert(num)    //弹123 },1000,1 ...

  8. 【灵魂拷问】你真的懂得Mysql的管理和使用吗?

    作者 | Jeskson 来源 | 达达前端小酒馆 MySQL管理,数据库管理和数据表管理,用户管理. 初始化数据库,创建数据库,查看数据库,删除数据库. 创建数据表,查看数据表,修改数据表,删除数据 ...

  9. JavaScript的基础语法,你真的了解吗?

    这篇文章是在我们熟悉了JS的基础语法后,很少有人去关注的一些细节部分.如果掌握了某些细节也许会对代码的改善有着非凡的作用.也许会使我们的代码更严谨,更高效. 1.if语句的条件 if条件中,括号里是布 ...

随机推荐

  1. [PHP] PHP初学者想了解"伪静态",必须看这个贴 [复制链接] [推荐]

    一.何为“伪静态”? 以传智播客bbs论坛为例,这篇帖子的链接地址原本应该是“http://bbs.itcast.cn/forum.php?mod=post&action=newthread& ...

  2. Cocos2d-x3.0 捕Android菜单键和返回键

    原文地址:http://blog.csdn.net/qqmcy/article/details/26172665 .h void onKeyReleased(EventKeyboard::KeyCod ...

  3. ios之TableViewCell重用机制避免反复显示问题

    常规配置例如以下 当超过tableView显示的范围的时候 后面显示的内容将会和前面反复 // 这样配置的话超过页面显示的内容会反复出现 - (UITableViewCell *)tableView: ...

  4. Jquery filter()方法简介

    利用filter函数可以从wrapper set中过滤符合条件的dom元素. 如下图html代码,假如我们要获取类名为filter的<a>标签,用filter方法可以很轻松的获得. < ...

  5. zoj 1081 (改进的弧长算法)(转)

    看到网上除了射线法,很长一段代码之外,看到了一个很简单的算法解决这个问题,特意转了过来 /* 这个算法是源自<计算机图形学基础教程>(孙家广,清华大学出版社),在该书 的48-49页,名字 ...

  6. C# 微信公众平台开发(2)-- 微信菜单

    上一篇了解微信开发者中心 URL的配置验证: 验证成功后,就可以对获取的接口权限进行操作 自定义菜单接口可实现多种类型按钮,用的比较多的是 1.click:点击推事件 用户点击click类型按钮后,微 ...

  7. centos7安装mysql5.6

    1.更新yum源 wget http://repo.mysql.com/mysql-community-release-el7-5.noarch.rpm rpm -ivh mysql-communit ...

  8. 我的Fedora环境

    Fedora现在也更新到了第20个版本,只是在15+以后的版本,大多数操作,都是大同小异的,也不必特意去关注版本号,只有对应到具体的软件,可能会因为库的版本,有或多或少的区别. 之前每次都喜欢按照一些 ...

  9. Python正则表达式一: 基本使用方法

    学习python的正则表达式,主要有两个方面学习: 第一,学习如何写正则表达式,主要是掌握其语法规范.正则表达式的语法规范是通用的,对各种开发语言都是一致的. 第二,学习如何使用正则表达式,也就是掌握 ...

  10. HDU 2610 Sequence one

    题目大意:在给定的序列中找到固定个数的递增的子序列,如果子序列的总个数少于要求的个数,那么就把所有的子序列输出即可. 题解:本来题目也不太看得懂,在别人的博客看了许久才懂,剪枝和判重也不大会,于是暂时 ...