变量中文.cn

第1章ECMAScript简介本章内容主要介绍ECMAScript的历史、版本以及语法特性和多种集成开发环境,让读者对ECMAScript有一个初步的认识,以便为后续学习打好基础.
1.
1概述成立于1961年之极具影响力的国际组织ECMA(EuropeanComputerManufacturersAssociation,欧洲制造商协会),现今专门制定信息和通信系统的标准与技术报告,以促进和规范信息通信技术与消费电子产品.
ECMA至今已经主动贡献了超过400个标准和100个技术报告,其中三分之二以上的部分,已在国际上得到了广泛的使用.
其中,由Ecma制定的ECMA-262(ISO/IEC16262)的ECMAScript,是具有商标的脚本编程语言(scriptprogramminglanguage)的规范.
1.
1.
1ECMAScript各版本从1997年6月的第1版,到2018年6月的第9版(ECMAScript9),已问世的ECMAScript各版本,主要被用来标准化JavaScript脚本编程语言.
目前业界的应用主要以ECMAScript5/6为主、ECMAScript7/8/9为辅.
从ECMAScript6开始的各版本存在如表1-1所示的昵称.
表1-1ECMAScript的各版本正式名称版本昵称缩写昵称ECMAScript2015ECMAScript6ES2015、ES6ECMAScript2016ECMAScript7ES2016、ES7ECMAScript2017ECMAScript8ES2017、ES8ECMAScript2018ECMAScript9ES2018、ES92|JavaScript编程思想:从ES5到ES91.
1.
2关于JavaScript可简称为JS的JavaScript,是一个动态高级解释脚本编程语言(dynamichigh-levelinterpretingscriptingprogramminglanguage).
对于万维网而言,HTML、CSS与JavaScript并列为网页制作的核心编程语言.
JavaScript主要用来实现网页程序的用户交互机制(interactivemechanism),并通过ECMAScript规范,被创建和内置于网页浏览器(webbrowser)的JavaScript引擎中.
JavaScript支持事件驱动(event-driven)、函数调用(functioninvocation/call)、面向对象编程(OOP,object-orientedprogramming)等特性,并具备处理文本、数组、日期、正则表达式(regularexpression)和文档对象模型(DOM,documentobjectmodel)的应用程序编程接口(API,applicationprogramminginterface).
JavaScript引擎早期仅实现于网页浏览器当中,现今则被实现于其他类型的软件里,例如网页服务器、数据库服务器、文字处理器,以及用来编写移动或桌面应用程序的集成开发环境(IDE,integrateddevelopmentenvironment)等软件里.
1.
1.
3其他脚本语言通过ECMAScript规范实现的编程语言,除了JavaScript之外,主要还有Adobe的ActionScript和Microsoft的JScript,其语法非常相似于JavaScript.
JScript被用于InternetExplorer浏览器,ActionScript主要被用于AdobeAnimateCC集成开发环境中.
1.
2语法的实现计算机编程语言的语法是一种规则,用来定义此编程语言表面形式的符号组合,以正确组成此语言的源代码(sourcecode),进而堆砌成为片段或文件.
1.
2.
1源代码源代码(sourcecode)通常以纯文本方式,存在于文档里,并作为输入数据,由汇编器(assembler)、编译器(compiler)或解释器(interpreter),转换成计算机可理解的二进制机器代码(machinecode).
通过经常阅读他人编写的源代码,计算机程序员可增进其编程技术的成熟度.
因此,开发者互相分享源代码,可算是对彼此的一种贡献.
移植特定软件到其他计算机平台上,通常是异常困难的.
然而,若有此软件的源代码,移植任务就会变得简单许多.
第1章ECMAScript简介|31.
2.
2语句在计算机编程当中,语句(statement)是命令式编程语言的语法单元,以表示欲指示计算机进行的一连串动作.
JavaScript编程语言的语句大致分为简单语句(simplestatement)和复合语句(compoundstatement)两种形式.
1.
简单语句简单语句的末尾应该加上分号,例如:(1)letv01,v02;变量v01与v02的声明.
(2)varlist01=['apple','banana','cherry'];数组变量list01的声明与数据设置.
(3)profile={name:'Alex',gender:'male',age:'40'};对象变量profile的数据设置.
(4)document.
writeln('worldpeace');写入带有文本"worldpeace"的h3元素实例到当前网页里.
(5)confirm('Areyousuretodeleteit');在网页上,显示带有"Areyousuretodeleteit"信息并带有确认按钮和取消按钮的模式对话框.
(6)username.
style.
color='RoyalBlue';设置id为username元素实例的颜色样式为宝蓝色.
(7)break;中断循环语句(loopstatement),或确认切换语句(switchstatement)的分支(branch).
(8)continue;在循环语句中,终止当前的循环,并立即进行下一次的循环.
(10)debugger;4|JavaScript编程思想:从ES5到ES9设置调试断点(breakpoint),以暂停后续源代码的执行,并启动调试机制.
(11)"usestrict";限制以严格模式执行源代码.
(12)returnresult;终止函数的执行,并返回变量result的数据.
2.
复合语句复合语句大都带有一对大括号,例如:(1)letresult=0;alert("You'rewelcome!
");{letnum01=75,num02=64;result=num01+num02;}在前述大括号中的源代码,连同大括号在内,可被称为复合语句.
其中,变量num01与num02只有在大括号里才允许被访问.
(2)with(send_button.
style){color='Gold';backgroundColor='DodgerBlue';fontSize='1.
5em';}with复合语句包含一对大括号,并且可以简化对象实例属性的访问语法.
在此,【send_button.
style.
color='Gold';】的语句,在复合语句【with(send_button.
style)】的大括号里,可被简化为【color='Gold';】.
(3)if(score>=60){passer_count++;saying='Youhavepassed!
';}if条件复合语句可包含一对大括号,当小括号里的条件【(score>=60)】为真时,大括号里的各语句就会被执行.
(4)for(leti=0;iy检验若变量x的数值大于y的数值,则返回布尔值true.
(2)x0||b>0||c>0检验若变量a的数值大于0、变量b的数值大于0,或是变量c的数值大于0,则返回布尔值true.
(4)!
(v01>60||v02>=90)&&v03>=80检验若【并非变量v01的数值大于60,或是变量v02的数值大于或等于90】,并且【变量v03的数值大于或等于80】,则返回布尔值true.
(5)name=='admin'&&/^\w{6,}$/.
test(password)检验若变量name的数据等于字符串字面量"admin",并且变量password的数据是由【0~9】、【大小写a~z】与【下画线_】所构成的最少6个字符的字符串,则返回布尔值true.
4.
主要表达式(primaryexpression)例如:(1)letcircle_area=function(r){letresult;result=Math.
PI*r**2console.
log(`Thecircleareaofradius${r}=${result}`);returnresult;};在所谓的函数表达式(functionexpression)中,通过关键字function,定义匿名函数(anonymousfunction),并以变量的名称circle_area,作为匿名函数的别名(alias).
(2)letCubic=class8|JavaScript编程思想:从ES5到ES9{constructor(l,w,h){this.
length=l;this.
width=w;this.
height=h;}volume(l=this.
length,w=this.
width,h=this.
height){returnl*w*h;}surface_area(l=this.
length,w=this.
width,h=this.
height){return2*(l*w+w*h+h*l);}};在所谓的类表达式(classexpression)中,通过关键字class,定义匿名类(anonymousclass),并以变量的名称Cubic作为匿名类的别名.
(3)letnumber_list=[15,30,75,90,180];console.
log(number_list[2]);number_list[5]=770;这3个语句均可被视为主要表达式.
在等号右侧,没有变量名称的一对中括号,是用来定义数组实例[15,30,75,90,180],并赋给等号左侧的数组变量number_list.
在等号左侧,变量名称衔接的一对中括号,则用来访问数组变量number_list中特定索引值(2与5)对应的元素值(75与770).
(4)varuser_input='z1=x1^2+y1*3+6';varpattern=/[a-zA-Z]\d/g;varmatches=user_input.
match(pattern);console.
log(matches);这4个语句均可被视为主要表达式.
在此,通过一对斜杠符号【/】,创建用来匹配特定模式【由字母开头,后接一个数字的文本】的正则表达式字面量(regular-expressionliteral)【/[a-zA-Z]\d/g】,并赋给等号左侧的变量pattern.
5.
箭头函数表达式(arrowfunctionexpression)箭头函数表达式存在如下几种形式.
(1)(参数列)通过带有参数列的一对小括号,衔接代表箭头符号的【=>】,与内含主体源代码的一对大括号,以定义没有名称、但可带有多个参数的箭头函数(arrowfunction).
(2)单一参数名称第1章ECMAScript简介|9通过单一参数,衔接代表箭头符号的【=>】,与内含主体源代码的一对大括号,以定义没有名称、仅有一个参数的箭头函数.
(3)单一参数名称=>单一语句;通过单一参数,衔接代表箭头符号的【=>】,和单一语句的主体源代码,以定义没有名称、仅有一个参数和语句的箭头函数.
(4)通过不带任何参数的一对小括号,衔接代表箭头符号的【=>】,与内含主体源代码的一对大括号,以定义没有名称和参数的箭头函数.
(5)()=>单一语句;通过不带任何参数的一对小括号,衔接代表箭头符号的【=>】,和单一语句的主体源代码,以定义没有名称与参数、仅有单一语句的箭头函数.
6.
左侧表达式(left-handexpression)例如:(1)profile.
name='Jasper';通过点号【.
】,将字符串字面量'Jasper',赋给变量profile的实例属性name.
(2)profile['age']=28;借助一对中括号,将整数值28赋给变量profile的实例属性age.
(3)super(10,15);通过关键字super与一对小括号,调用父类(parentclass)的构造函数(constructor),并传入参数值10和15.
(4)super.
cylinder_volume(10,15);借助关键字super、点号与一对小括号,调用在父类中作为成员函数(memberfunction)的函数cylinder_volume(),并传入参数值10和15.
(5)x=x+3;在等号的左侧,设置变量x,并将变量x的数值加上3的结果值,赋给变量x本身.
10|JavaScript编程思想:从ES5到ES9(6)[a,b]=[7,13];在等号的左侧,编写内含变量a与b的一对中括号,并将右侧另一对中括号里的整数值7与13,分别赋给变量a与b.
(7)[c,d]=[a+3,b+7];在等号的左侧,编写内含变量c和d的一对中括号,并将右侧另一对中括号里的a+3与b+7的结果值,分别赋给变量a与b.
1.
2.
4子程序在计算机编程中,子程序(subroutine)也可被称为函数(function)或方法(method),即是可重复被调用(call/invocation),以重新执行特定任务的一连串程序指令单元,进而节省开发与维护的成本,并提高质量与可靠性.
JavaScript编程语言中的子程序,主要被称为函数,可通过以下语法来加以定义.
(1)functionsphere(r){values={};values.
volume=4/3*Math.
PI*Math.
pow(r,3);values.
surface_area=4*Math.
PI*r*r;returnvalues;}上述源代码是定义函数的标准语法.
通过调用【sphere(10)】,可计算并返回【内含半径为10的球体积和球体表面积】相关数据的对象实例.
(2)display=function(){console.
log('Variable-typedisplaying.
');};上述源代码是所谓的函数表达式,使得变量display具备函数的特征.
通过调用【display()】,可在网页浏览器的调试工具【Console】面板中,显示【Variable-typedisplaying】的信息.
(3)sphere_volume=r=>{return4/3*Math.
PI*Math.
pow(r,3)};上述源代码中的简洁语法,等同于定义了函数sphere_volume().
通过调用【sphere_volume(30)】,可计算并返回半径为30的球体积的结果值.
第1章ECMAScript简介|111.
2.
5注释在源代码里,注释(comment)是用来辅助程序员,加以理解各源代码片段的意义和用途,却不会被计算机加以执行的文本.
JavaScript编程语言的注释方式有如下两种.
(1)在注释文本的行首,加上紧连的两个斜杠符号【//】.
例如://calculatethesummaryvaluesforbonustable.
(2)在注释文本的开头,加上紧连的斜杠符号与星号【/*】,并在注释文本的末尾,加上紧连的星号与斜杠符号【*/】.
例如:/*ca(r)calculatescircleareaofradiusr.
ssa(r)calculatesspheresurfaceareaofradiusr.
cv(r,h)calculatescylindervolumeofradiusrandheighth.
*/1.
2.
6关键字在计算机编程语言中,被称为保留字(reservedword)的关键字(keyword),不能或不应该作为常量、变量、属性、函数/方法的标识符(identifier)/名称(name)的词汇.
JavaScript编程语言的关键字如表1-2所示.
表1-2JavaScript的关键字关键字关键字关键字关键字关键字abstractargumentsawaitbooleanbreakbytecasecatchcharclassconstcontinuedebuggerdefaultdeletedodoubleelseenumevalexportextendsfalsefinalfinallyfloatforfunctiongotoifimplementsimportinInfinityinstanceofintinterfaceletlongNaNnativenewnullpackageprivateprotectedpublicreturnshortstaticsuperswitchsynchronizedthisthrowthrowstransienttruetrytypeofundefinedvarvoidvolatilewhilewithyield12|JavaScript编程思想:从ES5到ES91.
3开发环境目前,知名的JavaScript集成开发环境(IDE,integrateddevelopmentenvironment)有如下几种.
1.
存在免费版本的VisualStudioCommunity或VisualStudioCodehttps://www.
visualstudio.
com/zh-hans/downloadsEclipsehttp://www.
eclipse.
org/downloads/eclipse-packagesIntelliJIDEAhttps://www.
jetbrains.
com/ideaNetBeansIDEhttps://netbeans.
orgSublimeTexthttps://www.
sublimetext.
comAtomIDEhttps://ide.
atom.
ioBracketshttp://brackets.
ioCloud9(在线系统)https://aws.
amazon.
com/cn/cloud9Codeanywhere(在线系统)https://codeanywhere.
com2.
仅有付费版本的WebStormhttps://www.
jetbrains.
com/webstormKomodoIDEhttps://www.
activestate.
com/komodo-ideJavaScript编程语言主要用于开发网页相关应用程序,所以,网页浏览器成为执行与调试JavaScript源代码的主要软件.
因此,上述各个集成开发环境所产生的内含JavaScript源代码的网页应用,最终仍然在网页浏览器或其他内置JavaScript引擎的软件上,被进行必要的调试与执行.
第1章ECMAScript简介|131.
3.
1浏览器网页浏览器(webbrowser)是用来检索与呈现网络上信息资源(文本信息、图像、音频、视频、动画)的软件.
现今较流行的网页浏览器为GoogleChrome、MozillaFirefox、Opera、AppleSafari、与MicrosoftEdge.
上述的网页浏览器皆内置JavaScript调试工具.
以GoogleChrome浏览器为例,启动Chrome并按下Ctrl+Shift+I/J快捷键之后,即可看到如图1-1所示的开发者工具调试窗格.
图1-1为了能顺利显示其JavaScript源代码于调试窗口中,可执行如下操作步骤.
在Chrome浏览器,打开配书源代码示例文档中的网页文档【js_tester.
html】.
按Ctrl+Shift+I快捷键,启动【开发者工具】,并可看到默认显示的Console(控制台)窗口.
请先按Ctrl+R快捷键,以刷新页面,再单击网页中的【选择文件】按钮,并选择JavaScript源代码文档【js/19-3-2-debugging-mechanism.
js】之后,可在按钮右侧,明确看到被选定的文档名称和【Pausedindebugger】信息.
观察调试窗口的变化,从【Console】面板,自动切换至【Source】面板中.
14|JavaScript编程思想:从ES5到ES9被读取的【19-3-2-debugging-mechanism.
js】内含的源代码片段【debugger;】用来设置调试断点(debuggingbreakpoint),使得浏览器启动调试机制,进而自动切换至【Source】面板中,并在第1个断点上,暂停JavaScript源代码的执行,如图1-2所示.
图1-2关于JavaScript源代码的相关调试,笔者将深入说明于本书19.
3节.
关于操作扩展名亦为【.
js】的【其他】示例文档,请完成至前述第3步即可.
至于操作扩展名为【.
html】的示例文档,则直接通过浏览器,加载并浏览其网页内容.
接着,观察特定扩展名为【.
html】的示例文档,出现在浏览器中的网页内容,以及在【Console】面板里的对应信息,可进一步理解各个HTML、CSS和JavaScript源代码片段的工作原理.
1.
3.
2Node.
js如同【ASP.
NET】并非代表扩展名(fileextension)为【.
NET】的文档名称一样,Node.
js实际上亦不是代表JavaScript源代码的文档名称,而是开源且跨平台的运行期环境(run-timeenvironment),并用于执行服务器端的JavaScript源代码,以生成动态的网页内容.
因此,对于主要借助JavaScript编程语言,整合前端(front-end)与后端(back-end)Web应用程序开发的任务而言,Node.
js如今已然成为基本要素之一.
此外,Node.
js具备事件驱动(event-driven)的运行架构,可实现数据异步的传递与接收,进而优化Web应用程序的处理能力和扩充灵活性.
1.
3.
3其他JavaScriptShell通过特定JavaScriptShell的协助,可在不刷新特定网页内容的情况下,辅助开发与调试JavaScript源代码.
较有名的JavaScriptShell有如下几种:第1章ECMAScript简介|15Node.
jshttps://nodejs.
orgJSDBhttp://www.
jsdb.
orgJavaLikeScripthttp://javalikescript.
free.
frGLUEscripthttp://gluescript.
sourceforge.
netjsplhttp://jspl.
msg.
mxShellJShttp://documentup.
com/shelljs/shelljs1.
4练习题1.
截至2018年,ECMAScript总共有几个版本2.
可被并列为网页制作的核心编程语言,除了JavaScript之外,还包括什么语言3.
网页浏览器相对应的英文短语是什么4.
除了JavaScript之外,通过ECMAScript规范实现的编程语言主要还有哪两个5.
依序翻译在编程语言中的专有名词:machinecode、sourcecode、programminglanguage、syntax、subroutine、variable、constant和invocation.
6.
依序翻译在编程语言中的专有名词:assembler、compiler和interpreter.
7.
在如下的源代码片段里,有哪些简单语句with(send_button.
style){color='Gold';backgroundColor='DodgerBlue';fontSize='1.
5em';}8.
在如下的源代码片段里,有哪些简单语句for(leti=0;i60||v02>=90)&&v03>=8012.
在如下源代码片段里,存在哪些不同的常量letnumber_list=[15,30,75,90,180];console.
log(number_list[2]);number_list[5]=770;13.
在如下源代码片段里,存在哪些不同的常量letuser_input='z1=x1^2+y1*3+6';letpattern=/[a-zA-Z]\d/g;letmatches=user_input.
match(pattern);console.
log(matches);14.
在JavaScript语言里,如何调用如下被定义的函数,进而将半径为50的球体积和球体表面积,赋给变量resultfunctionsphere(r){values={};values.
volume=4/3*Math.
PI*Math.
pow(r,3);values.
surface_area=4*Math.
PI*r*r;returnvalues;}15.
在JavaScript语言里,下列哪些可以作为变量的名称catchup、extends、finally、super、class、import、export和throw16.
特定网页被浏览于GoogleChrome浏览器窗口内时,有什么方式可以快速显示出浏览器开发者工具的Console面板第2章表达式与运算符本章内容主要介绍构成表达式的要素,包括常量、变量、子表达式、函数的返回值等形式的操作数,以及多种不同的运算符.
2.
1操作数编程语言中的表达式主要由操作数(operand)和运算符(operator)构成.
其中,操作数可以是常量(constant)、变量(variable)、子表达式(subsidiaryexpression)或是特定函数(function)的返回值(returnvalue).
2.
1.
1常量(ES6)在各种编程语言中,常量(constant)是指固定而明确的数据.
例如:(1)整数(integer)常量:25、770、-110.
(2)浮点数(floating-pointnumber)常量:25.
625、-23.
71、Math.
PI、Math.
LN2、Math.
SQRT2.
(3)字符串(string)的字面量(literal):'Alex'、"HappilyEverAfter"(4)正则表达式(regularexpression)的字面量:/\w+\s*.
(\w\d+){1,3}/g、/^\w{2}\d{5}\s*$/.
(5)布尔(boolean)常量:true、false.
(6)原始(primitive)常量:NaN、null、undefined.
(7)编程人员在源代码中,自行声明(declare/declaration)的常量,可简称为自声明常量.
例如在源代码片段【constnum01=157,num02=268;】中,num01和num02即是自声明常量.
关于自声明常量,可参考如下示例.
18|JavaScript编程思想:从ES5到ES9【2-1-1-constants.
js】constE=299792458;console.
log('Speedoflightisgreaterthan2.
9E8',E>2.
9e8);【相关说明】constE=299792458;声明数值为299792458的常量E.
console.
log('Speedoflightisgreaterthan2.
9E8',E>2.
9e8);在浏览器调试工具的【Console】面板里显示出【Speedoflightisgreaterthan2.
9E8true】的信息.
其中,2.
9e8代表2.
9*108,也就是290000000.
所以,【E>2.
9e8】等价于【E>290000000】,会返回布尔值true,这是因为自声明常量E的数值为299792458,大于290000000.
在上述简短的源代码中,常量E刻意被声明成整数常量299792458,因此常量E在源代码的运行期间,不可被变更为其他数据.
2.
1.
2变量(ES6)在各种编程语言中,变量(variable)的标识符(identifier)/名称(name)用来识别特定存储位置中的可变数据.
所谓的可变,是指在运行期间,其数据是可被变更的.
在JavaScript语言中,变量的作用范围(scope)大致可如下区分:全局(global)范围局部(local)范围块(block)范围下面通过示例,介绍如何运用全局范围和局部范围的变量.
【2-1-2-e1-global-and-local-scope-variables.
js】letstart=123;constSTEP=3;varresult=0;functionsome_steps(step_count=1){varoutput;//orletoutput;output=start+STEP*step_count;console.
log(`infunction:start=${start},STEP=${STEP},result=${result}`);console.
log(`infunction:output=${output}\n\n`);returnoutput;}result=some_steps(5);第2章表达式与运算符|19console.
log(`outer:start=${start},step=${STEP},result=${result}`);console.
log(`outer:output=${output}`);【相关说明】letstart=123;constSTEP=3;varresult=0;声明全局范围的变量start与result,以及全局范围的自声明常量STEP.
既然是全局范围的变量和常量,即可让后续的任意表达式,加以访问.
STEP是一个常量,所以在后续的源代码里,无法被赋予新数据.
functionsome_steps(step_count=1){varoutput;//orletoutput;output=start+STEP*step_count;console.
log(`infunction:start=${start},step=${STEP},result=${result}`);console.
log(`infunction:output=${output}\n\n`);returnoutput;}定义函数some_steps(),并在内部声明局部范围的变量output.
既然是局部范围的,变量output只能在函数some_steps()内部被访问.
变量output接着被赋予【带有全局范围变量start和常量STEP】的表达式的结果值.
这个函数内部的多条语句,访问了全局范围的变量start、常量STEP,以及局部范围的变量output.
result=some_steps(5);console.
log(`outer:start=${start},step=${STEP},result=${result}`);访问全局范围的变量start、result与常量STEP.
console.
log(`outer:output=${output}`);因为访问了函数some_steps()内的局部范围的变量output,所以会显示出错误信息【UncaughtReferenceError:outputisnotdefined】.
关于块范围的理解,可参考如下示例.
【2-1-2-e2-block-scope-variables.
js】//differentheightsmeasuredinmeters.
{//heightofthebuilding.
letheight=100;{//heightofonefloor.
letheight=4;{//heightofaroom.
letheight=3;20|JavaScript编程思想:从ES5到ES9{//heightofadesk.
letheight=1;console.
log('heightofadesk=',height);}console.
log('heightofaroom=',height);}console.
log('heightofonefloor=',height);}console.
log('heightofthebuilding=',height);}console.
log('');for(varm=1;m2*Math.
PI*r;circle_area=r=>Math.
PI*Math.
pow(r,2);sphere_volume=r=>4/3*Math.
PI*Math.
pow(r,3);cylinder_volume=(r,h)=>circle_area(r)*h;cylinder_surface_area=(r,h)=>2*circle_area(r)+circumference(r)*h;rounded_circle_area=circle_area(10).
toFixed(3);rounded_cylinder_volume=cylinder_volume(10,20).
toFixed(3);rounded_cylinder_surface_area=cylinder_surface_area(10,20).
toFixed(3);console.
log(rounded_circle_area);console.
log(rounded_cylinder_volume);console.
log(rounded_cylinder_surface_area);【相关说明】varr=10;此语句内含左侧表达式.
varvolume=4/3*Math.
PI*Math.
pow(r,3);此主要表达式内含如下子表达式:左侧表达式:【varvolume=】和【Math.
】算术表达式:【4/3*Math.
PI*Math.
pow(r,3)】主要表达式:【Math.
PI】和【Math.
pow(r,3)】circumference=r=>2*Math.
PI*r;此主要表达式内含如下子表达式:左侧表达式:【circumference=】和【Math.
】箭头函数表达式:【r=>2*Math.
PI*r】算术表达式:【2*Math.
PI*r】主要表达式:【Math.
PI】circle_area=r=>Math.
PI*Math.
pow(r,2);此表达式内含如下子表达式:24|JavaScript编程思想:从ES5到ES9左侧表达式:【circle_area=】和【Math.
】箭头函数表达式:【r=>Math.
PI*Math.
pow(r,2)】算术表达式:【Math.
PI*Math.
pow(r,2)】主要表达式:【Math.
PI】和【Math.
pow(r,2)】sphere_volume=r=>4/3*Math.
PI*Math.
pow(r,3);此表达式内含如下子表达式:左侧表达式:【sphere_volume=】和【Math.
】箭头函数表达式:【r=>4/3*Math.
PI*Math.
pow(r,3)】算术表达式:【4/3*Math.
PI*Math.
pow(r,3)】主要表达式:【Math.
PI】和【Math.
pow(r,3)】cylinder_volume=(r,h)=>circle_area(r)*h;此表达式内含如下子表达式:左侧表达式:【cylinder_volume=】箭头函数表达式:【(r,h)=>circle_area(r)*h】算术表达式:【circle_area(r)*h】主要表达式:【circle_area(r)】cylinder_surface_area=(r,h)=>2*circle_area(r)+circumference(r)*h;此表达式内含如下子表达式:左侧表达式:【cylinder_surface_area=】箭头函数表达式:【(r,h)=>2*circle_area(r)+circumference(r)*h】算术表达式:【2*circle_area(r)+circumference(r)*h】主要表达式:【circle_area(r)】和【circumference(r)】rounded_circle_area=circle_area(10).
toFixed(3);此表达式内含如下子表达式:左侧表达式:【rounded_circle_area=】和【circle_area(10).
】主要表达式:【circle_area(10).
toFixed(3)】、【circle_area(10)】和【toFixed(3)】rounded_cylinder_volume=cylinder_volume(10,20).
toFixed(3);此表达式内含如下子表达式:左侧表达式:【rounded_cylinder_volume=】和【cylinder_volume(10,20).
】主要表达式:【cylinder_volume(10,20).
toFixed(3)】、【cylinder_volume(10,20)】和【toFixed(3)】rounded_cylinder_surface_area=cylinder_surface_area(10,20).
toFixed(3);此表达式内含如下子表达式:第2章表达式与运算符|25左侧表达式:【rounded_cylinder_surface_area=】和【cylinder_surface_area(10,20).
】主要表达式:【cylinder_surface_area(10,20).
toFixed(3)】、【cylinder_surface_area(10,20)】和【toFixed(3)】console.
log(rounded_circle_area);console.
log(rounded_cylinder_volume);console.
log(rounded_cylinder_surface_area);如上3个语句排除分号【;】的其余部分,皆为主要表达式.
2.
1.
4函数的返回值在多种编程语言中,关键字return开头的语句,除了会终止当前函数内源代码的执行,并返回调用函数的子表达式之外,亦会使得前述子表达式,被取代成为返回值(returnvalue),成为原始表达式的操作数.
关于返回值的理解,可参考如下示例.
【2-1-4-function-return-values.
js】//cvstandsfor"cubicvolume".
functioncv01(l,w,h){letcubic_volume=l*w*h;console.
log(`cubicvolumeof(${l},${w},${h})=${cubic_volume}`);//return;}functioncv02(l,w,h){letcubic_volume=l*w*h;returncubic_volume;}letresult01=cv01(3,5,10);letresult02=cv02(3,5,10);letresult03=cv02(1,3,5)+cv02(2,4,6);console.
log(`result01=${result01}`);console.
log(`result02=${result02}`);console.
log(`result03=${result03}`);【相关说明】//cvstandsfor"cubicvolume".
functioncv01(l,w,h){letcubic_volume=l*w*h;console.
log(`cubicvolumeof(${l},${w},${h})=${cubic_volume}`);26|JavaScript编程思想:从ES5到ES9//return;}在上述函数内的末尾处,并未放置return语句,或是return语句仅仅衔接分号【;】.
所以,此段源代码定义了未带返回值的函数cv01().
函数cv01()可在网页浏览器的调试工具【Console】面板里,显示出长、宽、高可能不同的立方体积.
functioncv02(l,w,h){letcubic_volume=l*w*h;returncubic_volume;}此源代码片段定义了具有返回值的函数cv02(),因为在上述函数内的末尾处,放置了语句【returncubic_volume;】.
函数cv02()亦可计算出长、宽、高可能不同的立方体积.
letresult01=cv01(3,5,10);此语句调用了函数cv01(3,5,10),显示出长、宽、高各为3、5、10的立方体积.
因为函数cv01()并无返回值,所以变量result01会被赋予原始常量undefined.
letresult02=cv02(3,5,10);此语句调用了函数cv02(3,5,10),并将长、宽、高各为3、5、10的立方体积结果值,返回到此语句,成为新的操作数150,使得此语句等价于【letresult02=150;】,进而让变量result02的数值变成150.
letresult03=cv02(1,3,5)+cv02(2,4,6);此语句调用了函数cv02(1,3,5)和cv02(2,4,6),并将长、宽、高各为1、3、5与2、4、6的个别立方体积结果值,返回到此语句,成为新的操作数15与48,使得此语句等价于【letresult02=15+48;】,进而让变量result02的数值变成63.
console.
log(`result01=${result01}`);此语句显示出变量result01的数据为undefined.
console.
log(`result02=${result02}`);console.
log(`result03=${result03}`);这两个语句分别显示出变量result02的数值150,以及变量result03的数值63.
2.
2运算符各种计算机编程语言均支持一系列的运算符,并和参与其中的操作数,构成特定形态的表达式,以满足计算机各种复杂的演算、分析与归纳.
第2章表达式与运算符|272.
2.
1算术运算符(ES7)JavaScript语言的算术运算符如表2-1所示.
表2-1JavaScript的运算符运算符分类运算符加法运算符(additionoperator)或一元正号运算符(unaryplusoperator)+减法运算符(subtractionoperator)或一元负号运算符(unarynegationoperator)-乘法运算符(multiplicationoperator)*除法运算符(divisionoperator)/求余运算符(remainderoperator)%求幂运算符(exponentiationoperator)**递增运算符(incrementoperator)++递减运算符(decrementoperator)--下面通过示例介绍各种算术运算符的运用.
【2-2-1-arithmetic-operators.
js】letnum01=125,num02=10,num03=5;letresult=0;result=num01%num02;console.
log(result);result=num01/num02;console.
log(result);result=num01*num02;console.
log(result);result=num01+num02-num03;console.
log(result);result=++num01;console.
log(result,num01);result=num01++;console.
log(result,num01);++num01;num01++;console.
log(num01);num01+=1;console.
log(num01);num01=num01+1;console.
log(num01);result=--num02;28|JavaScript编程思想:从ES5到ES9console.
log(result,num02);result=num02--;console.
log(result,num02);--num02;num02--;console.
log(num02);num02-=1;num02=num02-1;console.
log(num02);result=num03**3**2;console.
log(result);result=num03**(3**2);console.
log(result);result=(num03**3)**2;console.
log(result);【相关说明】letnum01=125,num02=10,num03=5;letresult=0;这两个语句声明了具有初始数据的变量num01、num02、num03与result.
result=num01%num02;此语句使得变量result,被赋予了【变量num01的数值除以变量num02的数值】的余数.
result=num01/num02;此语句使得变量result,被赋予了【变量num01的数值除以变量num02的数值】的结果值.
result=num01*num02;此语句使得变量result,被赋予了【变量num01的数值乘以变量num02的数值】的结果值.
result=num01+num02-num03;此语句使得变量result,被赋予了【变量num01的数值加上变量num02的数值,再减去变量num03的数值】的结果值.
result=++num01;此语句被执行之前,变量num01的数值为125.
因为运算符++出现在变量num01的左侧,也就意味着num01的数值要先递增为126,再执行【result=num01】.
所以,result的数值最终为126.
result=num01++;此语句被执行之前,变量num01的数值已经变成126.
第2章表达式与运算符|29因为运算符++出现在变量num01的右侧,也就意味着要先执行【result=num01】,之后num01的数值才递增为127.
所以,result的数值最终仍然为126.
++num01;num01++;这两个语句被执行之前,变量num01的数值已经变成127.
因为表达式++num01与num01++均单独出现在语句中,所以可简单视为变量num01的数值,被进行了2次递增,变成129.
num01+=1;此语句被执行之前,变量num01的数值已经变成129.
此语句等同于递增变量num01的数值,使得num01的数值成为130.
num01=num01+1;此语句被执行之前,变量num01的数值已经变成130.
此语句亦等同于递增变量num01的数值,成为131.
result=--num02;此语句被执行之前,变量num02的数值为10.
因为运算符--出现在变量num02的左侧,也就意味着num02的数值要先递减为9,再执行【result=num02】.
所以,result的数值最终为9.
result=num02--;此语句被执行之前,变量num02的数值已经变成9.
因为运算符--出现在变量num02的右侧,也就意味着要先执行【result=num02】,之后num02的数值才递减为8.
所以,result的数值最终仍然为9.
--num02;num02--;这两个语句被执行之前,变量num02的数值已经变成8.
因为运算符--num02与num02--均单独出现在语句中,所以可简单视为变量num01的数值,被进行了两次递减,变成6.
num02-=1;此语句被执行之前,变量num02的数值已经变成6.
此语句等同于递减变量num02的数值,成为5.
num02=num02-1;此语句被执行之前,变量num02的数值已经变成5.
此语句亦等同于递减变量num02的数值,成为4.
result=num03**3**2;在此,变量num03的数值是5.
因为求幂运算符**具有右结合的特征,所以【3**2】要先被评估成为32,也就是9,然后再评估【num03**9】,结果值为59,也就是1953125.
result=num03**(3**2);30|JavaScript编程思想:从ES5到ES9在此,借助小括号运算符()的辅助,可明确得知【(3**2)】会优先被评估成为32,也就是9,然后评估【num03**9】的结果值为59,也就是1953125.
result=(num03**3)**2;在此,使用小括号运算符()的辅助,可明确得知【(num03**3)】会优先被评估成为53,也就是125,然后再评估【125**2】的结果值为1252,也就是15625.
2.
2.
2赋值运算符JavaScript编程语言的赋值运算符(assignmentoperator)存在基本形式的等号【=】,以及如表2-2所示的复合形式.
表2-2JavaScript的赋值运算符赋值运算符用法含义=a=b+=a+=ba=a+b-=a-=ba=a-b*=a*=ba=a*b/=a/=ba=a/b%=a%=ba=a%b>=a>>=ba=a>>b>>>=a>>>=ba=a>>>b&=a&=ba=a&b^=a^=ba=a^b|=a|=ba=a|b关于赋值运算符的运用,可参考如下示例.
【2-2-2-assignment-operators.
js】leta=18,b=5,c=2;letresult=0;result=a+b+c;console.
log(result);//a=a+b;a+=b;console.
log(a);//a=a-b;a-=b;console.
log(a);//a=a*b;a*=b;第2章表达式与运算符|31console.
log(a);//a=a/b;a/=b;console.
log(a);//a=a%b;a%=b;console.
log(a);//b=b**c;b**=c;console.
log(b);//b=b>c;b>>=c;console.
log(b);//b=b>>>c;b>>>=c;console.
log(b);//b=b&c;b&=c;console.
log(b);//b=b^c;b^=c;console.
log(b);//b=b|c;b|=c;console.
log(b);【相关说明】leta=18,b=5,c=2;letresult=0;这两个语句声明了具有初始数据的变量a、b、c与result.
result=a+b+c;此语句里的赋值运算符【=】,使得变量result的数值,成为变量a、b、c各数值的总和.
//a=a+b;a+=b;此语句里的赋值运算符【+=】,使得变量a的数值,成为【变量a本身的数值加上变量b的数值】的结果值.
//a=a-b;32|JavaScript编程思想:从ES5到ES9a-=b;此语句里的赋值运算符【-=】,使得变量a的数值,成为【变量a本身的数值减去变量b的数值】的结果值.
//a=a*b;a*=b;此语句里的赋值运算符【*=】,使得变量a的数值,成为【变量a本身的数值乘以变量b的数值】的结果值.
//a=a/b;a/=b;此语句里的赋值运算符【/=】,使得变量a的数值,成为【变量a本身的数值除以变量b的数值】的结果值.
//a=a%b;a%=b;此语句里的赋值运算符【%=】,使得变量a的数值,成为【变量a本身的数值除以变量b的数值】的余数.
//b=b**c;b**=c;此语句里的赋值运算符【**=】,使得变量b的数值,成为【变量b本身数值的c幂次】(bc)的结果值.
//b=b>c;b>>=c;此语句里的赋值运算符【>>=】,使得变量b的二进制数值,在保留正负号的前提下,向右偏移变量c所代表的比特位(bit)个数.
所谓的保留正负号就是:若该二进制数值为负值,则其最左侧的符号位(signbit)是1,并在向右偏移的同时,保持其符号位为1.
若该二进制数值为正值,则其最左侧的符号位是0,并在向右偏移的同时,保持其符号位为0.
//b=b>>>c;b>>>=c;此语句里的赋值运算符【>>>=】,使得变量b的数值,成为【变量b的二进制数值,向右偏移变量c所代表的比特位(bit)个数,并在其左侧补上相同个数的二进制0】之后的结果值.
在其左侧补上相同个数的二进制0,也就意味着,一开始无论其最左侧的符号位是0(正值)或是1(负值),后续皆在向右偏移的同时,保持符号位成为0.
//b=b&c;第2章表达式与运算符|33b&=c;此语句里的赋值运算符【&=】,使得变量b的数值,成为【变量b本身的二进制数值与变量c的二进制数值,进行按位与(bitwiseand)运算】之后的结果值.
//b=b^c;b^=c;此语句里的赋值运算符【^=】,使得变量b的数值,成为【变量b的二进制数值与变量c的二进制数值,进行按位异或(bitwiseexclusiveor)运算】之后的结果值.
//b=b|c;b|=c;此语句里的赋值运算符【^=】,使得变量b的数值,成为【变量b的二进制数值与变量c的二进制数值.
进行按位或(bitwiseor)运算】之后的结果值.
2.
2.
3比较运算符在各编程语言中,比较运算符(comparisonoperator)是用来决定其两侧操作数相等或不相等的关系.
JavaScript编程语言的比较运算符如表2-3所示.
表2-3JavaScript语言的比较运算符比较运算符用法含义判断后的返回值==a==b判断变量a与b的数值,是否相等===a===b判断变量a与b的数值,是否相等,以及其数据类型是否也相同!
=a!
=b判断变量a与b的数值,是否并不相等!
==a!
==b判断变量a与b的数值,是否并不相等,或者其数据类型是否也不同>a>b判断变量a的数值,是否大于变量b的数值>=a>=b判断变量a的数值,是否大于或者等于变量b的数值s01);console.
log(v02=s03);console.
log(v03s01);判断变量v02的数值是否大于变量s01的数据,并显示判断为真的返回值true,于浏览器的调试工具【Console】面板中.
console.
log(v02=s03);判断变量v03的数值是否大于或者等于变量s03的数据,并显示判断为真的返回值true于浏览器调试工具的【Console】面板中.
console.
log(v03v02||v03>v02;console.
log(result);//result=!
false;result=!
(v01>v02);console.
log(result);result=2invalues;console.
log(result);result='length'invalues;console.
log(result);result='round'inMath;console.
log(result);result='gender'inperson;console.
log(result);【相关说明】letv01=10,v02=50,v03=60;此语句声明了初始数值为整数常量的变量v01、v02与v03.
letvalues=[10,20,30,40,50];此语句声明了初始数据为数组实例的变量values.
letperson={name:'Gary',gender:'male',age:'25'};此语句声明了初始数据为对象实例的变量person.
//result=true&&true;result=v01v02||v03>v02;【v01>v02】为假,所以返回false;【v03>v02】为真,所以返回true.
因此,【v01>v02||v03>v02】亦为真而返回true,使得变量result的数据成为布尔值true.
36|JavaScript编程思想:从ES5到ES9//result=!
false;result=!
(v01>v02);【v01>v02】为假,所以返回false.
因此,【!
(v01>v02)】为真而返回true,使得变量result的数据成为布尔值true.
result=2invalues;变量values的数据是数组实例[10,20,30,40,50],所以values[0]可访问到数组实例的元素值10;values[4]可访问到数组实例的元素值50.
在数组实例名称values右侧的中括号[]里面,例如values[3],存在作为索引值(indexvalue)的整数值3,以访问其索引值3所代表的特定元素40.
在此,因为索引值2(第3个)对应到values[2]所代表的第3个元素值30,所以【2invalues】为真而返回true,使得变量result的数据成为布尔值true.
result='length'invalues;变量values的数据是数组实例,因此变量values具有属性length,可用来获取values.
length所代表元素个数的整数值5.
所以,【'length'invalues】为真而返回true,使得变量result的数据成为布尔值true.
result='round'inMath;内置的对象Math具有函数round(),所以【'round'inMath】为真而返回true,进而使得变量result的数据成为布尔值true.
result='gender'inperson;变量person的数据是对象实例{name:'Gary',gender:'male',age:'25'},所以属性gender可用来访问到person.
gender所代表属性的数据'male'.
所以,【'gender'inperson】为真而返回true,使得变量result的数据成为布尔值true.
2.
2.
5条件运算符从C语言开始,许多后继的编程语言,均支持条件运算符(conditionaloperator)/三元运算符(ternaryoperator),并用来简化特定形式的if语句.
关于条件运算符的运用,可参考如下示例.
【2-2-5-conditional-operator.
js】letscore,passed;score=58;passed=score>=60'yes':'no';console.
log(passed);score=77;passed=score>=60'yes':'no';console.
log(passed);第2章表达式与运算符|37score=60;if(score>=60)passed='yes';elsepassed='no';console.
log(passed);【相关说明】letscore,passed;此语句声明了变量score与passed.
score=58;此语句使得变量score,被赋予整数值58.
passed=score>=60'yes':'no';对于表达式【score>=60'yes':'no'】而言,若【score>=60】为真,则返回字符串'yes';否则返回字符串'no'.
在此,其为假,所以返回字符串'no',进而使得变量passed的数据,成为字符串'no'.
score=77;此语句使得变量score,被赋予整数值77.
passed=score>=60'yes':'no';在此,表达式【score>=60'yes':'no'】返回字符串'yes',进而使得变量passed的数据,成为字符串'yes'.
score=60;此语句使得变量score,被赋予整数值60.
if(score>=60)passed='yes';elsepassed='no';对于此条件语句而言,若【score>=60】为真,则变量passed会被赋予字符串'yes';否则会被赋予字符串'no'.
在此,其为真,所以返回字符串'yes',进而使得变量passed,被赋予字符串'yes'.
2.
2.
6类型运算符类型运算符(typeofoperator)用来返回特定操作数(operand)的数据类型(datatype).
关于类型运算符的综合运用,可参考如下示例.
【2-2-6-typeof-operator.
js】letnum01=33,num02=1.
414;console.
log(typeofnum01);console.
log(typeof33);console.
log(typeofnum02);console.
log(typeof1.
414);38|JavaScript编程思想:从ES5到ES9console.
log('');console.
log(typeofMath.
PI);console.
log(typeofNaN);console.
log(typeofInfinity);console.
log('');console.
log(typeof'');console.
log(typeof"");console.
log(typeof"Hello,Earth!
");console.
log('');console.
log(typeoftrue);console.
log(typeoffalse);console.
log(typeof(num01>num02));console.
log('');console.
log(typeofundefined);console.
log(typeofnum03);console.
log('');console.
log(typeoffunction(){});console.
log(typeofArray.
isArray);console.
log('');console.
log(typeofObject());console.
log(typeofnewObject());console.
log(typeof{});console.
log('');console.
log(typeofArray());console.
log(typeofnewArray());console.
log(typeof[]);console.
log('');console.
log(typeofnull);console.
log('');console.
log(typeofString('test'));console.
log(typeofnewString('test'));console.
log('');console.
log(typeofNumber(123));console.
log(typeofnewNumber(123));console.
log('');console.
log(typeofDate());console.
log(typeofnewDate());【相关说明】letnum01=33,num02=1.
414;此语句声明了具有初始数值的变量num01与num02.
console.
log(typeofnum01);第2章表达式与运算符|39表达式【typeofnum01】会得出变量num01的数据类型名称,在此为字符串'number'.
console.
log(typeof33);表达式【typeof33】会得出常量33的数据类型名称,在此为字符串'number'.
console.
log(typeofnum02);表达式【typeofnum02】会得出变量num02的数据类型名称,在此为字符串'number'.
console.
log(typeof1.
414);表达式【typeof1.
414】会得出常量1.
414的数据类型名称,在此为字符串'number'.
console.
log(typeofMath.
PI);表达式【typeofMath.
PI】会得出内置对象Math的常量属性PI的数据类型名称,在此为字符串'number'.
console.
log(typeofNaN);表达式【typeofNaN】会得出原始常量NaN的数据类型名称,在此为字符串'number'.
console.
log(typeofInfinity);表达式【typeofInfinity】会得出内置常量Infinity的数据类型名称,在此为字符串'number'.
console.
log(typeof'');表达式【typeof''】会得出空字符串''的数据类型名称,在此为字符串'string'.
console.
log(typeof"");表达式【typeof""】会得出空字符串""的数据类型名称,在此为字符串'string'.
console.
log(typeof"Hello,Earth!
");表达式【typeof"Hello,Earth!
"】会得出字符串"Hello,Earth!
"的数据类型名称,在此为字符串'string'.
console.
log(typeoftrue);表达式【typeoftrue】会得出布尔值true的数据类型名称,在此为字符串'boolean'.
console.
log(typeoffalse);表达式【typeoffalse】会得出布尔值false的数据类型名称,在此为字符串'boolean'.
console.
log(typeof(num01>num02));表达式【typeof(num01>num02)】会得出子表达式【num01>num02】返回值的数据类型名称,在此为字符串'boolean'.
console.
log(typeofundefined);值得关注的是,原始常量undefined的数据类型亦是undefined.
表达式【typeofundefined】会得出原始常量undefined的数据类型名称,在此为字符串'undefined'.
console.
log(typeofnum03);40|JavaScript编程思想:从ES5到ES9在此,num03未被声明为变量或函数名称,所以num03处于未定义(undefined)的状态.
表达式【typeofnum03】会得出未被声明的num03的数据类型名称,在此为字符串'undefined'.
console.
log(typeoffunction(){});表达式【typeoffunction(){}】会得出匿名函数的数据类型名称,在此为字符串'function'.
console.
log(typeofArray.
isArray);表达式【typeofArray.
isArray】会得出内置对象Array的函数isArray()的数据类型名称,在此为字符串'function'.
console.
log(typeofObject());因为Object对象的构造函数Object(),会返回Object对象的实例;也因此表达式【typeofObject()】会得出Object对象实例的数据类型名称,在此为字符串'object'.
console.
log(typeofnewObject());表达式【typeofnewObject()】也会得出Object对象实例的数据类型名称,在此亦为字符串'object'.
此外,JavaScript语言尚未界定【Object()】与【newObject()】的明显区别.
console.
log(typeof{});表达式【typeof{}】会得出空对象实例{}的数据类型名称,在此亦为字符串'object'.
而在JavaScript编程语言中,如下3个语句是等价的:obj={};obj=newObject();obj=Object();console.
log(typeofArray());因为Array对象的构造函数Array(),会返回Array对象的实例;也因此表达式【typeofArray()】会得出Array对象实例的数据类型名称,在此竟然也为字符串'object'.
console.
log(typeofnewArray());表达式【typeofnewArray()】亦会得出Array对象实例的数据类型名称,在此亦为字符串'object'.
此外,JavaScript编程语言尚未界定【Array()】与【newArray()】的明显区别.
console.
log(typeof[]);表达式【typeof[]】会得出空数组实例[]的数据类型名称,在此为字符串'object'.
而在JavaScript语言中,如下3个语句是等价的:arr=[];arr=newArray();arr=Array();在JavaScript语言里,将数组实例(arrayinstance)的数据类型视为object.
console.
log(typeofnull);第2章表达式与运算符|41【typeofnull】表达式会得出原始常量null的数据类型名称,在此为字符串'object'.
console.
log(typeofString('test'));内置对象String的构造函数String('test'),只会返回字符串'test'.
因此,表达式【typeofString('test')】等同于获得字符串'test'的数据类型名称,在此为字符串'string'.
console.
log(typeofnewString('test'));内置对象String的构造函数String('test')会返回字符串'test'.
再经过new关键字的处理,会返回内含字符串'test'的String对象实例.
因此,表达式【typeofnewString('test')】等同于获得String对象实例的数据类型名称,在此为字符串'object'.
console.
log(typeofNumber(123));内置对象Number的构造函数Number(123),会返回整数常量123.
因此,【typeofNumber(123)】表达式等同于获得整数常量123的数据类型名称,在此为字符串'number'.
console.
log(typeofnewNumber(123));内置对象Number的构造函数Number(123),会返回整数常量123.
再经过new关键字的处理,会返回内含整数常量123的Number对象实例.
因此,表达式【typeofnewNumber(123)】等同于获得Number对象实例的数据类型名称,在此为字符串'object'.
console.
log(typeofDate());内置Date对象的构造函数Date(),会返回当前日期与时间的字符串.
因此,表达式【typeofDate()】等同于获得当前日期与时间的字符串的数据类型名称,在此为字符串'string'.
console.
log(typeofnewDate());内置Date对象的构造函数Date(),会返回当前日期与时间的字符串.
再经过new关键字的处理,会返回内含当前日期与时间的Date对象实例.
因此,表达式【typeofnewDate()】等同于获得Date对象实例的数据类型名称,在此为字符串'object'.
2.
2.
7按位运算符JavaScript语言的按位运算符(bitwiseoperator),在被运算之前,其两侧操作数(operand)的数据,会被转换成为32个比特位的数据.
关于按位运算符的综合运用,可参考如下示例.
【2-2-7-bitwise-operators.
js】letnum01=56,num02=77;letnum03=124,num04=-3;console.
log(num01.
toString(2));console.
log(num02.
toString(2));console.
log(num03.
toString(2));console.
log('');console.
log(num01==0b111000);console.
log(num01==0b00111000);42|JavaScript编程思想:从ES5到ES9console.
log('');console.
log(num02==0b1001101);console.
log(num02==0b01001101);console.
log('');console.
log(num03==0b1111100);console.
log(num03==0b01111100);console.
log('');/*00111000&0100110100001000*/result=num01&num02;console.
log(result);console.
log(result.
toString(2));console.
log('');/*00111000|0100110101111101*/result=num01|num02;console.
log(result);console.
log(result.
toString(2));console.
log('');/*00111000^0100110101110101*/result=num01^num02;console.
log(result);console.
log(result.
toString(2));console.
log('');/*~0111110010000011(negativevalue)=-01111100+00000001(becauseof2'scomplement)-01111101第2章表达式与运算符|43*/result=~num03;console.
log(result);console.
log(result.
toString(2));console.
log('');/*>001111100000111110*/result=num03>>1;console.
log(result);console.
log(result.
toString(2));console.
log('');/*but-3actuallyis11111111111111111111111111111101in32-bit2'scomplement.
So,>>>1111111111111111111111111111110101111111111111111111111111111110*/result=num04>>>1;console.
log(num04.
toString(2));console.
log(result);console.
log((2**31-1)-1);console.
log(result.
toString(2));【相关说明】letnum01=56,num02=77;letnum03=124,num04=-3;这两个语句声明了初始数据为整数值的变量num01、num02、num03与num04.
console.
log(num01.
toString(2));console.
log(num02.
toString(2));console.
log(num03.
toString(2));这3个语句中的【.
toString(2)】,可分别将变量num01、num02与num03的整数值,转换成44|JavaScript编程思想:从ES5到ES9为字符串类型的二进制数码.
console.
log(num01==0b111000);【num01==0b111000】可用来判断变量num01的数值,是否等于二进制整数【111000】.
在此,其返回true.
加上【0b】在二进制数码的左侧,可使得此代码被视为二进制数值.
在此亦可得知,浏览器中的JavaScript引擎,仍然将最左比特位(left-mostbit)为1的数值,视为正值(positivevalue).
因此,若要变更成为负值(negativevalue),则修改为【-0b111000】.
console.
log(num01==0b00111000);【num01==0b00111000】可用来判断变量num01的数值,是否等于二进制整数【00111000】.
在此,其返回true.
在此可得知,浏览器中的JavaScript引擎将【0b00111000】与【0b111000】,视为相同的二进制数值.
console.
log(num02==0b1001101);console.
log(num02==0b01001101);【num02==0b1001101】可用来判断变量num02的数值,是否等于二进制整数【1001101】.
在此,其返回true.
【num02==0b01001101】可用来判断变量num02的数值,是否等于二进制整数【01001101】.
在此,其返回true.
在此可得知,JavaScript引擎将【0b1001101】与【0b01001101】,视为相同的二进制数值.
console.
log(num03==0b1111100);console.
log(num03==0b01111100);【num03==0b1111100】可用来判断变量num03的数值,是否等于二进制整数【0b1111100】.
在此,其返回true.
【num03==0b01111100】可用来判断变量num03的数值,是否等于二进制整数【0b01111100】.
在此,其返回true.
由此可得知,JavaScript引擎将【0b1111100】与【0b01111100】,视为相同的二进制数值.
/*00111000&0100110100001000*/result=num01&num02;【num01&num02】可得到【变量num01与num02的二进制数据,进行按位和(bitwiseand)运算】之后的结果值.
/*00111000|0100110101111101*/第2章表达式与运算符|45result=num01|num02;【num01|num02】可得到【变量num01与num02的二进制数据,进行按位或(bitwiseor)运算】之后的结果值.
/*00111000^0100110101110101*/result=num01^num02;【num01^num02】可得到【变量num01与num02的二进制数据,进行按位异或(bitwiseexclusiveor)运算】之后的结果值.
/*~0111110010000011(negativevalue)=-01111100+00000001(becauseof2'scomplement)-01111101*/result=~num03;【~num03】会得到【变量num03的二进制数据,进行2的补码(two'scomplement)】之后的结果值.
/*>001111100000111110*/result=num03>>1;【num03>>1】会得出【变量num03的2进位数据,向右偏移1个比特位】之后的结果值.
/*but-3actuallyis11111111111111111111111111111101in32-bit2'scomplement.
So,>>>111111111111111111111111111111010111111111111111111111111111111046|JavaScript编程思想:从ES5到ES9*/result=num04>>>1;【num04>>>1】会得出【变量num04的2进位数据,向右偏移1个比特位的同时,在其最左侧的符号位(signbit),填入0】之后的结果值.
此语句被执行之前,变量num04的数值为负整数-3.
此语句被执行之后,变量num04的数值却变成非常大的正整数2147483646,可见其符号位被填入了0.
console.
log((2**31-1)-1);【(2**31-1)-1】会评估出(231-1)-1,也就是正整数2147483646.
2.
2.
8括号运算符括号运算符包含:小括号/圆括号(parentheses,roundbrackets)运算符():除了用于变更特定表达式的运算优先级之外,亦被用于if、switch、for、while等语句和函数的调用.
中括号/方括号(brackets,squarebrackets)运算符[]:主要用于数组(array)或字符串(string)相关的定义和访问.
大括号/花括号(braces,curlybrackets)运算符{}:用于语句的分组(grouping)、函数的主体构造,以及对象(object)的定义.
关于括号运算符的综合运用,可参考如下示例.
【2-2-8-brackets-operators.
js】leta=10,b=5,c=3;letresult=0;result=a-b*c;console.
log(result);result=(a-b)*c;console.
log(result);result=a**c**2;console.
log(result);result=(a**c)**2;console.
log(result);console.
log('');///letnow=newDate();console.
log(now);console.
log(now.
toLocaleString());console.
log('');第2章表达式与运算符|47letobj=newObject();obj.
name='Jasper';obj.
gender='male';obj.
age=28;console.
log(obj);console.
log('');///functiondisplay(choice,message){if(choice==1)alert(message);elseif(choice==2)confirm(message);}display(1,'Hello,Earth!
');display(2,'Hello,areyouhuman');///letfruits=['apple','banana','cherry','durian'];console.
log(fruits[1]);【相关说明】leta=10,b=5,c=3;letresult=0;这两个语句声明了具有初始数值的变量a、b、c和result.
result=a-b*c;表达式【a-b*c】会先被计算出【b*c】的结果值,再计算出整个表达式的结果值.
result=(a-b)*c;因为小括号运算符的缘故,表达式【(a-b)*c】会先被计算出【a-b】的结果值,再计算出整个表达式的结果值.
result=a**c**2;因为求幂运算符**具有右结合的特征,所以表达式【a**c**2】会先被计算出【c**2】的结果值,再计算整个表达式的结果值.
result=(a**c)**2;因为小括号运算符的缘故,表达式【(a**c)**2】会先被计算出【a**c】的结果值,再被计算出整个表达式的结果值.
letnow=newDate();此语句使得变量now,具有初始数据为【内含当前日期与时间】的Date对象实例.
console.
log(now);48|JavaScript编程思想:从ES5到ES9借助此语句,可在网页浏览器的调试工具【Console】面板中,显示出标准格式的日期与时间.
例如:【FriDec29201701:16:16GMT+XX00(XX标准时间)】.
console.
log(now.
toLocaleString());【now.
toLocalString()】可将日期与时间,以精简的本地格式,显示出来.
例如:【2017/12/29上午1:16:16】.
letobj=newObject();因为小括号运算符的缘故,使得Object对象的构造函数Object()被调用.
此语句使得变量obj的初始数据,成为Object对象的空实例(emptyinstance).
obj.
name='Jasper';obj.
gender='male';obj.
age=28;这3个语句分别设置了变量obj的新属性name、gender、age和其个别数据'Jasper'、'male'、28.
console.
log(obj);此语句可显示出变量obj的数据,也就是对象实例{name:"Jasper",gender:"male",age:28}.
functiondisplay(choice,message)因为小括号运算符的缘故,网页浏览器或其他软件中的JavaScript引擎,可认出关键字function开头的此源代码片段,即是用来定义【带有参数choice和message,而且其名称为display】的函数.
{if(choice==1)alert(message);elseif(choice==2)confirm(message);}借助大括号运算符{},JavaScript引擎可认出大括号{.
.
.
}里的源代码,即是函数display()的主体结构.
在函数display()的主体结构里,仍然可以看到小括号运算符,出现在if语句中.
另外,亦可看到小括号运算符,出现在内置函数alert()与confirm()的调用语法中.
display(1,'Hello,Earth!
');display(2,'Hello,areyouhuman');这两个语句,通过传入不同参数值,而重复调用了函数display().
letfruits=['apple','banana','cherry','durian'];借助中括号运算符[],在此语句里的等号右侧,即是内含4个字符串元素的数组实例.
console.
log(fruits[1]);此语句通过数组变量的名称fruits,以及中括号运算符里的元素索引值1,访问到fruits[1]所代表的字符串元素'banana'.
第2章表达式与运算符|492.
2.
9扩展运算符(ES6)简单来说,由3个英文句点【.
.
.
】构成的扩展运算符(spreadoperator),可被用来【卸除】特定数组的中括号或者特定对象的大括号.
关于扩展运算符的综合运用,可参考如下示例.
【2-2-9-spread-operator.
js】vargreetings=['Hi','Howdy','Hey,man','G\'daymate'];varextended_greetings=['Longtimenosee','Nicetoseeyou','Hiya',.
.
.
greetings];console.
log(extended_greetings);console.
log('');varnumber_texts=['one','two','three']varnumber_digits='123';varnumbers=[.
.
.
number_texts,.
.
.
number_digits]console.
log(numbers);console.
log('');///letbirthday=newDate(1999,11,25,20,30);letnow=newDate();console.
log(birthday.
toLocaleString());console.
log(now.
toLocaleString());console.
log('');///letarr01=[1,2,3];letarr02=[10,20,30];letarr03=[.
.
.
arr01,.
.
.
arr02,100,200,300];letobj01={name:'orange',amount:10};letobj02={name:'durian',amount:5,origin:'Thai'};letobj03={.
.
.
obj01,.
.
.
obj02};console.
log(arr03);console.
log(obj03);console.
log('');【相关说明】vargreetings=['Hi','Howdy','Hey,man','G\'daymate'];此语句声明了初始数据为数组实例的变量greetings.
varextended_greetings=['Longtimenosee','Nicetoseeyou','Hiya',.
.
.
greetings];此语句声明了初始数据为另一数组实例的变量extended_greetings.
扩展运算符【.
.
.
】使得变量extended_greetings的数组实例,带有变量greetings的数组实例中的所有元素.
50|JavaScript编程思想:从ES5到ES9varnumber_texts=['one','two','three']此语句亦声明了初始数据为另一数组实例的变量number_texts.
varnumber_digits='123';此语句声明了初始数据为字符串'123'的变量number_digits.
varnumbers=[.
.
.
number_texts,.
.
.
number_digits]扩展运算符【.
.
.
】使得变量numbers的初始数据,成为合并【变量number_texts与number_digits的个别数组实例】的新数组实例,进而使得变量numbers的数据,成为数组实例["one","two","three","1","2","3"].
letbirthday=newDate(1999,11,25,20,30);此语句声明了【初始数据为内含日期与时间1999/12/2520:30:00的Date对象实例】的变量birthday.
需留意的是,构造函数Date()小括号中的第2个参数值为11,其实是代表12月份的含义.
换句话说,此参数值若为0,则代表1月份.
letnow=newDate();此语句声明了【初始数据为当前日期与时间的Date对象实例】的变量now.
console.
log(birthday.
toLocaleString());此语句会显示出【1999/12/25下午8:30:00】的信息.
console.
log(now.
toLocaleString());此语句显示出当前日期与时间的信息.
letarr01=[1,2,3];letarr02=[10,20,30];这两个语句声明了【初始数据为不同数组实例】的变量arr01与arr02.
letarr03=[.
.
.
arr01,.
.
.
arr02,100,200,300];此语句声明了变量arr03,并借助扩展运算符【.
.
.
】,使得其【初始数据为合并变量arr01与arr02的数组实例,再衔接子数组实例[100,200,300]】的新数组实例[1,2,3,10,20,30,100,200,300].
letobj01={name:'orange',amount:10};letobj02={name:'durian',amount:5,origin:'Thai'};这两个语句声明了【初始数据为对象实例】的变量obj01与obj02.
letobj03={.
.
.
obj01,.
.
.
obj02};此语句声明了变量obj03,并借助扩展运算符【.
.
.
】,使得其【初始数据为合并变量obj01与obj02对象实例】的新对象实例{name:"durian",amount:5,origin:"Thai"}.
值得注意的是,变量obj01与obj02均存在属性name与amount.
经过扩展运算之后,变量obj03的属性name与amount却只有一个,而且其属性的数据,均个别与变量obj02的属性name和amount第2章表达式与运算符|51的数据,是相同的.
2.
2.
10逗号运算符逗号运算符(commaoperator)主要用来并联多个赋值表达式或操作数.
关于逗号运算符的运用,可参考如下示例.
【2-2-10-comma-operator.
js】leta=11,b=21,c=31;letd,e,f;d=e=a+b,f=b+c;console.
log(d,e,f);【相关说明】leta=11,b=21,c=31;此语句声明了初始数据均为整数的变量a、b与c.
letd,e,f;此语句声明了未设置初始数据的变量d、e与f.
d=e=a+b,f=b+c;此语句主要由两个表达式【d=e=a+b】与【f=b+c】构成.
第1个表达式先被计算出【a+b】的结果值,再赋给变量d和e.
第2个表达式先被计算出【b+c】的结果值,再赋给变量f.
修改此语句中的逗号运算符【,】,成为代表语句结束的分号【;】,并不影响其结果值.
只是,原本的单一语句,就变成在同一行的两个语句了.
console.
log(d,e,f);通过传入变量d、e和f的数值,作为函数console.
log()的参数值,可让这些变量的数值,显示在同一行的信息里,例如【323252】.
2.
2.
11删除运算符JavaScript语言中的删除运算符(deleteoperator),仅用来删除特定对象实例的特定属性.
关于删除运算符的运用,可参考如下示例.
【2-2-11-delete-operator.
js】letperson={name:'Ivory',gender:'female',age:'30'};letcolors=['RoyalBlue','GreenYellow','Gold','Cyan'];varnum01=123;52|JavaScript编程思想:从ES5到ES9letnum02=456;num03=789;console.
log(num01,num02,num03);console.
log('');deleteperson.
name;deletecolors[1];deletenum01;deletenum02;deletenum03;console.
log(person.
name);console.
log(person);console.
log('');console.
log(colors[1]);console.
log(colors);console.
log('');console.
log(num01);console.
log(num02);console.
log(num03);【相关说明】letperson={name:'Ivory',gender:'female',age:'30'};此语句声明了初始数据为对象实例的变量person.
letcolors=['RoyalBlue','GreenYellow','Gold','Cyan'];此语句声明了初始数据为数组实例的变量colors.
varnum01=123;letnum02=456;num03=789;无论有无通过关键字var或let进行声明,这3个语句分别声明了初始数据为不同整数的变量num01、num02与num03.
deleteperson.
name;此语句使用关键字delete,并配合点运算符【.
】,可删除变量person的对象实例的属性name.
deletecolors[1];此语句使用关键字delete,并配合中括号运算符[],可在变量colors数组实例中,仅删除索引值为1的元素数据'GreenYellow',但是此元素占用的缓存空间,仍然保留在其数组实例中.
deletenum01;deletenum02;deletenum03;通过这3个语句,试图删除变量num01、num02与num03;然而实际上,仅有未通过var或let关键字,加以声明的变量num03,可以被成功删除.
第2章表达式与运算符|53console.
log(person.
name);【person.
name】会返回undefined,即代表变量person的属性name,已被删除了.
console.
log(person);此语句只会产生{gender:"female",age:"30"}的信息.
由此可见,属性name和其数据'Ivory'已被删除了.
console.
log(colors[1]);colors[1]在此返回undefined,即代表变量colors中的索引值为1的数据,已经被清除了.
console.
log(colors);此语句会产生["RoyalBlue",empty,"Gold","Cyan"]的信息,可看出colors[1]对应的元素数据已经被清除了,才会被标记为empty.
console.
log(num01);console.
log(num02);查看这两个语句所产生的信息,可得知变量num01与num02并未被删除!
那是因为这两个变量,是借助var或let关键字,来加以声明的.
console.
log(num03);执行此语句时,会产生【num03isnotdefined参考错误(referenceerror)】的信息.
由此可知,变量num03确实被删除了.
2.
2.
12运算符的优先级(ES6)在特定表达式中,运算符的优先级(operatorsprecedence)可用来决定各子表达式的执行顺序.
在相邻的子表达式中,其运算符优先级较高的子表达式,会先被执行.
关于各运算符的优先级,如表2-5所示.
表2-5运算符的优先级优先级用途关联性运算符20变更优先级无(…)访问属性或函数由左至右….
…访问子元素或定义数组实例的元素个数由左至右[…]创建特定对象【非】默认的实例无new…(…)19调用特定函数由左至右…(…)18创建特定对象默认的实例由右至左new…评估后再递增…++17评估后再递减无…--54|JavaScript编程思想:从ES5到ES9(续表)优先级用途关联性运算符逻辑非运算!
…按位非运算~…正值+…负值-…先递增再评估++…先递减再评估--…返回数据类型typeof…立即调用匿名函数void…删除特定数据delete…16等待评估后的数据由右至左await…15求幂运算由右至左…**…乘法运算…*…除法运算…/…14求余运算由左至右…%…加法运算…+…13减法运算由左至右…-…按位左移运算…>…12按位无符号右移运算由左至右…>>>…比较小于的关系……比较大于或等于的关系…>=…判断是否存在特定属性…in…11判断是否为特定对象的实例由左至右…instanceof…判断数据是否相等…==…判断数据是否不相等…!
=…判断数据【和】类型是否都相同…===…10判断数据【或】类型是否不相同由左至右…!
==…9按位与运算由左至右…&…8按位异或运算由左至右…^…7按位或运算由左至右…|…6逻辑与运算由左至右…&&…5逻辑或运算由左至右…||…4条件运算由右至左第2章表达式与运算符|55(续表)优先级用途关联性运算符…=……+=……-=……*=……/=……%=……>=……>>>=……&=……^=…3赋值运算由右至左…|=…返回生成器中的特定数据yield…2返回子生成器中的特定数据由右至左yield*…1扩展运算无.
.
.
…0逗号运算由左至右…,…2.
3练习题1.
在JavaScript语言里,下列哪些项目是常量770、Math.
PI、'NiceDay'、"good"、/\w\s\d/g、/.
\w.
\d/、TRUE、FALSE、Undefined、Null.
2.
在JavaScript语言里,应该通过什么语法声明名称为love_you_forever而代表着整数值201314的常量3.
在JavaScript语言里,应该通过什么语法声明名称为love_me_longer而代表着浮点数值2591.
8的常量4.
在如下JavaScript源代码片段里,哪些是全局变量哪些是局部变量letvalue01=10;varvalue02=30;functionfunc01(data,identity){letresult;result=21+data+2*identity;returnresult;}varstr01='Finished',str02='Error';functionfunc02(amount,price)56|JavaScript编程思想:从ES5到ES9{letoutput;output=(value01+value02+price)*amount;returnoutput;}5.
在如下JavaScript源代码片段里,请至少列举出其中的5个表达式.
sphere_volume=r=>4/3*Math.
PI*Math.
pow(r,3);6.
编写带有上底宽度、下底宽度和高度3个参数,可计算并返回梯形面积的函数定义.
7.
编写带有长轴长度、短轴长度2个参数,可计算并返回椭圆面积的函数定义.
8.
如下源代码被执行之后,变量result的结果数据是什么letresult,n01=10,n02=20;result=n01+++++n02%6;9.
如下源代码被执行之后,变量result的结果数据是什么letresult,n03=30,n04=40;result=n03-----n04%6;10.
如下源代码被执行之后,变量result的结果数据是什么letresult,n05=50,n06=60;result=(n05/5)**3+(n06/10)**2;11.
如下源代码被执行之后,变量result的结果数据是什么letresult,n07=70,n08=80;result=(n07/10)**2+(n08/20)**0.
5;12.
通过编写条件运算符【…:】相关的源代码来实现下述功能.
已知两个变量score和rating.
当score的数值低于60时,变量rating的数据为字符串'failed';当score的数值大于或等于60而小于80时,变量rating的数据为字符串'passed';当score的数值大于或等于80而小于或等于100时,变量rating的数据为字符串'nice';当score的数值超过100时,变量rating的数据为字符串'error'.
13.
至少列举类型运算符typeof表达式可返回的5种数据类型.
第3章数据类型不同的编程语言存在不同的数据类型(datatype),各种数据类型可用来描述容纳特不同数据的数据结构(datastructure).
特定表达式被评估时,可返回特定类型的数据.
3.
1数值类型JavaScript语言的数值,不仅包括整数(integer),也包含带有小数部分的浮点数(floating-pointnumber).
3.
1.
12n进制的字面量(ES6)2n进制主要是指二进制、八进制与十六进制.
在JavaScript语言中,可通过2n进制的字面量(literal),来表示2n进制的数字常量(numberconstant)/数值(numbervalue).
【3-1-1-nth-power-of-2-based-literals.
js】varnumber01=111;varnumber02=parseInt('111',16);varnumber03=0x111;varnumber04=0111;//cannotuseinstrictmode.
varnumber05=parseInt('111',8);varnumber06=0o111;//newliteralinES6varnumber07=parseInt('111',2);varnumber08=0b111;//newliteralinES6console.
log(number01);console.
log(number02);console.
log(number03);58|JavaScript编程思想:从ES5到ES9console.
log(number04);console.
log(number05);console.
log(number06);console.
log(number07);console.
log(number08);【相关说明】varnumber01=111;111代表十进制的数值111.
varnumber02=parseInt('111',16);parseInt('111',16)返回十六进制数值111所对应的十进制数值273.
varnumber03=0x111;0x111代表十六进制的数值111.
因此,变量number03的初始数值,会成为十六进制数值111所对应的十进制数值273.
varnumber04=0111;//cannotuseinstrictmode.
0111代表八进制的数值111.
因此,变量number04的初始数值,会成为八进制数值111所对应的十进制数值73.
varnumber05=parseInt('111',8);parseInt('111',8)会返回八进制数值111所对应的十进制数值73.
varnumber06=0o111;//newliteralinES60o111代表八进制的数值111.
因此,变量number06的初始数值,会成为八进制数值111所对应的十进制数值73.
varnumber07=parseInt('111',2);parseInt('111',2)会返回二进制数值111所对应的十进制数值7.
varnumber08=0b111;//newliteralinES60b111代表二进制的数值111.
因此,变量number08的初始数值,会成为二进制数值111所对应的十进制数值7.
3.
1.
2数值的比较(ES6)要比较两个数值类型的操作数(operand)的数值(numbervalue)是相等、不相等、大于或小于的关系,必须通过带有特定比较运算符的表达式来实现.
关于数值的比较,可参考如下示例.
【3-1-2-number-comparisons.
js】console.
log(3+0.
1416===3.
1416);console.
log(0.
5+0.
25===0.
75);console.
log('');console.
log(0.
1+0.
02===0.
12);第3章数据类型|59a=0.
1;b=0.
02;c=0.
12;console.
log(a+b===c);console.
log(Math.
abs(a+b-c)60;console.
log(passed);score=55;passed=score>60;console.
log(passed);console.
log('');///letconversion;conversion=Boolean(-10.
8);console.
log(conversion);conversion=Boolean(15.
6);console.
log(conversion);console.
log('');///conversion=Boolean(0);console.
log(conversion);conversion=Boolean(null);console.
log(conversion);第3章数据类型|69conversion=Boolean(false);console.
log(conversion);conversion=Boolean('');console.
log(conversion);conversion=Boolean(undefined);console.
log(conversion);console.
log('');///conversion=newBoolean(-10.
8);console.
log(conversion.
valueOf());conversion=newBoolean(15.
6);console.
log(conversion.
valueOf());conversion=newBoolean(0);console.
log(conversion.
valueOf());【相关说明】letpassed=false,score=0;此语句声明了初始数据为false的变量passed,以及初始数据为0的变量score.
score=80;此语句赋予整数值80给变量score.
passed=score>60;在此,【score>60】是比较运算式,得出来的结果值为布尔值true,并被赋给变量passed.
console.
log(passed);score=55;此语句赋予整数值55给变量score.
passed=score>60;此语句将【score>60】的结果值false,赋给变量passed.
console.
log(passed);console.
log('');///letconversion;70|JavaScript编程思想:从ES5到ES9此语句声明了变量conversion.
conversion=Boolean(-10.
8);-10.
8是一个非0的数值,因此,经过Boolean对象的构造函数Boolean()处理之后,会返回true.
console.
log(conversion);conversion=Boolean(15.
6);15.
6是一个非0的数值,因此,经过Boolean对象的构造函数Boolean()处理之后,会返回true.
console.
log(conversion);console.
log('');///conversion=Boolean(0);conversion=Boolean(null);conversion=Boolean(false);conversion=Boolean('');conversion=Boolean(undefined);在前段各语句中,无论是0、null、false、空字符串''或undefined,均是具有零值意义的常量,经过构造函数Boolean()的处理之后,均会返回false.
console.
log(conversion);console.
log('');conversion=newBoolean(-10.
8);conversion=newBoolean(15.
6);conversion=newBoolean(0);在前段各语句中,构造函数Boolean()左侧被衔接了关键字new,使得变量conversion的数据,成为内含布尔值true或false的Boolean对象实例.
console.
log(conversion.
valueOf());调用conversion.
valueOf()函数,可返回变量conversion内含的布尔值true或false.
3.
3数组类型数组(array)是用来表示一组【具有各自数据】的元素.
然而,就JavaScript语言来说,其数组实例的数据类型(datatype)为对象类型.
数组实例中各元素的数据,可以同时存在数值、布尔值、字符串、对象,甚至是子数组!
关于数组类型的综合运用,可参考如下示例.
第3章数据类型|71【3-3---Array-data-type.
js】letnumbers=[520,530,1314,2013,2014];letprofile=['Tommy','male',33,[180,72]];letnewone=newArray(6);console.
log(numbers);console.
log(numbers[2]);numbers[1]=2591.
8;console.
log(numbers);console.
log(numbers.
length);console.
log('');///console.
log(profile);console.
log(profile[0]);console.
log(profile[2]);console.
log(profile[3][0]);console.
log(profile[3][1]);profile[3][1]=70;console.
log(profile);console.
log(profile.
length);console.
log(profile[3].
length);///console.
log(numbers[numbers.
length]);console.
log(profile[profile.
length]);console.
log('');console.
log(newone[0]);console.
log(newone[newone.
length]);【相关说明】letnumbers=[520,530,1314,2013,2014];此语句声明了初始数据为内含多个整数元素的数组实例[520,530,1314,2013,2014]的变量numbers.
letprofile=['Tommy','male',33,[180,72]];此语句声明了初始数据为数组实例['Tommy','male',33,[180,72]]的变量profile.
letnewone=newArray(6);newArray(6)会返回内含6个空元素的数组实例.
此语句声明了初始数据为内含6个空元素的数组实例的变量newone.
console.
log(numbers);在网页浏览器的调试工具【Console】面板中,显示出[520,530,1314,2013,2014]的信息.
console.
log(numbers[2]);72|JavaScript编程思想:从ES5到ES9numbers[2]会返回在变量numbers的数组实例中,其索引值为2(第3个)的元素值1314.
numbers[1]=2591.
8;数值2591.
8被存为在变量numbers数组实例中,其索引值为1(第2个)的元素值.
console.
log(numbers);显示出[520,2591.
8,1314,2013,2014]的信息.
console.
log(numbers.
length);numbers.
length会返回变量numbers数组实例中的元素个数.
console.
log(profile);在网页浏览器的调试工具【Console】面板中,显示出可展开的["Tommy","male",33,Array(2)]信息.
展开上述信息之后,可看见Array(2)代表子数组实例[180,70].
在此,应该为整数值72的,却被显示为如下屏幕快照里的整数值70,是因为调试工具的运行机制,即时响应了随后源代码的执行结果.
console.
log(profile[0]);profile[0]会返回在变量profile的数组实例中,其索引值为0(第1个)的元素的数据"Tommy".
console.
log(profile[2]);profile[2]会返回在变量profile的数组实例中,其索引值为2(第3个)的元素的数值33.
console.
log(profile[3][0]);console.
log(profile[3][1]);profile[3]会返回在变量profile的数组实例中,其索引值为3(第4个)的元素的数据,也就是子数组实例[180,72].
所以,profile[3][0]会返回在子数组实例[180,72]中,其索引值为0(第1个)的元素的数值180.
profile[3][1]则会返回在子数组实例[180,72]中,其索引值为1(第2个)的元素的数值72.
profile[3][1]=70;此语句使得在profile[3]所代表的子数组实例[180,72]中,其索引值为1(第2个)的元素的数值,被修改成为70.
因此,子数组实例变更为[180,70].
console.
log(profile.
length);profile.
length会返回在变量profile的数组实例中,其第1层元素的个数4.
console.
log(profile[3].
length);第3章数据类型|73profile[3]代表子数组实例[180,72].
profile[3].
length会返回子数组实例[180,72]的元素个数2.
console.
log(numbers[numbers.
length]);numbers.
length会返回变量numbers的数组实例中的元素个数5.
在变量numbers的数组实例中,若其索引值为5,则代表第6个元素的索引值.
在变量numbers的数组实例中,一开始并无第6个元素,所以,numbers[numbers.
length]如同numbers[5]的语法,会返回undefined.
console.
log(profile[profile.
length]);profile.
length会返回变量profile的数组实例中的元素个数4.
在变量profile的数组实例中,若其索引值为4,则代表第5个元素的索引值.
在变量profile的数组实例中,一开始并无第5个元素,所以profile[profile.
length]如同是profile[4]的语法,会返回undefined.
console.
log(newone[0]);console.
log(newone[newone.
length]);因为变量newone一开始为内含6个空元素的数组实例,所以newone[0]会返回undefined,newone.
length会返回变量newone的数组实例中的元素个数6.
在变量newone的数组实例中,若其索引值为6,则代表第7个元素的索引值.
然而,一开始并无第7个元素,所以newone[newone.
length]如同是newone[7]的语法,会返回undefined.
3.
4对象类型对象(object)通过属性(property)和方法(method)/函数(function),模拟在真实世界中,具有身份数据(identitydata)和表现特征行为(characteristicbehavior)的物体(object).
关于对象类型的理解,可参考如下示例.
【3-4---Object-data-type.
js】//letitem01={};letitem01=newObject();item01.
name='TabletPC';item01.
price=1000;item01.
origin='China';item01['manufacturedate']='2018/12/15';item01['color']='RoyalBlue';item01['']='secretdata.
emptypropertynameconsole.
log(item01);console.
log(item01['']);console.
log(item01.
color);console.
log(item01['manufacturedate']);console.
log(item01.
price);item01.
price=900;74|JavaScript编程思想:从ES5到ES9item01['color']='Gold';console.
log(item01);【相关说明】//letitem01={};letitem01=newObject();通过关键字new和Object对象的构造函数Object()的语法,可返回Object对象的空实例(emptyinstance),或称为空的Object对象实例.
在此,【=newObject()】等同于【={}】的语法;而且此语句声明了初始数据为空的Object对象实例的变量item01.
item01.
name='TabletPC';item01.
price=1000;item01.
origin='China';通过变量item01衔接点运算符【.
】,可动态创建变量item01的Object对象实例的3个新属性name、price、origin及其个别的数据'TablePC'、1000、'China'.
item01['manufacturedate']='2018/12/15';item01['color']='RoyalBlue';item01['']='secretdata.
emptypropertyname通过变量item01衔接中括号运算符[],亦可动态创建变量item01的Object对象实例的3个新属性manufacturedate、color、'',以及其个别的数据'2018/12/15'、'RoyalBlue'、'secretdata.
.
.
'.
值得注意的是,和衔接点运算符【.
】比起来,衔接中括号运算符[]的方式,可创建具有如下特殊名称的属性:带有空格(space)字符的属性名称,例如【manufacturedate】.
空(empty)的属性名称,例如【''】.
console.
log(item01);此语句使得网页浏览器在调试工具【Console】面板中,显示出如下信息:console.
log(item01['']);item01['']返回空属性对应的数据"secretdata.
.
.
".
console.
log(item01.
color);item01.
color返回属性color对应的数据"RoyalBlue".
第3章数据类型|75console.
log(item01['manufacturedate']);item01['manufacturedate']返回属性manufacturedate对应的数据"2018/12/15".
console.
log(item01.
price);item01.
price返回属性price对应的数值1000.
item01.
price=900;此语句使得变量item01的属性price,重新被赋予整数值900.
item01['color']='Gold';此语句使得变量item01的属性color,重新被赋予字符串'Gold'.
console.
log(item01);再次通过此语句,查看变量item01的数据是否被变更了.
3.
5字符串类型字符串(string)是具有一串字符(character)的文本数据.
在各种应用程序的画面当中,显示给用户观看的文本,即是持续由多个字符串,拼凑而成的产物.
3.
5.
1一般字符串在JavaScript语言中,字符串的字面量(literal)均以【内含一串字符】的一对单引号或双引号来表示.
关于一般字符串的运用,请看下面的示例.
【3-5-1-common-strings.
js】letsentence='Hi,\n\tlongtimenosee!
\nhowareyoutoday\n\nBestRegards,\nAlex';console.
log(sentence);sentence="Limit'3'daysand\"5\"persons.
";console.
log(sentence);sentence='\\Itcosts\'370\'dollars.
\\';console.
log(sentence);sentence='Alexlovinglyloves'+'lovelybelovedof'+'Daisy.
';console.
log(sentence);sentence='Alexlovinglyloves\76|JavaScript编程思想:从ES5到ES9lovelybelovedof\Daisy.
';console.
log(sentence);console.
log(sentence[0]);console.
log(sentence[1]);console.
log(sentence[2]);console.
log(sentence[3]);console.
log('');console.
log(sentence.
charAt(0));console.
log(sentence.
charAt(1));console.
log(sentence.
charAt(2));console.
log(sentence.
charAt(3));【相关说明】letsentence='Hi,\n\tlongtimenosee!
\nhowareyoutoday\n\nBestRegards,\nAlex';此语句声明了初始数据为字符串的变量sentence.
在此字符串中,存在多个换行(newline)字符'\n',以及间隔至多如同8个空格的制表(tab)字符'\t'.
console.
log(sentence);此语句显示出变量sentence的如下数据字符串:Hi,longtimenosee!
howareyoutodayBestRegards,Alexsentence="Limit'3'daysand\"5\"persons.
";此语句赋予新的字符串字面量,给变量sentence.
在此语句中,通过一对双引号【""】,容纳字符串.
然而,在此双引号之内,还存在其他单引号与双引号.
容纳字符串的一对双引号【""】或单引号【''】,不可以冲突于其内部的双引号或单引号!
其内部发生冲突的引号左侧,必须衔接反斜杠(backslash)字符才行,例如:console.
log(sentence);此语句显示出变量sentence的数据字符串【Limit'3'daysand"5"persons.
】.
sentence='\\Itcosts\'370\'dollars.
\\';此语句将新的字符串字面量,赋给变量sentence.
在此语句中,通过一对单引号【''】容纳字符串.
然而,在单引号之内,还存在反斜杠和其他单引号字符.
第3章数据类型|77在字符串内,单引号、反斜杠均是特殊字符,所以必须在其左侧,衔接额外的反斜杠字符,成为【\\】或【\'】,才能正常呈现在信息里.
console.
log(sentence);此语句显示出变量sentence的数据字符串【\Itcosts'370'dollars.
\】.
sentence='Alexlovinglyloves'+'lovelybelovedof'+'Daisy.
';此语句被分成3行,在等号右侧,借助加法运算符【+】,进行3个字符串的合并运算.
console.
log(sentence);此语句显示出多个字符串被合并之后的新字符串'AlexlovinglyloveslovelybelovedofDaisy.
'.
sentence='Alexlovinglyloves\lovelybelovedof\Daisy.
';此语句亦被分成3行,在等号右侧,借助反斜杠字符,串接字符串的各个片段.
欲使用此法,在各个反斜杠字符的右侧,不可再加上包括空格(space)在内的任何字符.
console.
log(sentence);此语句亦显示出多个字符串被合并之后的新字符串'AlexlovinglyloveslovelybelovedofDaisy.
'.
console.
log(sentence[0]);console.
log(sentence[1]);console.
log(sentence[2]);console.
log(sentence[3]);变量sentence目前的数据为字符串'AlexlovinglyloveslovelybelovedofDaisy.
'.
所以,将变量sentence的数据字符串,视为内含多个字符的数组实例时,每个元素的数据,即为各个单一字符.
这4个语句分别显示出在变量sentence的数据字符串里,其第1个至第4个元素的数据字符'A'、'l'、'e'与'x'.
console.
log(sentence.
charAt(0));console.
log(sentence.
charAt(1));console.
log(sentence.
charAt(2));console.
log(sentence.
charAt(3));这4个语句较为正统,和前面4个语句有异曲同工之妙,亦可显示出在变量sentence的数据字符串里,其第1个至第4个元素的数据字符'A'、'l'、'e'与'x'.
3.
5.
2格式化字符串(ES6)在JavaScript语言中,所谓的格式化字符串(formattingstring)的正式名称为模板字面量(templateliteral),可用来嵌入待评估的表达式.
当这些表达式被评估完成而返回特定数据时,格式化字符串才能被确认最终的模样.
关于格式化字符串的运用,可参考如下示例.
78|JavaScript编程思想:从ES5到ES9【3-5-2-string-interpolations.
js】varusers=[{name:'John',age:'33',gender:'male'},{name:'Jessica',age:'27',gender:'female'},{name:'Daisy',age:'33',gender:'female'},{name:'Sean',age:'24',gender:'male'}];varnations=['China','Canada','America','NewZeland'];vardays_amount=5;varflight_message=`${users[1].
name}decidestoflightto${nations[0]}after${days_amount}days.
`;console.
log(flight_message);flight_message=`${users[3].
name}decidestoflightto${nations[2]}after${days_amount}days.
`;console.
log(flight_message);varitems=[{product_id:15023,price:330},{product_id:16002,price:500}]varcheckout_message=`Thisproductcosts${items[1].
price*0.
8}.
`;console.
log(checkout_message);varstring01='Hello\nEarth!
';varstring02=`Hello\nEarth!
`;varstring03=String.
raw`Hello\nEarth!
`;console.
log(string01);console.
log(string02);console.
log(string03);number_digits='1234567';//string04=String.
raw({raw:'abcdefg'},'1','','2','','3','','4','','5','','6','','7');string04=String.
raw({raw:'abcdefg'},.
.
.
number_digits);console.
log(string04);【相关说明】varusers=[{name:'John',age:'33',gender:'male'},第3章数据类型|79{name:'Jessica',age:'27',gender:'female'},{name:'Daisy',age:'33',gender:'female'},{name:'Sean',age:'24',gender:'male'}];此语句声明了初始数据为【内含4个对象实例的数组实例】的变量users.
varnations=['China','Canada','America','NewZeland'];此语句声明了初始数据为【内含多个字符串的数组实例】的变量nations.
vardays_amount=5;此语句声明了初始数值为整数5的变量days_amount.
varflight_message=`${users[1].
name}decidestoflightto${nations[0]}after${days_amount}days.
`;此语句声明了初始数据为格式化字符串的变量flight_message.
格式化字符串必须放入一对反引号(backquote)【``】中.
在格式化字符串里,可通过${变量名称}或${可评估的表达式}的语法,将特定变量的数据或者表达式被评估之后的数据,放置于格式化字符串里.
console.
log(flight_message);此语句显示出变量flight_message的数据,也就是已经被转换完成的字符串'JessicadecidestoflighttoChinaafter5days.
'.
flight_message=`${users[3].
name}decidestoflightto${nations[2]}after${days_amount}days.
`;此语句使得变量flight_message,被赋予另一个格式化字符串.
console.
log(flight_message);此语句显示出变量flight_message的数据,也就是已经被转换完成的字符串'SeandecidestoflighttoAmericaafter5days.
'.
varitems=[{product_id:15023,price:330},{product_id:16002,price:500}]此语句声明了初始数据为【内含对象实例的数组实例】的变量items.
varcheckout_message=`Thisproductcosts${items[1].
price*0.
8}.
`;此语句声明了初始数据为格式化字符串的变量checkout_message.
console.
log(checkout_message);此语句显示出变量checkout_message的数据,也就是已经被转换完成的字符串'Thisproductcosts400.
'.
varstring01='Hello\nEarth!
';此语句通过单引号【''】,声明了初始数据为一般字符串的变量string01.
80|JavaScript编程思想:从ES5到ES9varstring02=`Hello\nEarth!
`;此语句通过反引号【``】,声明了初始数据为格式化字符串的变量string02.
varstring03=String.
raw`Hello\nEarth!
`;此语句通过内置的String对象的函数raw(),保留其中各字符的原始编码,并声明了初始数据为原始(raw)字符串的变量string03.
也就是说,在字符串里的【\n】,已经被视为一般的字符【\】与【n】,而不再具有换行(newline)的特征.
值得注意的是,raw()明明是一个函数,在此却不能衔接一对小括号,而是衔接一对反引号,以实现出一个原始字符串.
console.
log(string01);console.
log(string02);这两个语句显示的信息相同,具体如下:HelloEarth!
console.
log(string03);此语句显示的信息是【Hello\nEarth!
】,【\n】的两个字符【\】与【n】均被保留了下来.
number_digits='1234567';此语句声明了初始数据为字符串的变量number_digits.
//string04=String.
raw({raw:'abcdefg'},'1','','2','','3','','4','','5','','6','','7');string04=String.
raw({raw:'abcdefg'},.
.
.
number_digits);等号右侧的String.
raw(),会返回交叉分组之后的字符串"a1b2c3d4e5f6g7".
在此,如下语法是等价的:String.
raw({raw:'abcdefg'},.
.
.
number_digits)String.
raw({raw:'abcdefg'},'1','','2','','3','','4','','5','','6','','7')console.
log(string04);此语句显示出变量string04的数据,也就是被交叉分组之后的字符串"a1b2c3d4e5f6g7".
3.
5.
3日期与时间格式的字符串(ES6)内含日期(date)与时间(time)相关数据的字符串,可被称为日期与时间格式的字符串.
关于日期与时间格式的字符串的运用,可参考如下示例.
【3-5-3-date-and-time-strings.
js】vardt_cn=newIntl.
DateTimeFormat('cn');vardt_en=newIntl.
DateTimeFormat('en');vardt_de=newIntl.
DateTimeFormat('de');第3章数据类型|81origin_datetime=newDate('2018-01-23');console.
log(origin_datetime.
toDateString());console.
log(origin_datetime.
toLocaleDateString());console.
log('');dt01=dt_cn.
format(origin_datetime);dt02=dt_en.
format(origin_datetime);dt03=dt_de.
format(origin_datetime);console.
log(dt01);console.
log(dt02);console.
log(dt03);【相关说明】vardt_cn=newIntl.
DateTimeFormat('cn');Intl.
DateTimeFormat对象的构造函数Intl.
DateTimeFormat("cn"),会返回中文/中国(cn,China)格式的Intl.
DateTimeFormat对象实例.
后续源代码可借助变量dt_cn中的Intl.
DateTimeFormat对象实例,将其他格式的日期与时间,表示成为中文格式的日期与时间.
vardt_en=newIntl.
DateTimeFormat('en');Intl.
DateTimeFormat对象的构造函数Intl.
DateTimeFormat("en")会返回英文(en,English)格式的Intl.
DateTimeFormat对象实例.
后续源代码可借助变量dt_en中的Intl.
DateTimeFormat对象实例,将其他格式的日期与时间,表示成为英文格式的日期与时间.
vardt_de=newIntl.
DateTimeFormat('de');Intl.
DateTimeFormat对象的构造函数Intl.
DateTimeFormat("de")会返回德文/德国(de,DENICeGforGermany)格式的Intl.
DateTimeFormat对象实例.
后续源代码可借助变量dt_de中的Intl.
DateTimeFormat对象实例,将其他格式的日期与时间,表示成为德文格式的日期与时间.
origin_datetime=newDate('2018-01-23');此语句声明了变量origin_datetime,并被初始化为【日期是2018/01/23】的Date对象实例.
在此,Date('2018-01-23')或Date('2018/01/23')均可被解读成功.
console.
log(origin_datetime.
toDateString());origin_datetime.
toDateString()会返回字符串'TueJan232018'.
console.
log(origin_datetime.
toLocaleDateString());origin_datetime.
toLocaleDateString()会返回字符串'2018/1/23'.
dt01=dt_cn.
format(origin_datetime);因为变量dt_cn的数据是Intl.
DateTimeFormat对象实例,所以存在可调用的函数format().
dt_cn.
format(origin_datetime)会返回【在变量origin_datetime的Date对象实例中,其内含的日期与时间,被表示成为中文格式】之后的字符串'2018/1/23'.
82|JavaScript编程思想:从ES5到ES9dt02=dt_en.
format(origin_datetime);因为变量dt_en的数据是Intl.
DateTimeFormat对象实例,所以存在可调用的函数format().
dt_en.
format(origin_datetime)会返回【在变量origin_datetime的Date对象实例中,其内含的日期与时间,被表示成为英文格式】之后的字符串'1/23/2018'.
dt03=dt_de.
format(origin_datetime);因为变量dt_de的数据是Intl.
DateTimeFormat对象的实例,所以存在可调用的函数format().
dt_de.
format(origin_datetime)会返回【在变量origin_datetime的Date对象实例中,其内含的日期与时间,被表示成为德文格式】之后的字符串'23.
1.
2018'.
3.
6集合与地图类型对JavaScript语言来说,集合(set)与地图(map)主要可用来简化编程的负担,是从ECMAScript2015(ES6)版本开始,才具有的数据类型.
3.
6.
1集合类型(ES6)集合(set)内含其数据均不重复的元素,和数学理论中的集合,有着非常相似的含义与原理.
换句话说,在特定集合内,只存在其数据不相同的元素.
关于集合的运用,可参考如下示例.
【3-6-1-Set-data-type.
js】letactions=newSet();actions.
add('read');actions.
add('write').
add('update');actions.
add('delete');actions.
add('read').
add('read').
add('delete').
add('write').
add('update');console.
log(actions);console.
log(actions.
entries());console.
log(actions.
keys());console.
log(actions.
values());console.
log('');for(letelementofactions){console.
log(element);}console.
log('');console.
log(actions.
size);console.
log(actions.
has('hide'));第3章数据类型|83console.
log(actions.
has('write'));【相关说明】letactions=newSet();此语句声明了初始数据为【空的Set对象实例】的变量actions.
actions.
add('read');当前变量actions的数据为一个Set对象实例,因此存在可调用的函数add().
在变量actions的Set对象实例中,添加数据为字符串'read'的新元素.
actions.
add('write').
add('update');此语句使得在变量actions的Set对象实例中,连续添加数据为字符串'write'与'update'的两个新元素.
actions.
add('delete');此语句使得在变量actions的Set对象实例中,添加数据为字符串'delete'的新元素.
actions.
add('read').
add('read').
add('delete').
add('write').
add('update');在变量actions的Set对象实例中,连续添加数据为字符串'read'、'read'、'delete'、'write'与'update'的5个新元素.
在这5个新元素里,存在重复的数据字符串;所以,被添加至变量actions的Set对象实例中的时候,重复的元素会自动被排除在外.
console.
log(actions);此语句显示出变量actions的Set对象实例【Set(4){"read","write","update","delete"}】的信息.
在此,亦可看出在这个Set对象实例中,的确没有数据相同的元素.
console.
log(actions.
entries());console.
log(actions.
keys());console.
log(actions.
values());这3个语句皆显示出相同的信息【SetIterator{"read","write","update","delete"}】.
其中,SetIterator具有集合迭代器的含义.
for(letelementofactions){console.
log(element);}通过循环语句for.
.
.
of的迭代处理,可在每次循环中,显示出在变量actions的Set对象实例中,其特定元素的如下数据字符串:readwriteupdatedeleteconsole.
log(actions.
size);84|JavaScript编程思想:从ES5到ES9actions.
size会返回Set对象实例中的元素个数4.
console.
log(actions.
has('hide'));actions.
has('hide')会返回false,意味着在Set对象实例中,并无数据字符串为'hide'的元素.
console.
log(actions.
has('write'));actions.
has('write')会返回true,代表着在Set对象实例中,存在数据字符串为'write'的元素.
3.
6.
2地图类型(ES6)地图(map)内含【键名(keyname)对应到值(value)/数据(data)】的组合.
地图与对象(object)极为相似,只是节省了对象的累赘和限制.
关于地图的运用,可参考如下示例.
【3-6-2-Map-data-type.
js】letitems=newMap();items.
set('slipper',50);items.
set('shoes',200);items.
set('pants',100).
set('shirt',150);console.
log(items);console.
log(items.
size);console.
log(items.
entries());console.
log(items.
keys());console.
log(items.
values());for(let[product,price]ofitems){console.
log(`One${product}costs${price}.
`);}【相关说明】letitems=newMap();此语句声明了初始数据为【空的Map对象实例】的变量items.
items.
set('slipper',50);变量items的数据,当前为一个Map对象实例,因此存在可调用的函数set().
此语句使得在变量items的Map对象实例中,被添加键名为slipper、值为50的新元素.
items.
set('shoes',200);此语句使得在变量items的Map对象实例中,被添加键名为shoes、值为200的新元素.
items.
set('pants',100).
set('shirt',150);此语句使得在变量items的Map对象实例中,连续添加键名分别为pants与shirt、值分别为100与150的两个新元素.
第3章数据类型|85console.
log(items);此语句显示出在变量items的Map对象实例【Map(4){"slipper"=>50,"shoes"=>200,"pants"=>100,"shirt"=>150}】的信息.
console.
log(items.
size);items.
size会返回Map对象实例中的元素个数4.
console.
log(items.
entries());此语句显示出MapIterator{"slipper"=>50,"shoes"=>200,"pants"=>100,"shirt"=>150}的信息.
其中,MapIterator具有地图迭代器的含义.
console.
log(items.
keys());此语句显示出MapIterator{"slipper","shoes","pants","shirt"}的信息.
console.
log(items.
values());显示出MapIterator{50,200,100,150}的信息.
for(let[product,price]ofitems){console.
log(`One${product}costs${price}.
`);}通过此循环语句for.
.
.
of的迭代处理,可在每次循环中,显示出在变量items的Set对象实例中,特定元素的如下数据字符串:Oneslippercosts50.
Oneshoescosts200.
Onepantscosts100.
Oneshirtcosts150.
值得注意的是,在上述循环语句的小括号里,【let[product,price]ofitems】的语句,使得在每次循环中:变量product的数据,成为在变量items的Map对象实例中,特定元素的键名,例如slipper.
变量price的数据,成为在变量items的Map对象实例中,特定元素的值,例如50.
3.
7数据类型的转换(ES6)对于各编程语言来说,特定变量在不同的时间点上,可被赋予不同类型的数据!
在JavaScript引擎中,通过自动转换机制或者一些内置函数,可使得特定变量的数据,从原来的数据类型,转换成为新的数据类型.
最常见的数据类型的转换,莫过于【其他数据→字符串】和【字符串→数值】.
关于数据类型的转换的综合运用,可参考如下示例.
86|JavaScript编程思想:从ES5到ES9【3-7---data-type-conversions.
js】letdigital_string='123';result=Number(digital_string);console.
log(result);digital_string='0o123';result=Number(digital_string);console.
log(result);digital_string='0x123';result=Number(digital_string);console.
log(result);result=parseInt(digital_string);console.
log(result);result=Math.
round(digital_string);console.
log(result);console.
log('');///digital_string='35.
62';result=Math.
floor(digital_string);console.
log(result);digital_string='28.
2';result=Math.
ceil(digital_string);console.
log(result);digital_string='12.
5';result=Math.
round(digital_string);console.
log(result);///letvalue=53.
8125;result=value.
toString(2);console.
log(result);result=value.
toString(8);console.
log(result);result=value.
toString(16);第3章数据类型|87console.
log(result);【相关说明】letdigital_string='123';此语句声明了初始数据为字符串'123'的变量digital_string.
result=Number(digital_string);通过内置的Number对象的构造函数Number(),将变量digital_string的数据字符串'123',转换成十进制整数值123.
在转换过程中,所有空格(space)字符皆会被过滤掉.
digital_string='0o123';将字符串'0o123',赋给变量digital_string.
result=Number(digital_string);通过内置的Number对象的构造函数Number(),将变量digital_string的数据字符串'0o123',先视为成八进制整数码123,再转换成为等价的十进制整数值83.
digital_string='0x123';将字符串'0x123'赋给变量digital_string.
result=Number(digital_string);通过内置的Number对象的构造函数Number(),将变量digital_string的数据字符串'0x123',先视为十六进制整数码123,再转换成为等价的十进制整数值291.
result=parseInt(digital_string);result=Math.
round(digital_string);这两个语句皆可达成【将字符串'0x123',转换成为等价的十进制整数值291】的任务.
digital_string='35.
62';result=Math.
floor(digital_string);这两个语句将字符串'35.
62',转换成为十进制整数值35.
digital_string='28.
2';result=Math.
ceil(digital_string);这两个语句将字符串'28.
2',转换成为十进制整数值29.
digital_string='12.
5';result=Math.
round(digital_string);这两个语句将字符串'12.
5',转换成为十进制整数值13.
letvalue=53.
8125;此语句声明了初始数值为53.
8125的变量value.
result=value.
toString(2);value.
toString(2)会返回转换之后的二进制数码110101.
1101.
88|JavaScript编程思想:从ES5到ES9result=value.
toString(8);value.
toString(8)会返回转换后的八进制数码65.
64.
result=value.
toString(16);value.
toString(16)会返回转换后的十六进制数码35.
d.
3.
8练习题1.
在JavaScript语言里,应该使用什么语句,才能将浮点数25.
75,分别表示成为二进制、八进制和十六进制数码的字符串2.
在JavaScript语言里,应该使用什么语句,才能将二进制数码110111011,直接转换成为十六进制数码3.
在JavaScript语言里,应该使用什么语句,才能直接将二进制数码101100011100、八进制数码1275、十六进制数码51cf的总和,转换成二进制数码4.
已知变量x与y,请将3x2+2(x1)2y+2xy2+5y3,编写成为JavaScript语言中的算术表达式.
5.
已知有如下主要表达式:letproduct={item01:['fruit_set',100],item02:['sticker_set',250],item03:['magnet_set',350],item04:['drink_set',150],item05:['pizza_set',300]};请编写【将上述各个整数值的总和,赋给变量result】的语句.
6.
说明原始常量NaN、Infinity和undefined的含义.
7.
执行如下JavaScript源代码片段之后,变量result的结果值是什么letnum01=28.
56,num02=32.
47;letresult;result=parseInt(num01)+Math.
trunc(num01)+Math.
floor(num01)+Math.
round(num01)+Math.
ceil(num01);result+=parseInt(num02)+Math.
trunc(num02)+Math.
floor(num02)+Math.
round(num02)+Math.
ceil(num02);8.
请编写JavaScript源代码,使得变量price的数值72583000,显示成为货币数值格式的字符串'CN$72,583,000.
00'.
9.
列举两种JavaScript语法,来计算并显示【768where,3=xx】的数值.
10.
列举两个等价于【price>=300&&amount10,"tabletPC"=>7,"notebookPC"=>3,"desktopPC"=>20}其较为简短的JavaScript源代码应该是什么18.
已知变量num的数值为十进制整数值201314,请编写【带有置入变量名称的模板字面量,并且显示如下信息】的JavaScript源代码:变量num的:十进制数值=201314二进制数码=110001001001100010八进制数码=611142十六进制数码=31262