文档章节

深入学习JavaScript

zTree
 zTree
发布于 2012/11/21 18:01
字数 800
阅读 439
收藏 7

既然下决心要把前端好好研究一番,那么就一定要深入学习一下。

昨天一个朋友给我发Email 推荐了这个网址:http://blog.goddyzhao.me/JavaScript-Internal  真的很不错,非常值得认真学习一下。

需要加固的知识点:

1、加不加 var 可是有区别的哟!!

a = 10;
alert(window.a); // 10
 
alert(delete a); // true
 
alert(window.a); // undefined
 
var b = 20;
alert(window.b); // 20
 
alert(delete b); // false
 
alert(window.b); // still 20

2、关于 this(最后三个表达式添加了特定的操作之后,调用括号左侧就不再是引用类型的值了。

var foo = {
  bar: function () {
    alert(this);
  }
};
 
foo.bar(); // Reference, OK => foo
(foo.bar)(); // Reference, OK => foo
 
(foo.bar = foo.bar)(); // global?
(false || foo.bar)(); // global?
(foo.bar, foo.bar)(); // global?

3、继续关于 this (有这么一种情况下,当调用表达式左侧是引用类型的值,但是this的值却是null,最终变为全局对象。 发生这种情况的条件是当引用类型值的base对象恰好为活跃对象。

function foo() {
  function bar() {
    alert(this); // global
  }
  bar(); // 和AO.bar()是一样的
}
4、上面的情况在 With 时例外
var x = 10;
 
with ({
 
  foo: function () {
    alert(this.x);
  },
  x: 20
 
}) {
 
  foo(); // 20
 
}

5、通过Function构造器创建的函数的[[Scope]]属性

var x = 10;
 
function foo() {
 
  var y = 20;
 
  function barFD() { // FunctionDeclaration
    alert(x);
    alert(y);
  }
 
  var barFE = function () { // FunctionExpression
    alert(x);
    alert(y);
  };
 
  var barFn = Function('alert(x); alert(y);');
 
  barFD(); // 10, 20
  barFE(); // 10, 20
  barFn(); // 10, "y" is not defined
 
}
 
foo();

问题就在于当函数通过Function构造器来创建的时候,其[[Scope]]属性永远都只包含全局对象。 哪怕在上层上下文中(非全局上下文)创建一个闭包都是无济于事的。

6、发生了什么?怎么最外层的“y”变成了30?

var x = 10, y = 10;
 
with ({x: 20}) {
 
  var x = 30, y = 30;
 
  alert(x); // 30
  alert(y); // 30
}
 
alert(x); // 10
alert(y); // 30
  • x=10, y=10
  • 对象{x: 20}添加到了作用域链的最前面
  • 在with中遇到了var语句,当然了,这个时候什么也不会发生。因为早在进入上下文阶段所有的变量都已经解析过了并且添加到了对应的变量对象上了。
  • 这里修改了“x”的值,原本“x”是在第二步的时候添加的对象{x: 20}(该对象被添加到了作用域链的最前面)中的“x”,现在变成了30。
  • 同样的,“y”的值也修改了,由原本的10变成了30
  • 之后,在with语句结束之后,其特殊对象从作用域链中移除(修改过的“x”——30,也随之移除),作用域链又恢复到了with语句前的状态。
  • 正如在最后两个alert中看到的,“x”的值恢复到了原先的10,而“y”的值因为在with语句的时候被修改过了,因此变为了30。

7、 [] == ![] 为何等于true? 一道简单的题目让我顿悟了!

自己发展一下


alert("000000" == false) //true
alert(["00000"] == ![]) //true
alert([""] == ![]) //true
alert("000000" == ![]) 和 alert("000000" == []) 为啥不一样呢?? 
alert("" == ![]) 和 alert("" == []) 为啥又一样呢??
alert(0 == ![]) 和 alert(0 == []) 为啥也一样呢??


按照规则好好思考一下就明白喽!(有必要的话好好看看 ECMA-262 文档吧  http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf

【完】————基础很重要!

© 著作权归作者所有

共有 人打赏支持
zTree

zTree

粉丝 831
博文 21
码字总数 21754
作品 1
朝阳
技术主管
私信 提问
加载中

评论(1)

王攀
感谢葱爷分享!
一个合格的前端工程师必看的书籍

以我的经验,大部分技术,熟读下列四类书籍即可。 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列 全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解...

财富江湖
2014/12/23
1K
1
前端开发,从菜鸟到大牛的取经之路

以我的经验,大部分技术,熟读下列四类书籍即可。 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列 全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解...

modernizr
2014/05/05
2.4K
14
说说掌握JavaScript语言的思想前提

无论是公司的同事还是外界的程序员朋友们,大部分人对JavaScript的高级应用不甚了解,已有的知识架构里会认为JavaScript仅仅是一门脚本语言,其作用是给页面做一些锦上添花的效果,比如表单验...

bosscheng
2013/08/07
0
1
前端工程师必经的几个境界

以我的经验,大部分技术,熟读下列四类书籍即可。 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列 全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解...

coffeescript
2014/07/23
537
1
关于前端开发技术的书籍推荐以及技术书分类

以我的经验,大部分技术,熟读下列四类书籍即可。 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列 全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解...

chromeplugin
2014/06/19
822
1

没有更多内容

加载失败,请刷新页面

加载更多

Confluence 6 自定义你的空间

通过对你的空间进行界面的自定义能够让你的空间更加出类拔萃。 如果你具有空间管理员权限,你可以修改你空间的颜色配色,添加你自己的空间标识,选择是否在你空间中显示边栏。或者你可以进入...

honeymose
35分钟前
1
0
Ubuntu18.04 安装MySQL

1.安装MySQL sudo apt-get install mysql-server 2.配置MySQL sudo mysql_secure_installation 3.设置MySQL非root用户 设置原因:配置过程为系统root权限,在构建MySQL连接时出现错误:ERROR...

AI_SKI
今天
3
0
3.6 rc脚本(start方法) 3.7 rc脚本(stop和status方法) 3.8 rc脚本(以daemon方式启动)

3.6-3.7 rc脚本(start、stop和status方法) #!/usr/bin/env python# -*- coding: utf-8 -*-# [@Version](https://my.oschina.net/u/931210) : python 2.7# [@Time](https://my.oschina.......

隐匿的蚂蚁
今天
3
0
Cnn学习相关博客

CNN卷积神经网络原理讲解+图片识别应用(附源码) 笨方法学习CNN图像识别系列 深度学习图像识别项目(中):Keras和卷积神经网络(CNN) 卷积神经网络模型部署到移动设备 使用CNN神经网络进行...

-九天-
昨天
5
0
flutter 底部输入框 聊天输入框 Flexible

想在页面底部放个输入框,结果键盘一直遮住了,原来是布局问题 Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("评论"), ...

大灰狼wow
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部