1. Javascript 基本数据类型

1.1 分类

类型 释义
boolean 布尔类型,分 true 与 false
number 整型,浮点型
string 字符类型
object 对象类型
function 函数类型
undefined “未定义”类型

1.2 举例

  • 补充:typeof() —— 可以获取变量类型的函数
/* 1. boolean
Python: True, False
JS: true, false
*/
var B = true;
// alert(B); // true
// alert(typeof(B)); // boolean // 2. number
// 2.1 数字
var num_01 = 12;
var num_02 = 12.1; /* 将结果打印到控制台
一般不用 alert()
而用 console.log() 此外,document.write("Hello"); 可以将结果打印到 body 体
*/
console.log("num_01 =", num_01, "typeof(num_01) =", typeof(num_01));
console.log("num_02 =", num_02, "typeof(num_02) =", typeof(num_02)); /* 2.2 binary 二进制
以 0b 开头
*/
var num_2 = 0b1011;
console.log("num_2 =", num_2, "typeof(num_2) =", typeof(num_2)); /* 2.3 Octal 八进制
两种方式
以 0 开头
以 0o 开头
*/
var num_8_1 = 076;
var num_8_2 = 0o76;
console.log("num_8_1 =", num_8_1);
console.log("num_8_2 =", num_8_2); /* 2.4 Hexadecimal 十六进制
以 0x 开头
*/
var num_16 = 0xfe;
console.log("num_16 =", num_16); // 2.5 NaN: not a number
var num_nan = NaN;
console.log("num_nan =", num_nan, "typeof(num_nan) =", typeof(num_nan)); // 3. string
// 3.1 单引号
var str1 = '123';
// 3.2 双引号
var str2 = "123";
// 3.3 将关键字放入引号内部
var str3 = "true";
// 3.4 单双引号可以相互嵌套,但三引号在 Js 中不好使
var str4 = "I am learning 'Python'!"
var str5 = 'I am learning "Python"!'
console.log("str1 =", str1, "typeof(str1) =", typeof(str1));
console.log("str2 =", str2, "typeof(str2) =", typeof(str2));
console.log("str3 =", str3, "typeof(str3) =", typeof(str3));
console.log("str4 =", str4, "typeof(str4) =", typeof(str4));
console.log("str5 =", str5, "typeof(str5) =", typeof(str5)); // 4, 5, 6
// 4. 对象
var obj = {name:'lisi', age:18}; // 像 Python 中的字典
console.log("obj =", obj, "typeof(obj) =", typeof(obj)); // 5. 数组
var list = [1, 2, 3, 4, 5];
console.log("list =", list, "typeof(list) =", typeof(list)); // 6. null
var obj = null;
console.log("obj =", obj, "typeof(obj)", typeof(obj)); // 7. 函数数据类型
var Func = function(){
console.log("This is a function.");
}
console.log("Func =", Func, "typeof(Func) =", typeof(Func)); /* 8. undefined
释义:未定义
定义一个变量,若不赋值,则默认为 undefined
*/
var un1 = undefined;
var un2;
console.log("un1 =", un1, "typeof(un1) =", typeof(un1));
console.log("un2 =", un2, "typeof(un2) =", typeof(un2));
  • 运行结果
num_01 = 12 typeof(num_01) = number
num_02 = 12.1 typeof(num_02) = number
num_2 = 11 typeof(num_2) = number
num_8_1 = 62
num_8_2 = 62
num_16 = 254
num_nan = NaN typeof(num_nan) = number
str1 = 123 typeof(str1) = string
str2 = 123 typeof(str2) = string
str3 = true typeof(str3) = string
str4 = I am learning 'Python'! typeof(str4) = string
str5 = I am learning "Python"! typeof(str5) = string
obj = {name: "lisi", age: 18}age: 18name: "lisi"__proto__: Object typeof(obj) = object
list = (5) [1, 2, 3, 4, 5]0: 11: 22: 33: 44: 5length: 5__proto__: Array(0) typeof(list) = object
obj = null typeof(obj) object
Func = ƒ (){
console.log("This is a function.");
} typeof(Func) = function
un1 = undefined typeof(un1) = undefined
un2 = undefined typeof(un2) = undefined

2. Javascript 数据类型转换

2.1 可供使用的函数

函数 释义
Number(value) 强转一个数值,包含整数和浮点数
parseInt(value) 强转整型
parseFloat(value) 强转浮点型
String(value) 强转换字符串类型
Boolean(value) 强转换 Boolean 类型

2.2 举例 1

/* 1. 数值类型转换
Number()
parseInt()
parseFloat()
*/
var str1 = '123';
console.log("str1 =", str1, "typeof(str1) =", typeof(str1)); var str2 = Number(str1);
console.log("str2 =", str2, "typeof(str2) =", typeof(str2)); var str3 = parseInt(str1);
console.log("str3 =", str3, "typeof(str3) =", typeof(str3)); var str4 = parseFloat(str1);
console.log("str4 =", str4, "typeof(str4) =", typeof(str4)); console.log("--------------------");
// var str5 = '123abc';
// var str5 = 'abc123';
// var str5 = 'abc123def';
// var str5 = '123abc456';
var str5 = '1.23abc';
console.log("str5 =", str5, "typeof(str5) =", typeof(str5)); var str6 = Number(str5); // 可以更换 str5 查看区别
console.log("str6 =", str6, "typeof(str6) =", typeof(str6)); var str7 = parseInt(str5); // 可以更换 str5 查看区别
console.log("str7 =", str7, "typeof(str7) =", typeof(str7)); var str8 = parseFloat(str5); // 可以更换 str5 查看区别
console.log("str8 =", str8, "typeof(str8) =", typeof(str8)); // 2. isNaN() 检测一个变量是否是 NaN
// var num = '1'; // 是 NaN
// var num = 'a'; // 不是 NaN
var num = '1a'; // 可以更换 num 查看区别
console.log("num =", num, "isNaN(num) =", isNaN(num));
  • 运行结果
str1 = 123 typeof(str1) = string
str2 = 123 typeof(str2) = number
str3 = 123 typeof(str3) = number
str4 = 123 typeof(str4) = number
--------------------
str5 = 1.23abc typeof(str5) = string
str6 = NaN typeof(str6) = number
str7 = 1 typeof(str7) = number
str8 = 1.23 typeof(str8) = number
num = 1a isNaN(num) = true

2.3 举例 2

/* 1. 字符串转布尔值
'1' -> true
'0' -> true
'' -> false
*/
var str1 = '1';
console.log("str1 =", str1, "\tBoolean(str1) =", Boolean(str1)); var str2 = '0';
console.log("str2 =", str2, "\tBoolean(str2) =", Boolean(str2)); var str3 = '';
console.log("str3 =", str3, "\tBoolean(str3) =", Boolean(str3)); /* 2. 数值类型转布尔值
1 -> true
0 -> false
NaN -> false
*/
var num1 = 1;
console.log("num1 =", num1, "\tBoolean(num1) =", Boolean(num1)); var num2 = 0;
console.log("num2 =", num2, "\tBoolean(num2) =", Boolean(num2)); var num3 = 0.0;
console.log("num3 =", num3, "\tBoolean(num3) =", Boolean(num3)); var num4 = NaN;
console.log("num4 =", num4, "\tBoolean(num4) =", Boolean(num4)); /* 3. 对象转布尔值
obj -> true
null -> false
*/
var obj1 = {name:"Tom", age:18};
console.log("obj1 =", obj1, "Boolean(obj1) =", Boolean(obj1)); var obj2 = {};
console.log("obj2 =", obj2, "Boolean(obj2) =", Boolean(obj2)); var obj3 = null;
console.log("obj3 =", obj3, "Boolean(obj3) =", Boolean(obj3));
  • 运行结果
str1 = 1 	Boolean(str1) = true
str2 = 0 Boolean(str2) = true
str3 = Boolean(str3) = false
num1 = 1 Boolean(num1) = true
num2 = 0 Boolean(num2) = false
num3 = 0 Boolean(num3) = false
num4 = NaN Boolean(num4) = false
obj1 = {name: "Tom", age: 18} Boolean(obj1) = true
obj2 = {} Boolean(obj2) = true
obj3 = null Boolean(obj3) = false

3. Javascript 运算符

3.1 JS 运算符简介

运算符 举例
算术运算符 +, -, *, /, ++, --
字符串连接 +
赋值运算 =, +=, -=, %=
比较运算符 <, >, >=, <=, ==, =, !=, !
逻辑运算符 &&
位运算 ^, &
三元运算符 ? :

3.2 举例

// 1.1 自增 i++
var num1 = 1;
console.log("num1 =", num1); num1++;
console.log("num1' =", num1); // 1.2 自减 i--
var num2 = 1;
console.log("num2 =", num2); num2--;
console.log("num2' =", num2);
console.log('\n'); /* 2. 字符串连接
1 + 2
'1' + '2' '1' + 2
'1' + 2 + 3 1 + '2'
1 + 2 + '3' 字符串及其之后的运算用"拼接"
*/
console.log("1 + 2 ->\t\t", 1+2);
console.log("'1' + '2' ->\t", '1'+'2');
console.log('\n'); console.log("'1' + 2 ->\t\t", '1'+2);
console.log("'1' + 2 + 3 ->\t", '1'+2+3);
console.log('\n'); console.log("1 + '2' ->\t\t", 1+'2');
console.log("1 + 2 + '3' ->\t", 1+2+'3');
console.log('\n'); /* 3. === 全等
!= 不等于
!== 不全等
*/
var num3 = 1 == 1;
console.log("(num3 = 1) == 1?", num3); var num4 = 1 === 1;
console.log("(num4 = 1) === 1?", num4); console.log("1 === 1?\t", 1===1);
console.log("'1' == 1?\t", '1'==1);
console.log("'1' === 1?\t", '1'===1);
  • 运行结果
num1 = 1
num1' = 2
num2 = 1
num2' = 0 1 + 2 -> 3
'1' + '2' -> 12 '1' + 2 -> 12
'1' + 2 + 3 -> 123 1 + '2' -> 12
1 + 2 + '3' -> 33 (num3 = 1) == 1? true
(num4 = 1) === 1? true
1 === 1? true
'1' == 1? true
'1' === 1? false

[Web 前端] 022 js 的基本数据类型及使用的更多相关文章

  1. Web前端-Vue.js必备框架(五)

    Web前端-Vue.js必备框架(五) 页面组件,商品列表组件,详情组件,购物车清单组件,结算页组件,订单详情组件,订单列表组件. vue-router 路由 vuex 组件集中管理 webpack ...

  2. Web前端-Vue.js必备框架(四)

    Web前端-Vue.js必备框架(四) 计算属性: <div id="aaa"> {{ message.split('').reverse().join('') }} ...

  3. Web前端-Vue.js必备框架(三)

    Web前端-Vue.js必备框架(三) vue是一款渐进式javascript框架,由evan you开发.vue成为前端开发的必备之一. vue的好处轻量级,渐进式框架,响应式更新机制. 开发环境, ...

  4. Web前端-Vue.js必备框架(二)

    Web前端-Vue.js必备框架(二) vue调式工具vue-devtools 过滤器:vue.js允许你自定义过滤器,可被用作一些常见的文本格式化. mustache插值和v-bind表达式. vu ...

  5. Web前端-Vue.js必备框架(一)

    Web前端-Vue.js必备框架(一) <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  6. Web前端Require.js

    前言 前段时间粗略的扫过一次require.js,当时没怎么在意,结果昨天看到index里面的代码就傻了,完全不知道从哪开始看啦,所以require与backbone的学习还要加紧才行. 由于前端所占 ...

  7. 【RSA】在 ASP.NET Core中结合web前端JsEncrypt.JS使用公钥加密,.NET Core使用私钥解密;

    有一个需求,前端web使用的是JsEncrypt把后端给的公钥对密码进行加密,然后后端对其进行解密: 使用的类库如下: 后端使用第三方开源类库Bouncy Castle进行RSA的加解密和生成PEM格 ...

  8. web前端----JavaScript(JS)简单介绍

    JavaScript(JS) 一.JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEa ...

  9. web前端:js

    内嵌样式<script></script> alert(“123”)弹出对话框 document.write(“test”) 引入方式 <title></ti ...

随机推荐

  1. 【canvas学习笔记六】状态保存和变换

    save()和restore() save() 保存当前状态,将当前canvas的状态存入栈中. restore() 恢复之前save的一个状态,将之前的状态从栈中弹出. 保存的当前状态包含以下信息: ...

  2. Mybatis学习笔记之---编写dao实现类的CRUD

    Mybatis编写dao实现类的CRUD 1.pom.xml <dependencies> <dependency> <groupId>junit</grou ...

  3. python3:csv的读写

    前言快要毕业那会儿,在下编写了一个招聘网站招聘岗位的爬虫提供给前女神参考,最开始我是存到mysql中,然后在到处一份csv文件给前女神.到了参加工作后,由于经常使用excel绘制图表(谁叫公司做报表全 ...

  4. splice()、slice()、split()函数的区分

    1.slice(数组) 用法:array.slice(start,end) 解释:该方法是对数组进行部分截取,并返回一个数组副本:参数start是截取的开始数组索引,end参数等于你要取的最后一个字符 ...

  5. linux cut sort wc sed>vi awk (文本处理)

    cut: 显示切割的行数据 -f: 选择显示的列 (1: 显示第一列; 1,3: 显示第一列.第三列; 1-3: 显示第一列到第三列) -s: 不显示没有分隔符的行 -d: 自定义分隔符(' '空格 ...

  6. tomcat+nginx负载均衡

    一.       工具 nginx-1.8.0 apache-tomcat-6.0.33 二.    目标 实现高性能负载均衡的Tomcat集群: 三.    步骤 1.首先下载Nginx,要下载稳定 ...

  7. Spring的Ioc理解

    1.Ioc=控制反转和依赖注入(DI),两个是一回事 控制反转的好处: 把对象的创建和依赖定义在xml中,改变子类的实现变得很简单 控制反转减轻了对象之间的耦合度,减轻了对象之间的依赖关系,增加了系统 ...

  8. sklearn—LinearRegression,Ridge,RidgeCV,Lasso线性回归模型简单使用

    线性回归 import sklearnfrom sklearn.linear_model import LinearRegression X= [[0, 0], [1, 2], [2, 4]] y = ...

  9. Maven聚合和继承

    一.建立以pom为packaging的项目为,然后再以这一个项目为parent project来聚合其他子项目         新建立一个以pom的项目 改写pom文件,依赖web-common,这样 ...

  10. ssm的自动类型转换器

    1.jsp页面将String 转换成employee类型 <form action="testConversionServiceConverer" method=" ...