第2章 JavaScript语法基础_第1页
第2章 JavaScript语法基础_第2页
第2章 JavaScript语法基础_第3页
第2章 JavaScript语法基础_第4页
第2章 JavaScript语法基础_第5页
已阅读5页,还剩60页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

第2章JavaScript语法基础

夏敏捷

《微信小程序开发教程》目录2.1在HTML中使用JavaScript语言2.2基本语法2.3常用控制语句2.3.1选择结构语句2.3.2循环结构语句2.4函数2.5JavaScript面向对象程序设计2.6JavaScript内置对象2.7ES6简介第2章JavaScript语法基础教学目标:本章将会介绍JavaScript的核心语法。掌握JavaScript的面向对象编程思想以及有关对象的基本概念初步掌握创建和使用自定义的类和对象。了解ES6的语法。2.1JavaScript语言概述JavaScript主要用于以下三个领域:浏览器:得到所有浏览器的支持,只要有网页的地方就有JavaScript。服务器:借助node.js运行环境,JavaScript已经成为很多开发者进行后端开发的选择之一。微信小程序:小程序逻辑开发的语言。标准ECMAScript通常缩写为ES。在微信小程序中通常使用ES5和ES6版本。

微信小程序2.1.2运行JavaScript语言1.在浏览器中运行在HTML文件中使用JavaScript脚本时,JavaScript代码需要出现在<ScriptLanguage="JavaScript">和</Script>之间。【例2-1】一个简单的在HTML文件中使用JavaScript脚本实例。另外一种插入JavaScript程序的方法是把JavaScript代码写到一个.js文件当中,然后在HTML文件中引用该js文件,方法如下:<scriptsrc="***.js文件"></script>2.1.2运行JavaScript语言JavaScript是一种解释性编程语言,其源代码在发往客户端执行之前不需经过编译,而是将文本格式的字符代码发送给客户端由浏览器解释执行。注意与Java的区别,Java的源代码在传递到客户端执行之前,必须经过编译,因而客户端上必须具有相应平台上的解释器,它可以通过解释器实现独立于某个特定的平台编译代码的束缚。2.1.2运行JavaScript语言2.在服务器中运行搭建node运行环境后,通过命令行执行JS文件。例如:nodeoutput.js3.在微信小程序中运行在微信小程序中,JavaScript需要单独保存在JS文件中,即外联式。小程序框架对此进行了优化,只要按目录规范保证JS文件与WXML文件同名,则无须使用<scriptsrc="***.js文件"></script>引入即可使用。在微信开发工具中,单击console选项卡可以查看JS代码文件中console.log()输出的调试信息。例如:variNum=10;iNum*=2;console.log(iNum);console选项卡例如:variNum=10;iNum*=2;console.log(iNum);2.2基本语法2.2.1数据类型JavaScript包含下面5种原始数据类型。1.Undefined:即为未定义类型,用于不存在或者没有被赋初始值的变量或对象的属性2.Null:

作用是表明数据空缺的值。一般将Undefined型和Null型等同对待。3.Boolean:取值为ture或false,分别表示逻辑真和假4.String:字符型数据。JavaScript不区分单个字符和字符串。用双引号或单引号引起来。varnameA="Tom";varnameB='Tom';5.Number:即为数值型数据,包括整数型和浮点型。varmyDataA=8;varmyDataB=6.3;JavaScript脚本语言除了支持上述基本数据类型外,也支持组合类型,如数组Array和对象Object等。2.2基本语法2.2.2常量和变量1.常量常量是内存中用于保存固定值的单元,在程序中常量的值不能发生改变。2.变量变量是内存中命名的存储位置,可以在程序中设置和修改变量的值。在JavaScript中,可以使用var关键字声明变量。2.2.3注释JavaScript支持2种类型的注释字符。1.//2./*...*/2.2基本语法2.2.4运算符和表达式1.算术运算符算术运算符可以实现数学运行,包括加(+)、减(-)、乘(*)、除(/)和求余(%)。2.赋值运算符JavaScript脚本语言的赋值运算符包含“=”、“+=”、“—=”、“*=”、“/=”、“%=”、“&=”、“^=”等,如表2-1所示。3.关系运算符JavaScript脚本语言中用于比较两个数据的运算符称为比较运算符,包括“==”、“!=”、“>”、“<”、“<=”、“>=”等,其具体作用见表2-2所示。4.逻辑运算符JavaScript脚本语言的逻辑运算符包括“&&”、“||”和“!”等,用于两个逻辑型数据之间的操作,返回值的数据类型为布尔型。逻辑运算符的功能如表2-3所示。2.2基本语法2.2.4运算符和表达式5.位运算符位移运算符用于将目标数据(二进制形式)往指定方向移动指定的位数。JavaScript脚本语言支持“<<”、“>>”和“>>>”等位移运算符,其具体作用如见表2-4:6.条件运算符在JavaScript脚本语言中,“?:”运算符用于创建条件分支。a>b?a:b7.逗号运算符使用逗号运算符可以在一条语句中执行多个运算,例如:variNum1=1,iNum=2,iNum3=3;8.typeof运算符typeof运算符用于表明操作数的数据类型,返回数值类型为一个字符串。2.3常用控制语句2.3.1选择结构语句1.if语句2.if...else...语句2.3常用控制语句3.if...elseif…else语句【例2-3】下面是一个显示当前系统日期的JavaScript代码,其中使用到if...elseif…else语句。下面是一个显示当前系统日期的JavaScript代码//显示当前系统日期

d=newDate();console.log("今天是");if(d.getDay()==1){console.log("星期一");}elseif(d.getDay()==2){console.log("星期二");}elseif(d.getDay()==3){console.log("星期三");}elseif(d.getDay()==4){console.log("星期四");}

elseif(d.getDay()==5){console.log("星期五");}elseif(d.getDay()==6){console.log("星期六");}else{console.log("星期日");}2.3常用控制语句4.switch语句switch(表达式){case值1:

语句块1break;case值2:

语句块2break;

……case值n:

语句块nbreak;default:

语句块n+1}【例2-5】将例2-4的按分数输出其等级使用switch语句实现。按分数输出其等级//使用switch语句实现按分数输出其等级varMyScore=89;

//请输入成绩score=parseInt(MyScore/10)//parseInt取整

switch(score/10){case10:case9:console.log("优");break;case8:console.log("良");break;case7:console.log("中");break;case6:console.log("及格");break;default:console.log("不及格");}if...elseif…else语句实现按分数输出其等级varscore=89;//请输入成绩if(score>=90)console.log("优");elseif(score>=80&&score<90)console.log("良");elseif(score>=70)console.log("中");elseif(score>=60)console.log("及格");elseconsole.log("不及格");2.3常用控制语句2.3.2循环结构语句1while语句while语句的语法格式为:while(表达式){

循环体语句}【例2-6】用while循环来计算1+2+3...+98+99+100的值。//计算1+2+3...+98+99+100的值vartotal=0;vari=1;while(i<=100){total+=i;i++;}console.log(total);2.3常用控制语句2.3.2循环结构语句2.do…while语句do-while语句的语法格式如下:do{

循环体语句}while(表达式);【例2-7】用do…while循环来计算1+2+3...+98+99+100的值。//计算1+2+3...+98+99+100的值vartotal=0;vari=1;do{total+=i;i++;}while(i<=100);console.log(total);2.3常用控制语句3.for语句for循环语句是循环结构语句,按照指定的循环次数,循环执行循环体内语句(或语句块),其基本结构如下:for(表达式1;表达式2;表达式3){循环体语句}【例2-8】用for循环来计算1+2+3...+98+99+100的值。//计算1+2+3...+98+99+100的值vartotal=0;for(vari=1;i<=100;i++){total+=i;}console.log(total);2.3常用控制语句4.continue语句continue语句的一般格式为:continue;该语句只能用在循环结构中。当在循环结构中遇到continue语句时,则跳过continue语句后的其他语句,结束本次循环,并转去判断循环控制条件,以决定是否进行下一次循环。5.break语句break语句的一般格式为:break;该语句只能用于两种情况:(1)用在switch结构中,当某个case分支执行完后,使用break语句跳出switch结构。(2)用在循环结构中,用break语句来结束循环。如果放在嵌套循环中,则break语句只能结束其所在的那层循环。2.4函数函数(function)由若干条语句组成,用于实现特定的功能。函数包含函数名、若干参数和返回值。2.4.1创建自定义函数function函数名(参数列表){

函数体}functionPrintWelcome(){document.write("欢迎使用JavaScript");}2.4函数2.4.2调用函数1.在JavaScript中使用函数名来调用函数在JavaScript中,可以直接使用函数名来调用函数。无论是内置函数还是自定义函数,调用函数的方法都是一致的。2.在HTML中使用"javascript:"方式调用JavaScript函数在HTML中的a链接中可以使用"javascript:"方式调用JavaScript函数,方法如下:<ahref="javascript:函数名(参数列表)">…</a>3.与事件结合调用JavaScript函数可以将JavaScript函数指定为JavaScript事件的处理函数。当触发事件时会自动调用指定的JavaScript函数。<buttonbindtap="Hello1">设置</button>

Hello1:function(){console.log('单击我了')}2.4函数//计算并打印num1和num2之和functionsum(num1,num2){console.log(num1+num2);}sum(1,2);//结果是3与事件结合调用JavaScript函数<buttonbindtap="Hello1">设置</button>Hello1:function(){console.log('单击我了')}2.4函数2.4.3变量的作用域vara=100;

//全局变量functionsetNumber(){vara=10; //局部变量console.log(a); //打印局部变量a}setNumber();console.log("<BR>");console.log(a); //打印全局变量a程序运行结果:10<BR>1002.4函数2.4.3变量的作用域在函数中定义的变量被称为局部变量。局部变量只在定义它的函数内部有效,在函数体之外,即使使用同名的变量,也会被看作是另一个变量。相应地,在函数体之外定义的变量是全局变量。全局变量在定义后的代码中都有效,包括它后面定义的函数体内。如果局部变量和全局变量同名,则在定义局部变量的函数中,只有局部变量是有效的。2.4函数2.4.4函数的返回值使用return语句可以返回函数值并退出函数function函数名(){return返回值;}2.4.5定义函数库JavaScript函数库是一个.js文件,其中包含函数的定义。在HTML文件中引用函数库js文件的方法如下:<scriptsrc="函数库js文件"></script><script>//引用js文件中的函数</script>求(m,n)两个数字之间的和,代码如下:functiongetTotal(m,n){vartotal=0;if(m>=n){returnfalse;//n必需大于m否则无意义}for(vari=m;i<=n;i++){total+=i;}returntotal;}console.log(getTotal(1,10));2.4函数2.4.6JavaScript内置函数1.alert()函数alert()函数用于弹出一个消息对话框,该对话框包括一个“确定”按钮。2.confirm()函数confirm()函数用于显示一个请求确认对话框,包含一个“确定”按钮和一个“取消”按钮。在程序中,可以根据用户的选择决定执行的操作2.4函数3.parseFloat()函数parseFloat()函数用于将字符串转换成浮点数字形式。语法如下:parseFloat(str)参数str是待解析的字符串。函数返回解析后的数字。4.parseInt()函数parseInt()函数用于将字符串转换成整型数字形式。语法如下:parseInt(str,radix)参数str是待解析的字符串;参数radix可选。表示要解析的数字的进制。该值介于2~36之间。parseInt("10"); //10进制,结果是10parseInt("f",16); //16进制,结果是15parseInt("010",2); //2进制,结果是22.4函数3.isNaN()函数isNaN()用于检验某个值是否为NaN(notanumber不是数字),返回false为数字,返回true为非数字。varnum="123.456789abc";isNaN(num) //结果是trueisNaN("123") //结果是false4.强制类型转换函数用户可以使用强制类型转换函数来转换值的类型。在ECMAScript中可以使用以下3种强制类型转换函数。String(value):把给定的值转换成字符串。类似于toString()方法,但是和它又不同,对null或undefined值toString()会报错。Boolean(value):把给定的值转换成Boolean型。给定的值为空字符串、数字0、undefined或null返回false,其余返回true。Number(value):把给定的值转换成数字(可以是整数或浮点数)。2.4函数vara=String(123);//返回"123"vara=Boolean(0);/返回falsevara=Boolean(undefined);//返回falsevara=Boolean(null);//返回falsevara=Boolean(50);//返回truevara=Number("11.11");//返回11.115.保留几位小数NumberObject.toFixed(位数);toFixed()位数功能是保留几位小数(四舍五入),参数为保留的小数点后位数,返回的值为String类型。vara=13.37.toFixed(4);//返回"13.3700"vara=13.378888.toFixed(2);//返回"13.38"2.5JavaScript面向对象程序设计JavaScript脚本是面向对象(Object-based)的编程语言,它可以将属性和代码集成在一起,定义为类,从而使程序设计更加简单、规范、有条理。通过对象的来访问可大大简化JavaScript程序的设计,并提供直观、模块化的方式进行脚本程序开发。2.5.1

面向对象程序设计思想对象是客观世界存在的人、事和物体等实体。现实生活中存在很多的对象,比如猫、自行车等。不难发现它们有两个共同特征:都有状态和行为。图2-8以自然人构造的对象2.5.1面向对象程序设计思想凡是能够提取一定度量数据并能通过某种途径对度量数据实施操作的客观存在都可以构成一个对象,且用属性来描述对象的状态,使用方法和事件来处理对象的各种行为。下面介绍一些概念。对象(Object):面向对象程序设计思想可以将一组数据和与这组数据有关操作组装在一起,形成一个实体,这个实体就是对象。属性:用来描述对象的状态。通过定义属性值,可以改变对象的状态。如图2-8中,可以定义height表示该自然人身高,字符串HungryOrNot来表示该自然人肚子的状态,HungryOrNot成为自然人的某个属性;方法:也称为成员函数,是指对象上的操作。如图2-8中,可以定义方法Eat()来处理自然人肚子很饿的情况,Eat()成为自然人的某个方法;事件:由于对象行为的复杂性,对象的某些行为需要用户根据实际情况来编写处理该行为的代码,该代码称为事件。在图2-8中,可以定义事件DrinkBeforeEat()来处理自然人肚子很饿同时嘴巴很渴需要先喝水后进食。2.5.2面向对象编程面向对象编程(OPP)是一种计算机编程架构,具有三个最基本的特点:封装、重用性(继承)、多态。(1)类(class):具有相同或相似性质的对象的抽象就是类。

(2)封装:将数据和操作捆绑在一起,定义一个新类的过程就是封装。(3)继承:类之间的关系,在这种关系中,一个类共享了一个或多个其他类定义的属性和行为。

(4)多态:从同一个类中继承得到的子类也具有多态性,即相同的函数名在不同子类中有不同的实现。就如同子女会从父母那里继承到人类共有的特性,而子女也具有自己的特性。实际上,JavaScript语言是通过一种叫做原型(prototype)的方式来实现面向对象编程的。2.5.3JavaScript类的定义和实例化严格的说,JavaScript是基于对象的编程语言,而不是面向对象的编程语言。在面向对象的编程语言中(如Java、C++、C#、PHP等),声明一个类使用class关键字。但是在JavaScript中,没有声明类的关键字,也没有办法对类的访问权限进行控制。JavaScript使用函数来定义类。1.类的定义定义一个Person类:functionPerson(){="张三"; //定义一个属性namethis.sex="男"; //定义一个属性sex

this.say=function(){ //定义一个方法

say()

console.log("我的名字是"++",性别是"+this.sex+"。");}}2.5.3JavaScript类的定义和实例化2.创建对象(类的实例化)创建对象的过程也是类实例化的过程。在JavaScript中,创建对象(即类的实例化)使用new关键字。创建对象语法:newclassName()将上面的Person类实例化:varzhangsan=newPerson();zhangsan.say();运行代码,输出如下内容:大家好,我的名字是张三,性别是男。2.5.3JavaScript类的定义和实例化3.通过对象直接初始化创建对象通过直接初始化对象来创建对象,与定义对象的构造函数方法不同的是,该方法不需要new生成此对象的实例,改写zhangsan对象:<script>//直接初始化对象varzhangsan={name:"张三",sex:"男",say:function(){//定义对象的方法document.write("大家好,我的名字是"++",性别是"+this.sex);}}zhangsan.say();</script>对象直接初始化是一个“名字/值”对列表,最后用一个大括号括起来。“名字/值”对表示对象的一个属性或方法,名和值之间用冒号分隔。2.5.3JavaScript类的定义和实例化3.通过对象直接初始化创建对象上面的zhangsan对象,也可以这样来创建:varzhangsan={}="张三";zhangsan.sex="男";zhangsan.say=function(){return"嗨!大家好,我来了。";}该方法在只需生成一个对象实例并进行相关操作的情况下使用时,代码紧凑,编程效率高,但致命的是,若要生成若干个对象实例,就必须为生成每个对象实例重复相同的代码结构,代码的重用性比较差,不符合面向对象的编程思路,应尽量避免使用该方法创建自定义对象。2.5.4JavaScript访问对象的属性和方法属性是一个变量,用来表示一个对象的特征,如颜色、大小、重量等;方法是一个函数,用来表示对象的操作,如奔跑、呼吸、跳跃等。对象的属性和方法统称为对象的成员。在JavaScript中,可以使用“.”和“[]”来访问对象的属性。1.使用“.”来访问对象属性语法:objectNpertyName其中,objectName为对象名称,propertyName为属性名称。2.使用“[]”来访问对象属性语法:

objectName[propertyName]3.访问对象的方法在JavaScript中,只能使用“.”来访问对象的方法。语法:objectName.methodName()2.5.4JavaScript访问对象的属性和方法【例2-15】创建一个Person对象并访问其成员。functionPerson(){="张三";//定义一个属性namethis.sex="男";//定义一个属性sexthis.age=22;//定义一个属性agethis.say=function(){//定义一个方法say()return"我的名字是"++",性别是"+this.sex+",今年"+this.age+"岁!";}}varzhangsan=newPerson();console.log("姓名:"+);//使用“.”来访问对象属性console.log("性别:"+zhangsan.sex);console.log("年龄:"+zhangsan["age"]);//使用“[]”来访问对象属性console.log(zhangsan.say());//使用“.”来访问对象方法动态添加对象的属性和方法【例2-16】用Person类创建一个对象,向其添加属性和方法。functionPerson(name,sex){//定义类=name;//定义一个属性namethis.sex=sex;//定义一个属性sexthis.say=function(){//定义一个方法say()return"大家好,我的名字是"++",性别是"+this.sex+"。";}}varzhangsan=newPerson("张三","男");//创建对象zhangsan.say();//动态添加属性和方法zhangsan.tel=;//动态添加属性telzhangsan.run=function(){//动态添加方法runreturn"我跑得很快!";}//弹出警告框alert("姓名:"+);alert("姓别:"+zhangsan.sex);alert(zhangsan.say());alert("电话:"+zhangsan.tel);alert(zhangsan.run());2.6JavaScript内置对象JavaScript脚本提供丰富的内置对象(内置类),包括同基本数据类型相关的对象(如String、Boolean、Number)、允许创建用户自定义和组合类型的对象(如Object、Array)和其他能简化JavaScript操作的对象(如Math、Date、RegExp、Function)。了解这些内置对象是JavaScript编程和游戏开发的基础和前提。2.6JavaScript内置对象JavaScript的内置对象(内置类)框架如图所示。2.6.2基类Object所有的JavaScript对象都继承自Object类,后者为前者提供基本的属性(如prototype属性等)和方法(如toString()方法等)。而前者也在这些属性和方法基础上进行扩展,以支持特定的某些操作。基类Object的属性和方法见表2-2所示。2.6.3Date类Date类主要提供获取和设置日期和时间的方法,如getYear()、getMonth()、getDate()等。Date类的常用方法见表2-3所示。2.6.4String类String是JavaScript的字符串类,用于管理和操作字符串数据。可以使用下面2种方法创建String对象:MyStr=newString("这是一个测试字符串");//把参数作为MyStr对象的初始值。MyStr="这是一个测试字符串";//直接对String对象赋值字符串String类只有一个属性length,用来返回字符串的长度。【例2-18】计算String对象的长度。

varMyStr;MyStr=newString("这是一个测试字符串");console.log("“"+MyStr+"”的长度为:"+MyStr.length);

//演示使用String对象的length属性运行结果如下:

“这是一个测试字符串”的长度为:9String类的常用方法见表2-4所示。2.6.4String类【例2-19】演示slice()方法的例子。varstr="Helloworld!"console.log(str.slice(6,11))2.6.5Array类Array数组是在内存中保存一组数据。Array类的常用方法见表2-5所示。1.Array数组创建与使用方法一:可以使用new关键字创建Array对象,方法如下:Array对象=newArray(数组大小)例如下面的语句可以创建一个由3个元素组成的数组cars:varcars=newArray(3);通过下面的方法访问数组元素。数组元素值=数组名[索引]varcars=newArray(3);cars[0]="Audi";cars[1]="BMW";cars[2]="Volvo";方法二:在创建数组对象的时候给元素赋值。varcars=newArray("Audi","BMW","Volvo");方法三:直接赋值。varcars=["Audi","BMW","Volvo"];2.6.5Array类2.数组遍历可以使用for语句遍历数组的所有索引,然后使用数组名[索引]方法访问每个数组元素。【例2-20】使用for语句遍历数组。varMyStr;MyArr=newArray(3);MyArr[0]="中国";MyArr[1]="美国";MyArr[2]="日本";for(vari=0;i<MyArr.length;i++)console.log(MyArr[i]);2.6.5Array类3.数组排序使用Array类的sort()方法可以对数组元素进行排序,sort()方法返回排序后的数组。语法如下:arrayObject.sort(sortby)参数sortby可选,用于规定排序顺序,sortby必须是函数。如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。【例2-22】对数组排序的例子。vararr=newArray(6);arr[0]="George";arr[1]="Johney";arr[2]="Thomas";arr[3]="James";arr[4]="Adrew";arr[5]="Martin";console.log("排序前"+arr);console.log("排序后"+arr.sort());2.6.5Array类4.数组的操作(1)push()方法往数组后面添加数组,并返回数组新长度。vara=["aa","bb","cc"];console.log(a.push("dd"));//输出4console.log(a);//输出aa,bb,cc,dd而unshift()方法可向数组的开头添加一个或更多元素,并返回新的长度。(2)pop()方法和shift()方法pop()方法删除数组最后一个元素,并返回该元素。而shift()方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。vara=["aa","bb","cc"];console.log(a.pop()); //输出ccconsole.log(a.shift()); //输出aa2.6.5Array类(3)slice()方法可从已有的数组中返回选定的元素的一个新数组。语法如下:arrayObject.slice(start,end)(4)join()方法用于把数组中的所有元素连接起来放入一个字符串。

vararr=newArray(3);arr[0]="George";arr[1]="John";arr[2]="Thomas";console.log(arr.join(".")); //输出George.John.Thomas2.6.5Array类5.二维数组数组中的元素又是数组就成为二维数组。创建二维数组方法如下:方法一:先创建一个一维数组,然后该一维数组的所有元素再创建一维数组。varpersons=newArray(3); //创建一个一维数组persons[0]=newArray(2); //每个元素persons[0]又是一维数组persons[1]=newArray(2); //每个元素persons[1]又是一维数组persons[2]=newArray(2); //每个元素persons[2]又是一维数组persons[0][0]="zhangsan";persons[0][1]=25;persons[1][0]="lisi";persons[1][1]=22;persons[2][0]="wangwu";persons[2][1]=32;方法二:先创建一个一维数组,然后该一维数组的所有元素直接赋值。varpersons=newArray(3);persons[0]=["zhangsan",25];persons[1]=["lisi",21];persons[2]=["wangwu",32];方法三:直接赋值。varpersons=[["zhangsan",25],["lisi",21],["wangwu",32]];2.6.5Array类5.二维数组数组中的元素又是数组就成为二维数组。创建二维数组方法如下:方法一:先创建一个一维数组,然后该一维数组的所有元素再创建一维数组。varpersons=newArray(3); //创建一个一维数组persons[0]=newArray(2); //每个元素persons[0]又是一维数组persons[1]=newArray(2); //每个元素persons[1]又是一维数组persons[2]=newArray(2); //每个元素persons[2]又是一维数组persons[0][0]="zhangsan";persons[0][1]=25;persons[1][0]="lisi";persons[1][1]=22;persons[2][0]="wangwu";persons[2][1]=32;方法二:先创建一个一维数组,然后该一维数组的所有元素直接赋值。varpersons=newArray(3);persons[0]=["zhangsan",25];persons[1]=["lisi",21];persons[2]=["wangwu",32];方法三:直接赋值。varpersons=[["zhangsan",25],["lisi",21],["wangwu",32]];2.6.6Math对象Math对象是对一个已创建好的Math类的实例,因此不能使用new运算符。其提供一些属性是数学中常用的常量,E(自然对数的底,约为2.718)、LN2(2的自然对数)、LN10(10的自然对数)、LOG2E(以2为底的e的对数)、LOG10E(以10为底的e的对数)、PI(圆周率)等。Math对象提供的一些方法是数学中常用的函数,如sin()、random()、log()等。Math对象的常用方法见表2-6所示。2.7ES6简介微信小程序已经支持绝大部分的ES6API,用户可以放心的使用。2.7.1变量相关ES2015(ES6)新增加了两个重要的JavaScript关键字:let和const。let声明的变量只在let所在的代码块(一对花括号内部的代码)内有效,也成为块作用域。let只能声明同一个变量一次而var可以声明多次。for循环计数器很适合用let声明。varj=5;for(letj=0;j<10;j++){console.log(j);}console.log(j);//5,不受影响2.7ES6简介

2.constconst声明一个只读的常量,一旦声明,常量的值就不能改变。constPI=3.1415926;2.7.2数据类型ES6数据类型除了Number、String、Boolean、Object、null和undefined,ES6引入了一种新的数据类型Symbol,表示独一无二的值,最大的用法是用来定义对象的唯一属性名。由于每一个Symbol的值都是不相等的,所以Symbol作为对象的属性名,可以保证属性不重名。2.7.3对象varage=12;varname="Amy";varperson={age,name};//{age:12,name:"Amy"}以上写法等同于:varperson={age:age,name:name};方法名也可以简写。varperson={sayHi(){console.log("Hi");}}person.sayHi();//"Hi"ES6允许对象的属性直接写变量,这时候属性名是变量名,属性值是变量值。以上写法等同于:varperson={sayHi:function(){console.log("Hi");}}person.sayHi();//"Hi"2.7.4class类例如,ES5中定义一个Person类:functionPerson(name,age){//构造函数=name;//定义一个属性namethis.age=age;//定义一个属性agethis.say=function(){//定义一个方法say()console.log("我的名字是"++",+"今年"+this.age+"岁了");}}ES6中改用class定义Person类如下:classPerson{//定义了一个名字为Person的类

constructor(name,age){//constructor是一个构造方法,用来接收参数=name;//this代表的是实例对象this.age=age;}say(){//这是一个类的方法,注意不要加上functionreturn"我的名字叫"++"今年"+this.age+"岁了";}}varobj=newPerson("xmj",48);console.log(obj.say());//我的名字叫xmj今年48岁了ES6引入了class(类)这个概念,通过class关键字可以定义类。该关键字的出现使得其在对象写法上更加清晰,更像是一种面向对象的语言。实际上class的本质仍是function,它让对象原型的写法更加清晰、更像面向对象编程的语法。2.7.5模块功能1.export命令下面是一个JS文件,里面使用export命令来暴露出变量、函数或类(class)这些接口。//a.jsexportvarstr="export的内容";exportvaryear=2019;exportfunctionmessage(sth){returnsth;}推荐使用下面方法在脚本尾部暴露出变量、函数或类(class)这些接口。//a.jsvarstr="export的内容";varyear=2019;functionmes

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论