资讯专栏INFORMATION COLUMN

You-Dont-Know-JS / Types & Grammar 笔记二

KitorinZero / 764人阅读

摘要:原文测试对象包装基础数据类型没有属性和方法,为了使用方法和函数,就需要对应的对象包装它。注意,用构造器构造的对象,永远是。它们都是对象。它们都是非空字符串。

原文

You Don"t Know JS: Types & Grammar

测试
console.log(1+ "2"+"2");
console.log(1+ +"2"+"2");
console.log("A"- "B"+"2");
console.log("A"- "B"+2);

122,32,NaN2,NaN

对象包装

String()

Number()

Boolean()

Array()

Object()

Function()

RegExp()

Date()

Error()

Symbol()

var a = new String( "abc" );

typeof a; // "object" ... not "String"

a instanceof String; // true

Object.prototype.toString.call( a ); // "[object String]"
console.log(a); // String {[[PrimitiveValue]]: "abc"}

基础数据类型没有属性和方法,为了使用方法和函数,就需要对应的对象包装它。JS可以自动做到这一点。

var a = "abc";

a.length; // 3
a.toUpperCase(); // "ABC"

注意,用构造器构造的对象,永远是“truthy”。

var a = new Boolean( false );

if (!a) {
    console.log( "Oops" ); // never runs
}
类型转换 ToString

默认调用toString()

[1,3,4]+"haha" // "1,3,4haha"
"haha" + {f:"da"} // "haha[object Object]"

{f:"da"}+"haha" // NaN
var f = {f:"da"}
f+"haha" // "[object Object]haha"

数组默认调用toString()

JSON字符串化,会忽略undefined,function,symbol,循环引用的对象还会报错。

JSON.stringify( 42 );    // "42"
JSON.stringify( "42" );    // ""42"" (a string with a quoted string value in it)
JSON.stringify( null );    // "null"
JSON.stringify( true );    // "true"

JSON.stringify( undefined );                    // undefined
JSON.stringify( function(){} );                    // undefined

JSON.stringify( [1,undefined,function(){},4] );    // "[1,null,null,4]"
JSON.stringify( { a:2, b:function(){} } );        // "{"a":2}"

JSON.stringify(obj, replacer, space)

ToNumber

true变成1,false变成0,undefined变成NaNnull变成0,""变成0,[]变成0

当进行数值计算时,数字型字符串变成数字,非数字型字符串变成NaN,对象先通过toSting()变成字符串,再参与计算。

[2]*2 // 4
[2,3]*2 // NaN
["2"]*2 // 4
"A"*2 // NaN
null+2 // 2
""*2 // 0
ToBoolean

falsy values

undefined

null

false

+0,-0,NaN

""

!!"" // false
!!"  " // true
""*1 // 0
"  "*1 // 0
var a = new Boolean( false );
var b = new Number( 0 );
var c = new String( "" );

var d = Boolean( a && b && c );

d; // true
var a = [];                // empty array -- truthy or falsy?
var b = {};                // empty object -- truthy or falsy?
var c = function(){};    // empty function -- truthy or falsy?

var d = Boolean( a && b && c );

d; // true

它们都是对象。

var a = "false";
var b = "0";
var c = """";

var d = Boolean( a && b && c );

d; // true

它们都是非空字符串。

var a = "false";
var b = "0";
var c = "";

var d = Boolean( a && b && c );

d; // false
Date To Number
var d = new Date( "Mon, 18 Aug 2014 08:53:06 CDT" );

+d; // 1408369986000

// or
var timestamp = +new Date();
var timestamp = new Date().getTime();
var timestamp = Date.now();
new Date().getDate() // 10
Date.now().getDay() // TypeError
Parsing Numeric Strings
var a = "42";
var b = "42px";

Number( a );    // 42
parseInt( a );    // 42

Number( b );    // NaN
parseInt( b );    // 42
parseInt("px42px"); // NaN

当传入的非字符串先转化为字符串,调用toString()

parseInt([14,2,3]) // 14
parseInt( new String( "42") ); // 42
var a = {
    num: 21,
    toString: function() { return String( this.num * 2 ); }
};

parseInt( a ); // 42
隐式转换
var a = {
    valueOf: function() { return 42; },
    toString: function() { return 4; }
};

a + "";            // "42"

String( a );    // "4"

[] + {} // "[object Object]"
{} + [] // 0
===== ==

In the ES5 spec, clauses 11.9.3.4-5 say:

If Type(x) is Number and Type(y) is String, return the result of the comparison x == ToNumber(y).
If Type(x) is String and Type(y) is Number, return the result of the comparison ToNumber(x) == y.
If Type(x) is Boolean, return the result of the comparison ToNumber(x) == y.
If Type(y) is Boolean, return the result of the comparison x == ToNumber(y).
If x is null and y is undefined, return true.
If x is undefined and y is null, return true.
If Type(x) is either String or Number and Type(y) is Object, return the result of the comparison x == ToPrimitive(y).
If Type(x) is Object and Type(y) is either String or Number, return the result of the comparison ToPrimitive(x) == y.

"0" == null;            // false
"0" == undefined;        // false
"0" == false;            // true -- UH OH!
"0" == NaN;                // false
"0" == 0;                // true
"0" == "";                // false

false == null;            // false
false == undefined;        // false
false == NaN;            // false
false == 0;                // true -- UH OH!
false == "";            // true -- UH OH!
false == [];            // true -- UH OH!
false == {};            // false

"" == null;                // false
"" == undefined;        // false
"" == NaN;                // false
"" == 0;                // true -- UH OH!
"" == [];                // true -- UH OH!
"" == {};                // false

0 == null;                // false
0 == undefined;            // false
0 == NaN;                // false
0 == [];                // true -- UH OH!
0 == {};                // false

疯狂的例子

[] == ![];        // true
2 == [2];        // true
"" == [null];    // true
0 == "
";        // true

来源:https://github.com/dorey/JavaScript-Equality-Table

比较
var a = [ 42 ];
var b = [ "43" ];

a < b;    // true
b < a;    // false
var a = [ "42" ];
var b = [ "043" ];

a < b;    // false
var a = [ 4, 2 ];
var b = [ 0, 4, 3 ];

a < b;    // false
var a = { b: 42 };
var b = { b: 43 };

a < b;    // false
a == b;    // false
a > b;    // false

a <= b;    // true
a >= b;    // true

Since b < a is also false, the result of a <= b is true.

var a = [ 42 ];
var b = "043";

a < b;                        // false -- string comparison!
Number( a ) < Number( b );    // true -- number comparison!

有必要改天重新整理下

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89702.html

相关文章

  • You-Dont-Know-JS / Types &amp; Grammar 笔记

    摘要:以下这个情况并非独有,任何采用二进制浮点数,依据都会如此这是因为用二进制浮点表示并不精确。是,不过更准确的定义应该是,,因为实际上它还是个。是声明变量的默认值。数字还有个特殊的数值数字和数字对象 原文 You Dont Know JS: Types & Grammar 类型 null undefined boolean number string object symbol -- a...

    Drummor 评论0 收藏0
  • 前端资源系列(4)-前端学习资源分享&amp;前端面试资源汇总

    摘要:特意对前端学习资源做一个汇总,方便自己学习查阅参考,和好友们共同进步。 特意对前端学习资源做一个汇总,方便自己学习查阅参考,和好友们共同进步。 本以为自己收藏的站点多,可以很快搞定,没想到一入汇总深似海。还有很多不足&遗漏的地方,欢迎补充。有错误的地方,还请斧正... 托管: welcome to git,欢迎交流,感谢star 有好友反应和斧正,会及时更新,平时业务工作时也会不定期更...

    princekin 评论0 收藏0
  • [你不知道的 JavaScript 类型和语法] 第一章:类型

    摘要:语言中规定的类型为以及。这两个值有不同的类型。内建类型定义了七种内建类型中新增提示以上类型,除的被称为基本类型。新增列出的六种类型的值都会返回一个对应类型名称的字符串。是中新增的数据类型,我们会在第三章详细介绍。 译者的前言 一直都想好好研究这个在 GitHub 上很有名气的系列,而翻译恰是最好的阅读途径之一。可以让我阅读的时候,不那么不求甚解。 图灵社区出版了该系列两部分的中文版——...

    Astrian 评论0 收藏0
  • Stack &amp; Queue 栈和队列的学习笔记

    摘要:的前部分内容讲的是栈和队列的实现。学习环境在学习这门课之前,先引入的概念,即抽象数据类型。链表实现学习,链表实现简单的数组实现链表实现简单的数组实现解决使用栈或者队列时,的数据类型指定问题。 Week2 的前部分内容讲的是栈和队列的Java实现。学习环境:mac, inteliJ, java version 1.8.0_77 在学习这门课之前,先引入Abstract Data Type...

    peixn 评论0 收藏0
  • Laravel 学习笔记之 Query Builder 源码解析(中)

    说明:本篇主要学习数据库连接阶段和编译SQL语句部分相关源码。实际上,上篇已经聊到Query Builder通过连接工厂类ConnectionFactory构造出了MySqlConnection实例(假设驱动driver是mysql),在该MySqlConnection中主要有三件利器:IlluminateDatabaseMysqlConnector;IlluminateDatabaseQuery...

    zhou_you 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<