JavaScript学习笔记(七) JSON和正则表达式字面量

JSON(Working with JSON)

在前面的笔记中提到过，不推荐盲目的使用eval()去解析JSON字符串，因为可能存在安全问题。

最好是使用JSON.parse()方法，这方法从ES5成为语言的一个标准，并且在绝大多数浏览器的JavaScript引擎都提供。

对于旧的JavaScript引擎，可以使用JSON.org库(http://www.json.org/json2.js)获得JSON对象和它的方法；

// an input JSON string
var jstr = '{"mykey": "my value"}';
// antipattern
var data = eval('(' + jstr + ')');
// preferred
var data = JSON.parse(jstr);
console.log(data.mykey); // "my value"

如果你已经使用了一个JavaScript类库，它可能已经提供了一个实用的转换JSON的方法，因此你不需要添加JSON.org库。

如何你用的是YUI3，你可以：

var jstr = '{"mykey": "my value"}';
// parse the string and turn it into an object
// using a YUI instance
YUI().use('json-parse',
function(Y) {
    var data = Y.JSON.parse(jstr);
    console.log(data.mykey); // "my value"
});

在jQuery中，有一个parseJSON()方法：

// an input JSON string
var jstr = '{"mykey": "my value"}';
var data = jQuery.parseJSON(jstr);
console.log(data.mykey); // "my value"

与JSON.parse()方法相反的就是JSON.stringify()，它接受一个对象或数组(或者基本类型)，将它序列化为一个字符串；

var dog = {
    name: "Fido",
    dob: new Date(),
    legs: [1, 2, 3, 4]
};
var jsonstr = JSON.stringify(dog);
// jsonstr is now:
// {"name":"Fido","dob":"2010-04-11T22:36:22.436Z","legs":[1,2,3,4]}

正则表达式字面量(Regular Expression Literal)

在JavaScript中，正则表达式也是对象，你有两种可选的方法去创建它们：

1.使用new RegExp()构造方法

2.使用正则表达式字面量

下面的简单的代码就是演示两种方法去创建匹配反斜杠(\)的正则表达式

// regular expression literal
var re = /\\/gm;
// constructor
var re = new RegExp("\\\\", "gm");

正如你看到的，正则表达式字面量方式更简洁，因此，应该优先使用字面量形式；

另外，当你使用RegExp()构造方法，你需要去转义引号而且你经常需要双重转义反斜杠；

在刚才的例子中，你需要四个反斜杠去匹配一个反斜杠，这会让你 的正则表达式更长并且更难读懂和修改；

正则表达式本来就很难懂，任何简化他们的机会都是受欢迎的，所以，最好坚持使用字面量形式。

正则表达式字面量语法(Regular Expression Literal Syntax)

正则表达式字面量形式使用斜杠(/)去包裹用于匹配的正则表达式；

紧跟着第二个斜杠，你可以写上模式修饰符；

• g 全局匹配
• m 多行匹配
• i 忽略大小写匹配

模式修饰符可以以任何顺序或组合出现：

var re = /pattern/gmi;

当我们调用方法时，使用正则表达式字面量可以帮助我们写出更加简洁的代码；

好比String.prototype.replace()，它接受一个正则表达式对象作为参数：

var no_letters = "abc123XYZ".replace(/[a-z]/gi, "");
console.log(no_letters); // 123

一个使用new RegExp()的原因就是匹配模式事先不知道，需要在运行时使用字符串创建；

正则表达式字面量和构造方法的另外一个区别就是；

字面量仅在第一次解析的时候创建一个对象，如何你一个循环中创建相同的正则表达式，前面创建的对象将会被返回；

下面这个例子说明了相同的对象是如何被返回两次的：

function getRE() {
    var re = /[a-z]/;
    re.foo = "bar";
    return re;
}
var reg = getRE(),
re2 = getRE();
console.log(reg === re2); // true
reg.foo = "baz";
console.log(re2.foo); // "baz"

不过，这种行为在ES5中已经改变，字面量形式也会创建新的对象。这种行为，在很多浏览器中也已经被纠正过来了，所以不能依赖它。

最后要注意的一点就是不使用new调用RegExp()(作为一个函数，而不是一个构造方法)和使用new调用是一样的。