怪异javascript解读

【SCSCMS】

下载

新闻

文章

怪异javascript解读

parseInt函数

parseInt('06'); // 6
parseInt('08'); // ie8及以下return 0 ；其他return 8
parseInt('010'); // ie8及以下return 8 ；其他return 10

parseInt(string[, radix]) 函数在ES3与ES5中表现不一样。当字符串以0开头时在ES3下默认以八进制解析，而ES5中以十进制解析。

x == !x

[] == ![];//true
[0] == ![0];//true

某个值等于自身的非还是比较少见的。原因在于任何对象在显性转布尔值时都是真，而执行非操作前对象会先自动执行toString()方法。

++赋值

[] == 0;    // true
+[] === 0;   // true
++[] === 1; // 报错 "赋值左侧无效"

[[]][0] === [];    // true
++[[]][0] === 1;    // true
++[[]][+[]] === 1;  // true!

如果你记住++、--（增量、减量运算符）必须是在数值里使用就好办了。+[]仅是把[]转成数字，而数组转数字会先转成字符串再转成数字。同时注意下标[]运算符号比++优先。

自动分号问题

function laugh(){
  return
  {
   haha: "ha!"
  }
}
laugh();// return nothing

var n = 1
/1*"\/\//.test(n + '"//');
console.log(n);//NaN

因随意分行造成return后自动添加了分号，而期望添加分号的反而没有添加。

prototype重写

(1) === 1; // true

Number.prototype.isOne = function () { return this === 1; };
(1).isOne(); // false!

Number.prototype.reallyIsOne = function () { return this - 1 === 0; };
(1).reallyIsOne(); // true

乍一看感觉不理解，明明是完全相等的为什么变成不相等了？原因是Number.prototype.isOne方法内的this已经不是数值基本类型，而是一个Number对象，所以不是完全相等。

alert.call.apply

alert.call.call.call.call.apply(function (a) {return a}, [1,2]) // return 2

这个怎么讲呢...

对象原始值默认调用

var foo = {
    toString: function () {
        return 5;
    },
    valueOf: function () {
        return "foo";
    }
};
alert(foo.toString() + 1); //显性调用方法
alert(foo + 1);  // "foo1" (默认调用toString)
alert(+foo);     // NaN (默认调用valueOf)

混乱的+-运算符

1 - - 1              // => 2
1 + + 1              // => 2
1 + - + 1            // => 0
1 + - + - + 1        // => 2
1 + - + - + - + 1    // => 0
1 + - + + + - + 1    // => 2
1 + / + + + / + 1    // => 1/ + + + /1

作为+运算符，在变量前起转数字功能，放在后面要么是连接符号或加法运算。最后一个主要是/ + + + /是一个正则表示式了，它转成字符串后再拼接起来。

parseInt魔法

parseInt("1", 10); // 1
parseInt("1 + 1", 10); // 1
parseInt("1" + "1", 10) // 11
parseInt("1" - "1", 10); // 0
parseInt(null, 24) === 23 // true

首先要明白parseInt并不是eval，它不会处理第一个参数字符串内的运算符，除非是表达式。针对最后一个作一下解释：以24进制去分解null时会先把null转成字符串"null"，由于n在24进制中排23，而u已经不在24进制范围，所以后面的全部忽略了。

Array数组

var a = new Array(4);
console.log(a);// [undefined, undefined, undefined, undefined]
console.log(a.lenght);//undefined
a.forEach(function(){
    //no run;
});
",,," == new Array(4); // true

js对象分为特殊对象（Function）无序对象（Object）有序对象（Array），无序对象是以字符串做键值的，有序对像是以有序数字做键值的。但是并不表示Array数组不能使用字符串做键值，其实数组也支持字符串甚至小数、负数做键值，只是做枚举时无法枚举而已。

Array(len)这种只是指定数组长度，但并没真实分配数组元素。它是没真实长度lenght和不能做循环枚举，如for,forEach,map等。

[1, 2, 4] < [1, 2, 5]   // true
[1, 3, 4] < [1, 2, 5]   // false
[1, 2, 3] === [1, 2, 3]  // false
[1, 2, 3] <  [1, 2, 3]  // false
[1, 2, 3] == [1, 2, 3]  // false
[1, 2, 3] >  [1, 2, 3]  // false
[1, 2, 3] <= [1, 2, 3]   // true
[1, 2, 3] >= [1, 2, 3]   // true

首先对象判断是否相等，是判断他们分别是否引用相同的内存地址。但判断大小就会转成字符串逐个判断。

toFixed

(42).toFixed(2); // "42.00"
42.toFixed(2); // SyntaxError: identifier starts immediately after numeric literal
42.88.toFixed(2); // "42.89"
42..toFixed(2); // "42.00"
42...toFixed(2); // SyntaxError: missing name after . operator

明显toFixed只支持小数形式，如果非小数必须使用变量或者括号来引用。

编码规范

var a = b = 1;
(function(){
    var a = b = 2;
}());
console.log(b);//2

本来函数内部变量外部是无法访问的，怎么外泄了？主要是var a = b = 1这种不规范的编码造成，其实b并没有使用到var使其变成全局变量。

标签ID属性

<div id="a"></div>
<script type="text/javascript">
    a.innerHTML = "a";        // --> the div is updated
    console.log(a);           // --> the div
    window.a = 1;             // Try to set the global var "a"
    console.log(a);           // --> 1
</script>

标签里使用的id属性，默认浏览器可以使用此ID来访问此标签，等于全部变量。但如果文档中含有var a变量定义时此标签的ID属性却不能访问了。而如果使用window.a来定义的话，在此定义之前仍能访问此节点，主要原因是变量提前问题。

字符串拼接

var a = "Why am I a " + typeof + "";
var b = /[/ + "javascript"[0] + '///';//肯定是 "/[/j///" ?!
console.log(a); // "Why am I a number"
console.log(b); // "/[/ + "javascript"[0] + '/"

+''会自动转成数字0。而b的值怪是因为变成正则字符串了，[]必须成对。如果把/[/改成/\[/那就不一样了。

正则表示式

/[A-z]/.test("m"); // true
/[A-z]/.test("D"); // true
/[A-z]/.test("\\"); // true WTF?

在正则表达式中[a-b]指的是a到b的范围内，比如[ -y]表示空格到y字符之间。

var re = /[A-z]/g,i = 0,z = [],s;
for (;i < 6000; i ++){
    s = String.fromCharCode(i);
    re.test(s) && z.push(s);
}
console.log(z);
  ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O",
  "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "[", "\", "]", "^",
  "_", "`", "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m",
  "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"]