JavaScript中需要注意的几个问题

简介:

JavaScript是一门弱语言,她使用起来不像C/C++那样有十分繁琐的内存管理、类型定义等,所以学习JavaScript的门槛相对来说也比较低。门槛低并不意味着这门语言很简单,我们在使用的时候会遇到各种千奇百怪的问题,有些是因为浏览器的兼容性引起的,有些是因为JS语法本身所引起的,还有些是因为ECMAScript标准的改变而引起的,总之,这样的问题很多,下面列举

几个比较容易忽略的点

  1. switch的case判断

var t = event.keyCode;
switch (t) {
   case '65':
      alert("Yay!");
      break;
}

  当keycode为65时,你会发现,咦?怎么木有alert! 这里需要明确的是,switch在判断的时候使用的是全等号“===”,全等号在比较的时候首先看数据类型是不是一样的,而在这里,t是Number类型,而'65'是String。

 

  2. 严格模式下this≠window

"use strict";
var global = (function() {
    console.log(this); //undefined
})();

  有时候我们需要用global来缓存this这个全局环境(可能是window,也可能是其他的,比如在Worker中没有window对象,用self代表Global),但是在严格模式下函数作用域返回的this为undefined,一般,我们可以采用如下方式获取到Global对象:

"use strict";
var global = (function() {
    var t = new Function("return this")();
    console.log(t);
})();

或者:

"use strict";
var global = (function() {
    var t = window.eval("this");
    console.log(t);
})();

  因为new Function是在全局作用域上执行的,所以返回的是Global对象,下面的eval需要一起注意,eval前如果不交window,那它便处于function作用域中(javascript利用function里分隔作用域),自然不会返回window或者全局对象。使用Function要注意一点:

(function () {
   var local = 1;
   new Function("console.log(typeof local);")(); // logs undefined
}());

  new Function工作在Global作用域链下,所以是访问不到匿名函数中local的~

 

  3. 变量提升(Hoisting)

var t = "global";
function foo(){
    console.log(t); //undefined
    return; 
   var t = "local"; }

  这是一个老生常谈的问题,var最好不好到处散布。所谓的变量提升,在这里存在两个作用域,一个是Global作用域,他下面有t和foo这两个变量,而foo指向的是foo作用域,foo作用域下有一个t变量,画个图演示下吧

[Global Scope]
    |----- t   [String] undefined -> "global"
    |----- foo [Reference] [foo Scope]

[foo Scope]
    |----- t   [String] undefined -> "local"

  刚进入全局作用域链的时候,程序扫描到t和foo两个变量,于是给这个t赋值为undefined,扫面完了之后,看到t有值,于是给赋值”global“,foo指向[foo Scope],于是进入[foo Scope],继续扫描函数作用域链下的变量,发现目标t之后,赋值为undefined,在console.log时,是这样的:

var t = "global";
function foo(){
    var t; // 等同于 -> var t = undefined;
    console.log(t); //undefined 
return;  
var t = "local";
}

  上面的例子写不写return结果都是一样的,加return,只是为了更好的表达变量提升这个动作的存在。一般比较推荐的变量定义方式:

function foo(a, b, c) {
    var x = 1,
        bar,
        baz = "something";
}

  一个var,后边连着一串变量的定义。

 

附:javascript严格模式下要注意的地方(转自次碳酸钴

 1. 变量必须声明才能使用

"use strict";
a=1; //缺少var语句做声明,因此报错
"use strict";
var a=b=1; //错误 b未声明

 

 2. 函数声明语句(不包括表达式)不允许在普通代码块(不包括闭包)中使用

"use strict";
(function(){
  //闭包中是允许使用函数声明语句的
  function func(){};
})();
{
  var f=function(){}; //函数声明表达式允许
  function func(){}; //函数声明语句在普通闭包中,错误
};

3. 闭包内的this不指向Global对象

"use strict";
(function(){
  alert(this); //输出undefined
})();

4. 对象属性和函数形参不能重复声明

"use strict";
var o={a:1,a:1};
//这个对象定义了两个a属性,因此报错
"use strict";
function func(a,a){};
//这个函数的两个形参都是a,因此报错

5. eval拥有类似闭包的作用域

"use strict";
var a=1,b=1;
eval("var a=2");
window.eval("var b=2");
alert(a); //输出1 因为运行的a变成了eval作用域的局部变量
alert(b); //输出2 window.eval依然是全局作用域

6. callee和caller属性无法使用

"use strict";
function func(){
  return arguments.callee; //错误 callee无法使用
};
func();

7. with语句无法使用

"use strict";
with({});

8. 八进制数字常量无法使用

"use strict";
var a=0999; //十进制,可以使用
var b=0123; //八禁止,无法使用

9. 普通模式下的一些无效操作变成错误

"use strict";
var a=1;
delete a;
//错误 无法删除var声明的变量
"use strict";
var o={get a(){}};
o.a=1;
//错误 给只读属性赋值







目录
相关文章
|
JavaScript 前端开发
JavaScript中的各种奇葩问题
原文:JavaScript中的各种奇葩问题 JavaScript浮点数 var a = (0.1 + 0.2) + 0.3; var b = 0.1 + (0.2 + 0.3); console.log(a);//0.6000000000000001 console.log(b);//0.6 在JavaScript中是没有整数的,所有数字都是双精度浮点数。
885 0
|
Web App开发 JavaScript 前端开发
JavaScript FAQ(一)—— 常见问题(一)
        今天在网上看到了一份很不错的JavaScript FAQ,由于担心自己并不能一直把它读完,所以就尝试翻译一些内容,和朋友们一起分享。        FAQ原地址:http://www.
1068 0
|
JavaScript 前端开发 Java
JavaScript FAQ(二)——常见问题(二)
一、常见问题   4. JavaScript的局限性(JavaScript Lminitations) Q:JavaScript程序不能做什么? A:JavaScript代码不能做下列事情: 不能使用用户系统上或者客户端局域网中的打印机或者其他设备。
1038 0
|
JavaScript 前端开发 C++
JavaScript FAQ (三)——常见问题(三)
 一、常见问题   9. JavaScript的注释(Comments in JavaScript) Q:我如何在JavaScript代码中插入注释? A:JavaScript支持三种不同类型的注释: 多行C样式的注释。
977 0
|
1月前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
25 1
JavaScript中的原型 保姆级文章一文搞懂
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
104 2
|
28天前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
17 0
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
147 4
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
89 4
|
5月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
79 4