五. JavaScript 数据类型

JavaScript 变量能够保存多种数据类型:数值、字符串值、数组、对象等等:

var length = 7;                             // 数字
var lastName = "Gates"; // 字符串
var cars = ["Porsche", "Volvo", "BMW"]; // 数组
var x = {firstName:"Bill", lastName:"Gates"}; // 对象

JavaScript 中一共有5种基本数据类型:String、Number、Boolean、Null、Undefined。

除这五种外的类型都称为Object。

typeof 运算符

您可使用 JavaScript 的 typeof 来确定 JavaScript 变量的类型:

typeof 运算符返回变量或表达式的类型:

typeof ""                  // 返回 "string"
typeof "Bill" // 返回 "string"
typeof "Bill Gates" // 返回 "string"

String

String 用于表示一个字符序列,即字符串。

字符串需要使用'" 括起来。

将其他数值转换为字符串有三种方式: toString() 、 String() 、拼串 。

Number

Number 类型用来表示整数和浮点数,最常用的功能就是用来

表示 10 进制的整数和浮点数。

Number 表示的数字大小是有限的,范围是:

  • 1.7976931348623157e+308

  • 如果超过了这个范围,则会返回 Infinity 。

NaN 即非数值( Not a Number )是一个特殊的数值 JS 中

当对数值进行计算时没有结果返回,则返回 NaN 。

有三个函数可以把非数值转换为数值: Number() 、 parseInt()和 parseFloat() 。

Number() 可以用来转换任意类型的数据,而后两者只能用于转换字符串。

parseInt() 只会将字符串转换为整数,而 parseFloat() 可以转换为浮点数。

Undefined

在 JavaScript 中,没有值的变量,其值是 undefined。typeof 也返回 undefined。

空值与 undefined 不是一回事,空的字符串变量既有值也有类型。

var person;                  // 值是 undefined,类型是 undefined
var car = ""; // 值是 "",类型是 "string"
var person = null; // 值是 null,但是类型仍然是对象

Undefined 与 Null 的区别

Undefined 与 null 的值相等,但类型不相等:

typeof undefined              // undefined
typeof null // object
null === undefined // false
null == undefined // true

算数运算符

运算符 说明 运算符 说明
+ 加法 ++(前置) 自增
- 减法 ++(后置) 自增
* 乘法 --(前置) 自减
/ 除法 --(后置) 自减
% 取模 + 符号不变
- 符号反转

六. 面向对象

对象属于一种复合的数据类型,在对象中可以保存多个不同的数据类型的属性。

对象分类

  1. 内建对象

    • 由ES标准种定义的对象。比如:Math String Number
  2. 宿主对象
    • 由JS的运行环境提供的对象,主要指由浏览器提供的对象。比如:BOM DOM
  3. 自定义对象
    • 开发人员创建的对象

创建对象的三种方式

使用new关键字,调用对象的构造函数。

var obj = new Object();
var obj = {}; // 对象字面量创建
var obj = {name:"tom", age=12}; // 使用对象字面量可以在创建时指定对象的属性

添加属性

对象的属性名不强制要求遵守标识符的规范。

尽量按照标识符规范去做。

obj.name = "孙悟空";
obj.gender = "男";
obj.age = 18;
obj["123"] = 789; // 特殊属性名,使用[]形式操作
// 使用[]方式操作属性更加灵活
ver n = 'name';
console.log(obj[n]);

JS对象的属性值,可以是任意的数据类型,甚至可以是一个对象。

删除属性

delete obj.name;

in 运算符

通过该运算符可以检查一个对象中是否含有指定的属性

堆栈

JS中的基本数据类型的值都是直接在栈内存中存储的,值与值之间是独立存在,修改一个变量不影响其他变量。

引用类型是保存在堆内存中的,栈内存中仅保留该类型在堆内存中的地址信息,修改一个变量时会影响其他变量。

当比较两个基本数据类型的值时,就是比较值,而比较两个应用数据类型的值时,是比较对象的内存地址。

访问对象属性

您能够以两种方式访问属性:

objectName.propertyName
objectName["propertyName"]

请不要把字符串、数值和布尔值声明为对象!

如果通过关键词 "new" 来声明 JavaScript 变量,则该变量会被创建为对象:

var x = new String();        // 把 x 声明为 String 对象
var y = new Number(); // 把 y 声明为 Number 对象
var z = new Boolean(); // 把 z 声明为 Boolean 对象

请避免字符串、数值或逻辑对象。他们会增加代码的复杂性并降低执行速度。

枚举对象中的属性

for ... in ... 语句 对象有几个属性,循环体就会执行几次

for(var n in obj){
console.log(n);
m = console.log(obj[n]);
}
// n 为对象的 Key
// m 为对象的 value

作用域

作用域指一个变量的作用范围

JS中一共有两种作用域:

  1. 全局作用域

    • 直接编写在script标签中的 JS 代码,都在全局作用域
    • 全局作用域在页面打开时创建,在页面关闭时销毁
    • 在全局作用域中有一个全局对象window,代表一个浏览器的窗口,由浏览器创建,我们可以直接使用
    • 在全局作用域中 创建的所有变量都会作为 window 对象的属性保存
    • 创建的所有函数都会作为 window 对象的方法
    • 全局作用域中的变量都是全局变量,在任何页面都可以访问的到
  2. 函数作用域
    • 调用函数时,创建函数作用域,函数执行完毕后,作用域销毁
    • 每调用一次函数,就会创建一个新的函数作用域,他们之间是相互独立的
    • 在函数作用域中可以访问到全局作用域的变量

当函数和全局存在同名变量时,对于该变量的访问符合就近原则

在函数中访问全局中的同名变量:window.a

在函数中,不使用 var 声明的变量都会成为全局变量

var a = 33;

function fun(){
console.log("a = "+ a);
a = 10 // 实际等于 window.a = 10
}
fun()
console.log("a = "+ a); [OUTPUT]:
a = 33
a = 10

定义形参就相当于声明变量:

function fun(e){
alert(e);
}
// 可以理解为
function fun(){
var e;
alert(e);
}

声明提前

变量的声明提前(变量提升):使用var关键字声明的变量,会在所有的代码执行之前被声明,如果声明变量时不使用var关键字,则变量不会被提前声明。

只进行提前声明,并没有提前赋值。

<script>
var a = 123;
console.log(a);
</script>
<!--正常运行 输出123-->
<script>
a = 123; // 相当于 window.a = 123
console.log(a);
</script>
<!--正常运行 输出123-->
<script>
console.log(a);
var a = 123;
</script>
<!--输出 a = undefined-->
<script>
console.log(a);
a = 123;
</script>
<!--报错-->

函数的声明提前:使用函数声明形式创建的函数会在所有代码执行之前被创建,我们可以在函数声明前调用。

使用函数表达式创建的函数,不会被提前创建

<script>
function fun(){
console.log("fun");
}
var fun2 = function{
console.log("fun2");
};
fun();
fun2();
</script>
<!--正常运行-->
fun()
function fun(){
console.log("fun");
}
var fun2 = function{
console.log("fun2");
}
<!--正常运行-->
fun2()
function fun(){
console.log("fun");
}
var fun2 = function{
console.log("fun2");
}
<!--报错-->

JavaScript学习 Ⅱ的更多相关文章

  1. JavaScript学习(一) —— 环境搭建与JavaScript初探

    1.开发环境搭建 本系列教程的开发工具,我们采用HBuilder. 可以去网上下载最新的版本,然后解压一下就能直接用了.学习JavaScript,环境搭建是非常简单的,或者说,只要你有一个浏览器,一个 ...

  2. Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”

    Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...

  3. JavaScript学习(3):函数式编程

    在这篇文章里,我们讨论函数式编程. 什么是函数式编程?根据百度百科的描述,“函数式编程是种编程典范,它将电脑运算视为函数的计算.函数编程语言最重要的基础是 λ 演算(lambda calculus). ...

  4. JavaScript学习(2):对象、集合以及错误处理

    在这篇文章里,我们讨论一下JavaScript中的对象.数组以及错误处理. 1. 对象 对象是JavaScript中的一种基本类型,它内部包含一些属性,我们可以对这些属性进行增删操作. 1.1 属性 ...

  5. JavaScript学习13 JavaScript中的继承

    JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript"> //继承第一种方式 ...

  6. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  7. JavaScript学习11 数组排序实例

    JavaScript学习11 数组排序实例 数组声明 关于数组对象的声明,以前说过:http://www.cnblogs.com/mengdd/p/3680649.html 数组声明的一种方式: va ...

  8. JavaScript学习10 JS数据类型、强制类型转换和对象属性

    JavaScript学习10 JS数据类型.强制类型转换和对象属性 JavaScript数据类型 JavaScript中有五种原始数据类型:Undefined.Null.Boolean.Number以 ...

  9. JavaScript学习09 函数本质及Function对象深入探索

    JavaScript学习09 函数本质及Function对象深入探索 在JavaScript中,函数function就是对象. JS中没有方法重载 在JavaScript中,没有方法(函数)重载的概念 ...

  10. JavaScript学习08 Cookie对象

    JavaScript学习08 Cookie对象 JavaScript Cookie Cookie对象: Cookie是一种以文件的形式保存在客户端硬盘的Cookies文件夹中的用户数据信息(Cooki ...

随机推荐

  1. js实现点击切换checkbox背景图片

    在制作网页的过程中,经常需要实现点击切换背景图片的效果,本文关注的是表单中checkbox背景图片切换的实现.如图,在输入用户名和密码后,用户需要选择是否记住密码 图片背景为白色表示未勾选状态 ,背景 ...

  2. @topcoder - SRM614D1L3@ TorusSailing

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定一个 N*M 的方格图,某人从 (0, 0) 出发想要走到 ...

  3. iOS视频随笔(一)

    实例化对象init [AFNetworkActivityIndicatiorManager shareManager].enable = Yes; //开启网络请求指示 scrollView.cont ...

  4. Excel常用公式大全

    公式是单个或多个函数的结合运用. AND “与”运算,返回逻辑值,仅当有参数的结果均为逻辑“真(TRUE)”时返回逻辑“真(TRUE)”,反之返回逻辑“假(FALSE)”. 条件判断 AVERAGE ...

  5. mysql explain的type的

    导语 很多情况下,有很多人用各种select语句查询到了他们想要的数据后,往往便以为工作圆满结束了.这些事情往往发生在一些学生亦或刚入职场但之前又没有很好数据库基础的小白身上,但所谓闻道有先后,只要我 ...

  6. Linux - Python的虚拟环境配置的坑 virtualenv: error: unrecognized arguments: --no-site-packages

    如果你在CentOS8下面配置虚拟环境时,遇到如下错误: [root@localhost ~]# mkvirtualenv my_django usage: virtualenv [--version ...

  7. 049.Kubernetes集群管理-集群监控Metrics

    一 集群监控 1.1 Metrics Kubernetes的早期版本依靠Heapster来实现完整的性能数据采集和监控功能,Kubernetes从1.8版本开始,性能数据开始以Metrics API的 ...

  8. linux服务器安装宝塔以及一些坑

    首先在linux 下运行这一步命令yum install -y wget && wget -O install.sh http://download.bt.cn/install/ins ...

  9. selenium(3)-针对鼠标的操作

    背景 用selenium做自动化,有时候会遇到需要模拟鼠标操作才能进行的情况,比如单击.双击.点击鼠标右键.拖拽等等. 而selenium给我们提供了一个类来处理这类事件-----------Acti ...

  10. 键盘侠Linux教程(五)| 基本权限管理

    基本权限管理 权限的介绍 权限位的含义 前面讲解ls命令时,我们已经知道长格式显示的第一列就是文件的权限,例如: [root@es ~]# ls -l anaconda-ks.cfg -rw----- ...