JS基础(4)

简介: JS基础(4)

typeof获取变量数据类型


typeof variabletypeof(variable)) 返回一个字符串,值为该变量的数据类型

console.log(typeof 1); // number
console.log(typeof false); // boolean
console.log(typeof 'aaa');    // string
console.log(typeof undefined);// undefined
console.log(typeof NaN); // number
console.log(typeof Infinity); // number
console.log(typeof null); // object
console.log(typeof typeof 1); // string
复制代码


字面量


字面量是在源代码中一个固定的表示法,通俗来说,就是字面量如何表达这个值

  • 数字字面量:10
  • 字符串字面量:mphyaaa
  • 布尔字面量:truefalse


数据类型转换


什么是数据类型转换


使用表单、prompt获取过来的数据默认是字符串类型的,此时就不能直接简单的进行加法运算,而需要转换变量的数据类型。 通俗来说,就是把一种数据类型的变量转换成另外一种数据类型 我们通常会实现3种方式的转换:

  • 转换为字符串类型
  • 转换为数字型
  • 转换为布尔型


转换成字符串的三种方法


一般用第三种方式,隐式转换

  • toString() 方法
  • String() 方法
  • 加号 + 拼接字符串
var num = 12;
console.log(num.toString());
console.log(String(num));
console.log(num + '');

数字字符长转数字

var str = '123'
console.log(str - '');


转换为数字型


方式 说明 案例
parseInt(str) 函数 string->整数型 parseInt('10')
parseFloat() 函数 string->浮点型 parseFloat('3.14')
Number() 强转换函数 string->数字型 Number('12')
JS 隐式转换 算术运算符隐式转换为数字型 '12'- 0'12' - '''12'*1
console.log(parseInt('123')); // 123
console.log(parseFloat('3.14')); // 3.14
console.log('123' - 0); // 123
console.log('123' - ''); // 123
console.log(parseFloat('999')); // 999
console.log(parseInt('3.14159')); // 3
console.log(parseInt('120px')); // 120
console.log(Number('100')); // 100
console.log(Number('100.32')); // 100.32
console.log(Number('100px')); // NaN
console.log('100px' - ''); // NaN

(1)数字字符串('12.3'12)之间进行加法运算实际上是字符串的拼接,结果还是字符串;而数字字符串之间的减法运算是算术运算,结果是数字型。

(2)一个数字字符长和一个数字相乘,结果是算数运算结果,为数字型。

console.log('10' + '2'); // 102
console.log('10' - '2'); // 8
console.log('10' + '3.2'); // 103.2
console.log('10' - '3.2'); // 6.8
console.log('12'*3); // 36


转换为布尔型


使用 Boolean() 函数转换。

  • 转换值为 false'', 0, NaN, null, undefined(5个)
  • 其他的转换值均为 true
console.log(Boolean('')); // false
console.log(Boolean(0)); // false
console.log(Boolean(NaN)); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean([])); // true


相关文章
|
JavaScript
JS基础之解构赋值
解构赋值 在js中,我们经常会将对象或者数组里面的一部分数据作为参数传递给函数,如果我们使用传统的.方法会很麻烦。
|
JavaScript 前端开发
JavaScript 入门基础 - 运算符(三)
文章目录 JavaScript 入门基础 - 运算符(三) 1.什么是运算符 2.表达式和返回值 3.算术运算符概述 4. 赋值运算符 5.递增和递减运算符 5.1 递增和递减运算符概述 5.2 递增运算符 5.2.1 前置递增运算符 5.2.2 后置递增运算符 5.2.3 后置和前置运算符的区别 6. 比较运算符 7. 逻辑运算符 7.1 逻辑运算符概述 7.2 逻辑与 7.3 逻辑或 7.4
121 0
JavaScript 入门基础 - 运算符(三)
|
存储 JSON JavaScript
JavaScript 入门基础 - 变量 / 数据类型(二)
JavaScript 入门基础 - 变量 / 数据类型(二)
87 0
JavaScript 入门基础 - 变量 / 数据类型(二)
|
JavaScript 前端开发 物联网
JavaScript 入门基础 / 概念介绍(一)
JavaScript 入门基础 / 概念介绍(一)
112 0
JavaScript 入门基础 / 概念介绍(一)
|
JavaScript 前端开发 Java
JavaScript的基础使用
JavaScript的基础 一、javascript简介 JavaScript简称js,最初由网景(现在的Mozilla)公司创建,由于商标冲突原因,其标准版本命名为ECMAScript,但是一般人们还是叫JavaScript,只在谈标准的时候说到ECMAScript这个名字。值得注意的是JavaScript与java没有任何关系,就像雷峰塔(神话中镇压白娘子的塔)和雷锋。此外js(JavaScript)和jsp(java servlet pages)也没有关系。   js的工作分为两部分,一部分属于js语言本身的特性,而另一部需要依靠宿主环境(web浏览器)才能完成。 二、javascri
JavaScript的基础使用
|
JavaScript 前端开发
js 模块化基础和模块规范AMD、CMD、ES6模块
js 模块化基础和模块规范AMD、CMD、ES6模块
83 0
|
JavaScript 前端开发
原生js制作选项卡详解,适合无基础的人学习
原生js制作选项卡详解,适合无基础的人学习
109 0
原生js制作选项卡详解,适合无基础的人学习
|
JavaScript 前端开发
vue js文字跑马灯基础版本
提供两种解决思路
253 1
|
存储 JavaScript 前端开发
JavaScript基础(一篇入门)
JavaScript基础(一篇入门)
185 0
JavaScript基础(一篇入门)
|
XML JavaScript 前端开发
计算机二级web题目(5)--js(Javascript)基础
计算机二级web题目(5)--js(Javascript)基础
252 0