第1关:JavaScript 数据类型介绍

任务描述

本关任务:在函数 objectTest() 内部定义了六个变量 a、b、c、d、e、f,并已经赋值,你需要判断它们各是什么数据类型。变量 aType、bType、cType、dType、eType、fType 分别表示上面六个变量的数据类型的名字,你需要给他们赋值。比如变量 a 如果是数字类型,需要给变量 aType 赋值字符串 number。可选的数据类型名如下: number、string、bool、object、undefined 和 array 分别表示数字、字符串、布尔型、对象类型、undefined 还有数组。

相关知识

JavaScript 的数据类型有数字、字符串、布尔型、对象类型、数组、null 和 undefined。

数字类型

JavaScript 中的数字类型指整数和浮点数,不刻意区分二者。

JavaScript 还支持16进制的整数,在所要表示的16进制数前面加上 0x 或者 0X 即可,如 0x1f 表示整数31。

对于较大或较小的数,JavaScript 还支持科学记数法,如 2e3 表示2000。

对于一般的数学运算,如加减乘除,和数学上的表达方式相同。对于稍微复杂的运算,需要通过 Math 对象定义的函数来实现,下面是一些例子:


  1. var number1 = 0X11; //17
  2. var number2 = 2.01e-2; //2.01*0.01
  3. var number3 = Math.sqrt(9); //计算9的平方根

字符串

在 JavaScript 中,没有字符的说法,字符看成长度为1的字符串,字符串指包含在单引号或者双引号中的文本。

需要特别注意的是,字符串中的字符不能和外侧的单引号或者双引号构成一个引号对,如果字符串中有引号,需要用转义字符将这些引号变为普通字符,简单来说,转义字符的功能就是使字符串中的字符不被误认为该字符串的结束符号。

如 I'm studying a language,需要用\把中间的单引号转义:


  1. var tran = 'I\'m studying language';

另外,关于字符串,有很多常用的函数,可参考本实训系列的第九篇实训。

布尔型

布尔型:有两种逻辑状态的类型,它的值只有 true 和 false 两个,分别表示正确、错误。


  1. var boolType1 = true;
  2. var boolType2 = false;

常用在控制结构的不同入口的判断上,如:


  1. if(myNumber == 1) { //myNumber为1则返回true并进入下面的句子
  2. console.log("myNumber值为1");
  3. }
  4. else {
  5. console.log("myNumber值不为1");
  6. }

数组

JavaScript 中的数组是数据的集合,每一个数据在数组中对应一个位置,称为该数据的索引。数据称为数组中的元素,JavaScript 数组中的元素可以是不同的数据类型。


  1. var myArray = [1,2,true,"string",3.2];

上面就定义了一个含有整数、布尔型、字符串、浮点数的数组。 关于数组的内容有很多,详细请参考《JavaScript 学习手册五:JS 数组》。

null 和 undefined

undefined 表示某个变量没有被赋值,比如,变量在申明的时候没有赋值,那么它的值就是 undefined。null 是对象,是一个空的对象引用。


  1. var myVar;
  2. console.log(myVar);
  3. console.log(a);

如上面所示,尝试输出变量 myVar,结果会输出 undefined,因为这个变量只申明,没有赋值。而尝试输出变量a会产生错误,因为这个变量没有定义,是一个空的对象引用。

对象类型

JavaScript 是面向对象的语言,严格的来说,在 JavaScript 中,一切都可称为对象。但是我们这里介绍的对象仅指键值对的集合,可以类比于 C 中的结构体或者 Java 中的对象。

  • 对象的创建:

  1. var student = {
  2. name:"Peter",
  3. age:23,
  4. gender:male}; //申明并初始化对象
  • 对象的使用,比如获取对象里的某个属性的值:

  1. console.log(student.name); //输出"Peter"
  • 还可以更改这个属性的值:

  1. student.name = "Bob";
  2. console.log(student.name); //输出"Bob"

编程要求

本关的编程任务是补全右侧代码片段中 Begin-End 中的代码,具体要求如下:

  • 在函数 objectTest() 内部定义了六个变量a、b、c、d、e、f,并已经赋值,你需要判断它们各是什么数据类型;

  • 变量 aType、bType、cType、dType、eType、fType 分别表示上面六个变量的数据类型的名字,你需要给他们赋值。比如变量 a 如果是数字类型,需要给变量 aType 赋值字符串 number;

  • 可选的数据类型名如下: number、string、bool、object、undefined 和 array 分别表示数字、字符串、布尔型、对象类型、undefined 还有数组。

本关涉及的代码文件 DataKind.js 的代码框架如下:


  1. function objectTest() {
  2. var a = {name:"myName",id:2};
  3. var b = [1,true,2];
  4. var c = 1;
  5. var d = "1";
  6. var e = true;
  7. var f;
  8. var aType,bType,cType,dType,eType,fType;
  9. //请在此处编写代码
  10. /********** Begin **********/
  11. /********** End **********/
  12. return aType+","+bType+","+cType+","+dType+","+eType+","+fType;
  13. }

测试说明

测试过程:

  • 平台将读取用户补全后的 DataKind.js;

  • 调用其中的 objectTest() 方法;

  • 接着根据 objectTest() 方法的输出判断程序是否正确。

以下是测试样例:

测试输入:


  1. 无测试输入

测试输出:


  1. object,array,number,string,bool,undefined
function objectTest() {var a = {name:"myName",id:2};var b = [1,true,2];var c = 1;var d = "1";var e = true;var f;var aType,bType,cType,dType,eType,fType;//请在此处编写代码/********** Begin **********/aType="object";bType="array";cType="number";dType="string";eType="bool";f="undenfined"/********** End **********/return aType+","+bType+","+cType+","+dType+","+eType+","+fType;
}

第2关:JavaScript 数据类型转换

任务描述

数据类型转换是开发过程中最常碰到的问题之一。

本关任务:函数 mainJs() 有三个字符串类型的参数 a、b 和 c,你需要分别把他们转换为整数,整数和小数。

  • 第一个参数既有可能是 12 这种纯整数的字符串形式,也有可能是 12a3 这种含有非数字字符的字符串;
  • 第二个参数是 16 进制数字的字符串形式,如 af2;
  • 第三个参数是纯小数的字符串形式,如 12.2;
  • 想要通过本关,请阅读下方的相关知识。

相关知识

在使用 JavaScript 进行的开发过程中,往往会碰到数据类型转换的需求,尤其是数字转字符串和字符串转数字。

例如,在 JavaScript 中,从前端页面获得的值都是字符串类型,包括数字也会被识别为字符串类型,这自然就产生了转换的需求。

字符串转整数

如果你想把一个字符串转换成整数,有两种方式。

  • 使用 parseInt() 方法,参数为字符串,结果为该字符串转换而来的整数; 转化规则是:如果字符串的首字符不是一个数字,转换失败,返回 NaN;否则,转换到字符串中第一个不是数字的字符止,即,遇到字母、小数点下划线等字符立即停止转换。需要注意的是,16 进制的符号 0x 不会让转换停止。 parseInt() 还可以有第二个参数,表示待转换字符串的进制。下面给一些例子:

  1. parseInt("12");
  2. parseInt("12.2");
  3. parseInt("C",16);
  4. parseInt("12a2");
  5. parseInt("0XC"); //以上均返回数字12
  6. parseInt("a12"); //失败
  • 使用 Number() 进行强制类型转换; 使用 Number() 转换一个字符串,这个字符串必须是只含有数字的字符串,即数字的字符串形式。与上面的 parseInt() 方法对比可知,Number() 实现的是更加严格的字符串转换为数字操作。因为对于 12a3 这种含有字母等非数字字符的字符串,Number() 会报错。下面是一些例子。

  1. Number("12"); //返回12
  2. Number("12a2"); //返回NaN
  3. Number(""); //返回0

字符串转小数

与整数相同,字符串转小数也有两种方式:parseFloat() 和 Number()。

parseFloat() 方法只转换到字符串中第一个不是数字的字符为止,当然这个字符不包括第一个小数点。这里有些不好理解,下面用例子解释。


  1. parseFloat("12"); //返回12
  2. parseFloat("12.2a"); //返回12.2
  3. parseFloat("12.2.2"); //返回12.2,第二个小数点会让转换停止
  4. parseFloat(null); //返回0

数字转字符串

toString() 实现一般的数字转字符串,String() 则是强制类型转换。

toString() 括号内有一个可选的参数,指以几进制的形式转换该字符串,如数字12调用 toString(16) 得到的结果就是 C,即12的16进制表示方式。

String() 可以转换 null 和 undefined,而 toString() 不可以。


  1. var myNum = 15;
  2. console.log(myNum.toString()); //输出"15"
  3. console.log(myNum.toString(16)); //输出"F"
  4. console.log(String(myNum)); //输出"15"

布尔型与其他类型的相互转换

布尔型的值只有两个 true 和 false 。转换规则如下:

  • 布尔型转为字符串直接就是字符串 true 或者 false;
  • 布尔型中的 true 转换为数字 1,布尔型中的 false 转换为数字 0;
  • 数字 0、null、undefined、空字符串转换为布尔型的 false,其他所有都是转换为 true。

下面例子中的 Boolean() 方法实现其他的类型转布尔型。


  1. var myBool = ture;
  2. myBool.toString(); //返回"true"
  3. Number(true); //返回1
  4. Boolean("js"); //返回true
  5. Boolean(""); //返回false

注意,上面讲的空字符串是"",而不是空格字符串" ",这两个不同,后者双引号之间有一个英文字符的大小的空位,他们转为布尔型的结果不同:


  1. Boolean(""); //返回false
  2. Boolean(" "); //返回true

隐式转换

JavaScript 是一种弱类型语言,不同类型的变量在运算符的作用下会发生类型转换。这个是编译环境下直接进行的,所以叫隐式类型转换。下面是一些转换规则:

  • +运算的两个操作数是数字和字符串,数字会被转换为字符串;
  • +运算的两个操作数是数字和布尔型,布尔型会被转换为数字;
  • +运算的两个操作数是字符串和布尔型,布尔型会被转换为字符串;
  • 减、乘、除、取余运算会把其他类型转换为数字;
  • if 括号中单独的一个变量会被转换为布尔型。

编程要求

本关的编程任务是补全右侧代码片段中 Begin-End 中的代码,具体要求如下:

  • 完成函数 mainJs();

  • 把函数三个参数(从左到右)依次转换为整数,整数和小数;

  • 第一个参数既有可能是 12 这种纯整数的字符串形式,也有可能是 12a3 这种含有非数字字符的字符串;

  • 第二个参数是 16 进制数字的字符串形式,如 af2;

  • 第三个参数是纯小数的字符串形式,如 12.2;

  • 具体请参见后续测试样例。

本关涉及的代码文件 DataKindConvert.js 的代码框架如下:


  1. //你需要把字符串args1,args2,args3转换为数字a,b和c.
  2. function mainJs(args1,args2,args3) {
  3. // 请在此处编写代码
  4. /********** Begin **********/
  5. /********** End **********/
  6. return a+b+c;
  7. }

测试说明

测试过程:

  • 平台将读取用户补全后的 DataKindConvert.js;

  • 调用其中的 mainJs() 方法,并输入组测试数据;

  • 接着测试的输出判断程序是否正确。

以下是测试样例:

测试输入:


  1. 5a2,1f,6.1

预期输出:


  1. 42.1

测试输入:


  1. 12.9,1a,3.1

预期输出:


  1. 41.1
function mainJs(args1,args2,args3) {//请在此处编写代码/********** Begin **********/var a=parseInt(args1);var b=parseInt(args2,16);var c=parseFloat(args3); /********** End **********/return a+b+c;
}

JavaScript 学习手册二:JS 数据类型相关推荐

  1. JavaScript 学习手册二

    JavaScript 学习手册二:JS 数据类型 第1关:JavaScript 数据类型介绍 任务描述 本关任务:在函数 objectTest() 内部定义了六个变量 a.b.c.d.e.f,并已经赋 ...

  2. JavaScript学习(二十九)—JS常用的事件

    JavaScript学习(二十九)-JS常用的事件 一.页面相关事件 onload事件:当页面中所有的标签都加载完成后厨房该事件,格式:window.onload <body><sc ...

  3. Java学习笔记二:数据类型

    Java学习笔记二:数据类型 1. 整型:没有小数部分,允许为负数,Java整型分4种:int short long byte 1.1 Int最为常用,一个Int类型变量在内存中占用4个字节,取值范围 ...

  4. [导入][转]sap学习手册二

    SAP学习手册二 作者:sunxufeng 有没有调整IDES4.6的中文包参数的步骤呢? 在导入中文包后直接手工修改有关参数,不要用CZ10去修改假定为D盘,路径为D:usrsapC11syspro ...

  5. JavaScript学习(二十八)—事件冒泡和事件捕获

    JavaScript学习(二十八)-事件冒泡和事件捕获 一.什么是事件流? 简单说,事件流就是指事件的执行顺序,他包含两种模式:事件冒泡.事件捕获. (一).事件冒泡 最常用的一种模式,就是指事件的执 ...

  6. JavaScript学习(二十七)—解决IE以及IE8之前的浏览器下面的添加事件或者删除事件

    JavaScript学习(二十七)-解决IE以及IE8之前的浏览器下面的添加事件或者删除事件 addEventListener和removeEventListener在IE8以及IE浏览器下面不支持, ...

  7. JavaScript学习(二十六)—事件处理程序的添加与删除

    JavaScript学习(二十六)-事件处理程序的添加与删除 一.什么是事件? 所谓事件就是指用户或页面自身的某些行为,如点击鼠标,敲击键盘都是属于事件. 二.事件处理程序 当事件被触发时会引起某些程 ...

  8. JavaScript学习(二十五)—实现无缝滚动

    JavaScript学习(二十五)-实现无缝滚动 效果如下: 代码如下: <!DOCTYPE html> <html lang="en"><head& ...

  9. JavaScript学习(二十三)—scrollTop练习

    JavaScript学习(二十三)-scrollTop练习 <!DOCTYPE html> <html lang="en"><head>< ...

  10. JavaScript学习(二十二)—动态创建表格

    JavaScript学习(二十二)-动态创建表格 效果如下: 代码如下: <!DOCTYPE html> <html lang="en"><head& ...

最新文章

  1. TensorFlow基本计算单元:代码示例
  2. 软件版本中 release stable alpha beta pre snapshot 区别
  3. C++封装常用对象和对头文件以及预编译机制的探索
  4. delphi 企业微信消息机器人_企业微信—群聊机器人
  5. leetcode-110:判断平衡二叉树 Java
  6. 2018年12月份最热门的Java开源项目
  7. 【2019.09.08】2019icpc南昌网络赛
  8. python 循环播放音乐_python gstreamer实现视频快进/快退/循环播放功能
  9. JS 使用RSA加密解密
  10. 【路径规划】基于matlab模拟退火算法求解多车型路径规划问题【含Matlab源码 913期】
  11. 多个dwg文件批量合并_插件分享 | 多张单独内容DWG快速合并到一个文件
  12. VIO,visual-inertial odometry)即视觉惯性里程计
  13. c语言图书管理实验报告,图书管理系统c语言程序设计实验报告
  14. 校园网接无线路由器多账号登录
  15. 完整版JavaWeb环境搭建-maven-servlet...与测试,欢迎大家一起学习
  16. java毕业设计_基于MVC的公司报账系统
  17. Python | 输入逗号分隔的元素,转换为列表并打印
  18. 浅谈卡尔曼滤波(Kalman Filter)(一)
  19. SharpDevelop的安装与配置
  20. 几次安全实习面试简单记录

热门文章

  1. 实现echarts中国地图迁徙图
  2. 【组合数学】 牡牛和牝牛
  3. python 报童模型
  4. 基于matlab的负反馈仿真,MATLAB的单闭环转速负反馈直流调速系统仿真
  5. Python爬虫实战, QQ空间自动点赞
  6. typedef用法详解
  7. 鲁棒控制——线性矩阵不等式处理(俞立)(1)
  8. 案例:神经网络建模 + 可视化分析 = 提效增质的利器!
  9. 分享这款不限速免费下载神器,能在任何操作系统上使用
  10. 光功率 博科交换机_博科光纤交换机zone划分命令方法