JS中被自己忽略掉的一些东西

记录一些JS中被自己所忽略掉的一些知识点：

1.Date

JavaScript 处理日期数据类似于Java。这两种语言有许多一样的处理日期的方法，也都是以1970年1月1日00:00:00以来的毫秒数来储存数据类型的。

Date 对象的范围是相对距离 UTC 1970年1月1日 的前后 100,000,000 天。

创建一个日期对象：

var dateObjectName = new Date([parameters]);

这里的 dateObjectName 对象是所创建的Date对象的一个名字，它可以成为一个新的对象或者已存在的其他对象的一个属性。

不使用 new 关键字来调用Date对象将返回当前时间和日期的字符串

Date()
//"Wed Jan 03 2018 10:42:25 GMT+0800 (China Standard Time)"

前边的语法中的参数（parameters）可以是以下任何一种：

无参数 : 创建今天的日期和时间，例如： today = new Date();.
一个符合以下格式的表示日期的字符串:

“月 日, 年 时:分:秒.” 例如： var Xmas95 = new Date(“December 25, 1995 13:30:00”)。如果你省略时、分、秒，那么他们的值将被设置为0。
一个年，月，日的整型值的集合，例如： var Xmas95 = new Date(1995, 11, 25)。
一个年，月，日，时，分，秒的集合，例如： var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);.

2.Delete

delete操作符, 删除一个对象(an object)或一个对象的属性(an object’s property)或者一个数组中某一个键值，语法如下:

delete objectName;
delete objectName.property;
delete objectName[index];

你能使用 delete 删除各种各样的隐式声明(implicity declared)， 但是被var声明的除外

var a = 0; // 使用 var 声明的变量,不可以直接删除
delete a; // false

b = 0;
delete b; // true
console.log(b); // Uncaught ReferenceError: b is not defined

var c = {};
c.a = 0;
delete c.a; // true
console.log(c.a); // undefined

var d = [];
d.push(1);
d[1] = 2;
d[3] = 4;
console.log(d); //(4) [1, 2, undefined × 1, 4]
delete d[0]; //true
console.log(d); //(4) [undefined × 1, 2, undefined × 1, 4] 长度不变
//delete 删除数组中的一个元素, 这个元素就不在数组中了. 例如, d[0]被删除,d[0] 仍然可寻址并返回undefined.
console.log(d[0]); //undefined 值变成了 undefined
if(0 in d) { //第 0 个元素不在数组中了 
    // 这里不会执行到
}

// delete 与赋值 undefined 还是有所不同
d[0] = undefined;
if(0 in d) { //第 0 个元素在数组中了 
    // 这里会执行到
}

3.Number

以进制转换:
String To Number:

Number.parseInt(101); //101 默认为十进制解析
Number.parseInt("101"); //101
Number.parseInt(101, 2); //5 将以二进制解析
Number.parseInt("101", 2); //5

Number.parseInt("101", 8); //65 八进制
Number.parseInt("101", 16); //257 十六进制

Number To String:

(123).toString(); //"123"
123..toString(); //"123"
123..toString(2); //"1111011"
123..toString(8); //"173"
123..toString(16); //"7b"

4.Regexp

[\b]
匹配一个退格(U+0008)。（不要和\b混淆了。）

\b
匹配一个词的边界。一个词的边界就是一个词不被另外一个词跟随的位置或者不是另一个词汇字符前边的位置。注意，一个匹配的词的边界并不包含在匹配的内容中。换句话说，一个匹配的词的边界的内容的长度是0。（不要和[\b]混淆了）

\f 匹配一个换页符 (U+000C)。
\n 匹配一个换行符 (U+000A)。
\r 匹配一个回车符 (U+000D)。
\t 匹配一个水平制表符 (U+0009)。
\v 匹配一个垂直制表符 (U+000B)。

\n
当 n 是一个正整数，一个返回引用到最后一个与有n插入的正值表达式(counting left parentheses)匹配的副字符串。

比如 /apple(,)\sorange\1/ 匹配”apple, orange, cherry, peach.”中的’apple, orange,’ 这里的 \1 指前面的 (,)。

正则表达式可以被用于RegExp的exec和test方法以及 String的match、replace、search和split方法。但没有 replaceAll() 方法，Java中有，JS需要使用正则表达式 g 来实现相同的功能。

5.Closure

在循环中创建闭包：一个常见错误

在 ECMAScript 2015 引入 let 关键字 之前，闭包的一个常见的问题发生于在循环中创建闭包。参考下面的示例：

<p id="help">Helpful notes will appear here</p>
<p>E-mail: <input type="text" id="email" name="email"></p>
<p>Name: <input type="text" id="name" name="name"></p>
<p>Age: <input type="text" id="age" name="age"></p>

function setupHelp() {
  var helpText = [
      {'id': 'email', 'help': 'Your e-mail address'},
      {'id': 'name', 'help': 'Your full name'},
      {'id': 'age', 'help': 'Your age (you must be over 16)'}
    ];

  for (var i = 0; i < helpText.length; i++) {
    var item = helpText[i];
    document.getElementById(item.id).onfocus = function() {
      document.getElementById('help').innerHTML = item.help;
    }
  }
}

setupHelp();

运行这段代码后，您会发现它没有达到想要的效果。无论焦点在哪个输入域上，显示的都是关于年龄的消息。

该问题的原因在于赋给 onfocus是闭包（setupHelp）中的匿名函数而不是闭包对象；在闭包（setupHelp）中一共创建了三个匿名函数，但是它们都共享同一个环境（item）。在 onfocus 的回调被执行时，循环早已经完成，且此时 item 变量（由所有三个闭包所共享）已经指向了 helpText 列表中的最后一项。

解决这个问题的一种方案是使onfocus指向一个新的闭包对象。

function showHelp(help) {
  document.getElementById('help').innerHTML = help;
}

function setupHelp() {
  var helpText = [
      {'id': 'email', 'help': 'Your e-mail address'},
      {'id': 'name', 'help': 'Your full name'},
      {'id': 'age', 'help': 'Your age (you must be over 16)'}
    ];

  for (var i = 0; i < helpText.length; i++) {
    var item = helpText[i];
    document.getElementById(item.id).onfocus = (function(item) {
      return function() {
        document.getElementById('help').innerHTML = item.help;
      }
    })(item);
    /*document.getElementById(item.id).onfocus = function() {
      showHelp(item.help);
    }*/
  }
}

setupHelp();

这段代码可以如我们所期望的那样工作。所有的回调不再共享同一个环境，

下面进行解析说明：

另一种方法使用了匿名闭包：

function setupHelp() {
  var helpText = [
      {'id': 'email', 'help': 'Your e-mail address'},
      {'id': 'name', 'help': 'Your full name'},
      {'id': 'age', 'help': 'Your age (you must be over 16)'}
    ];

  for (var i = 0; i < helpText.length; i++) {
    (function() {
       var item = helpText[i];
       document.getElementById(item.id).onfocus = function() {
         document.getElementById('help').innerHTML = item.help;
       }
    })(); // Immediate event listener attachment with the current value of item (preserved until iteration).
  }
}

setupHelp();

若使用了 ES6，避免使用过多的闭包，可以用let关键词：

function setupHelp() {
  var helpText = [
      {'id': 'email', 'help': 'Your e-mail address'},
      {'id': 'name', 'help': 'Your full name'},
      {'id': 'age', 'help': 'Your age (you must be over 16)'}
    ];

  for (var i = 0; i < helpText.length; i++) {
    let item = helpText[i];
    document.getElementById(item.id).onfocus = function() {
      document.getElementById('help').innerHTML = item.help;
    }
  }
}

setupHelp();