(52)Wangdao.com第七天_字面量/变量_标识符_数据类型_数据的存储
JavaScript 字面量 和 变量
- 字面量:就是那些不可变的值,如1,2,100,2000,Infinity,NaN
- 变量:
- 变量,代表的当前随机分配的内存地址。
- 变量的值,是可变的,可以用来保存字面量。
- 使用 var 关键字声明一个变量。
-
var a; //只是声明变量而没有赋值,则该变量的值是undefined var b = 666;
c = 222; // 变量赋值的时候,忘了写var
命令,这条语句也是有效的。
// 不写var
的做法,不利于表达意图,而且容易不知不觉地创建全局变量
// 所以建议总是使用var
命令声明变量。
console.log(ddd); // 变量没有声明就直接使用,会报错,告诉你变量未定义
-
JavaScript 标识符
指 js 中可以由我们命名的名字。。。如变量名,函数名... ...
- 由 字母、数字、下划线“_”、dollar符“$” 组成
- 开头 不能是数字
- 大小写敏感
- 不能是 js 中的关键字或者保留字及其他不建议字符
- 命名采用驼峰命名法,即单词的首个字母大写,AaaaBbbb,BigBoy
- 中文是合法的标识符,可以用作变量名。
-
var 临时变量 = 1;
-
学习 js 三部分
- ECMAscript 5
- 这是标准化的 js 语法
- DOM 文档对象模型 Document Object Model
- 控制文档页面对象
- BOM 浏览器对象模型 Browser Object Model
- 控制浏览器对象
- 控制浏览器对象
JavaScript 有六种数据类型 (ES6 又新增了第七种 Symbol 类型的值)
- 五种基本数据类型
- String 字符串
- 用 "双引号" 或者 '单引号' 括起来的,不能混合使用,可以 'aa"bb"cc' 或者 "dd'ee'ff"
- 如果要真的打印特殊字符,需用 \ 转义:
- \\ 斜杆,\" 双引号,\' 单引号,\n 换行符,\t 制表符 ... ...
- JavaScript 引擎内部,所有字符都用 Unicode 表示。
- JavaScript 不仅以 Unicode 储存字符,还允许直接在程序中使用 Unicode 码点表示字符,即将字符写成
\uxxxx
的形式,其中xxxx
代表该字符的 Unicode 码点。比如,\u00A9
代表版权符号。var s = '\u00A9'; // s = "©" var f\u006F\u006F = 'abc'; // foo = "abc";
- 每个字符在 JavaScript 内部都是以16位(即2个字节)的 UTF-16 格式储存
- 也就是说,JavaScript 的单位字符长度固定为16位长度,即2个字节
- JavaScript 不仅以 Unicode 储存字符,还允许直接在程序中使用 Unicode 码点表示字符,即将字符写成
- 有时,文本里面包含一些不可打印的符号,比如 ASCII 码0到31的符号都无法打印出来,这时可以使用 Base64 编码,将它们转成可以打印的字符。另一个场景是,有时需要以文本格式传递二进制数据,那么也可以使用 Base64 编码。
btoa():任意值转为 Base64 编码 atob():Base64 编码转为原来的值 var string = 'Hello World!'; btoa(string) // "SGVsbG8gV29ybGQh" atob('SGVsbG8gV29ybGQh') // "Hello World!" btoa('你好') // 不适合非 ASCII 码的字符,会报错 function b64Encode(str) { return btoa(encodeURIComponent(str)); } function b64Decode(str) { return decodeURIComponent(atob(str)); } b64Encode('你好') // "JUU0JUJEJUEwJUU1JUE1JUJE" b64Decode('JUU0JUJEJUEwJUU1JUE1JUJE') // "你好"
- Number 数字
isFinite()
方法返回一个布尔值,表示某个值是否为正常的数值。-
isFinite(Infinity) // false isFinite(-Infinity) // false isFinite(NaN) // false isFinite(undefined) // false // 其他都返回 true isFinite(null) // true isFinite(-1) // true
- 提取字符串中 数字部分
-
// parseInt() 获取字符串中整数部分 // 利用 parseInt("",num) 进行进制转换 parseInt('1000', 10) // 1000 parseInt('1000', 2) // 8 parseInt('1000', 6) // 216 parseInt('1000', 8) // 512 // parseFloat() 获取字符串中的浮点数部分 parseFloat('314e-2') // 3.14 parseFloat('0.0314E+2') // 3.14 如果字符串符合科学计数法,则会进行相应的转换 parseFloat('\t\v\r12.34\n ') // 12.34 自动过滤字符串前导的空格
-
- 1,2,100,2000,NaN ... ...
NaN
是 JavaScript 的特殊值,表示“非数字”(Not a Number),主要出现在将字符串解析成数字出错的场合。isNaN
为true
的值,有可能不是NaN
,而是一个字符串- isNaN() 方法可以用来判断一个值是否为NaN。
-
typeof NaN // 'number NaN === NaN // false NaN不等于任何值,包括它本身。 Boolean(NaN) // false [NaN].indexOf(NaN) // -1 5 - 'x' // NaN Math.acos(2) // NaN Math.log(-1) // NaN Math.sqrt(-1) // NaN 0 / 0 // NaN NaN + 32 // NaN NaN - 32 // NaN NaN * 32 // NaN NaN / 32 // NaN
isNaN('Hello') // true // 相当于 isNaN(Number('Hello')) // true
// 判断
NaN
更可靠的方法是,利用NaN
为唯一不等于自身的值的这个特点,进行判断。function myIsNaN(value) { return value !== value; }
- Infinity 表示“无穷”,用来表示两种场景。一种是一个正的数值太大,或一个负的数值太小,无法表示;另一种是非0数值除以0,得到Infinity。
// Infinity大于一切数值(除了NaN),-Infinity小于一切数值(除了NaN) 1 / -0 // -Infinity 负无穷 -1 / -0 // Infinity 正无穷 Infinity === -Infinity // false // 场景一 Math.pow(2, 1024) // Infinity 计算结果太大,超出了能够表示的范围 // 场景二 0 / 0 // NaN 1 / 0 // Infinity
- 所有数字都是以64位浮点数形式储存
-
// 第1位: 符号位,0表示正数,1表示负数 // 第2位到第12位(共11位): 指数部分 // 第13位到第64位(共52位): 小数部分(即有效数字) // 第1位:符号位,0表示正数,1表示负数 // 第2位到第12位(共11位):指数部分 // 第13位到第64位(共52位):小数部分(即有效数字) // (-1)^符号位 * 1.xx...xx * 2^指数部分 // 上面公式(指数部分在0到2047之间),一个数在 JavaScript 内部实际的表示形式。 // 精度最多只能到53个二进制位, // 这意味着,绝对值小于2的53次方的整数,即-253到253,都可以精确表示。 // 9007199254740992111 // 9007199254740992000 // 上面示例表明,大于2的53次方以后,多出来的有效数字(最后三位的111)都会无法保存,变成0。
-
-
64 位浮点数的指数部分的长度是 11 个二进制位,意味着指数部分的最大值是2047(2的11次方减1)。
-
也就是说,64 位浮点数的 指数部分 的值最大为 2047,分出一半表示负数,则 JavaScript 能够表示的数值范围为2的1024到2-1023(开区间),超出这个范围的数无法表示。
如果一个数大于等于2的1024次方,那么就会发生“正向溢出”,即 JavaScript 无法表示这么大的数,这时就会返回Infinity。Math.pow(2, 1024) // Infinity
如果一个数小于等于2的-1075次方(指数部分最小值-1023,再加上小数部分的52位),那么就会发生为“负向溢出”,即 JavaScript 无法表示这么小的数,这时会直接返回0。
Math.pow(2, -1075) // 0
- 小数运算存在误差
-
0.1 + 0.2 === 0.3 // false 0.3 / 0.1 // 2.9999999999999996 (0.3 - 0.2) === (0.2 - 0.1) // false
-
- 精确的运算 , 以及关于金钱的计算 , 别用 js,需要到后台服务器处理
- Number.MAX_VALUE 为 js 所能表示的最大整数
- Number.MIN_VALUE 为 js 所能表示大于0的最小小数
- 5e3 表示 5乘以10的三次方
- 0b二进制
- 00八进制
- 0x十六进制
- 唯一有区别的场合是,
+0
或-0
当作分母,返回的值是不相等的。-
(1 / +0) === (1 / -0) // false // 上面的代码之所以出现这样结果, // 是因为除以正零得到+Infinity,除以负零得到-Infinity, // 这两者是不相等的
-
- Boolean 布尔类型
- true 或者 false
- 非布尔类型 转换为 布尔类型规则
-
转换规则是除了下面六个值被转为false, 其他值都视为true。 undefined null false 0 NaN "" 或 '' (空字符串)
-
- Null 空值类型 "赋值了,值为 null"
- null 表示一个空的对象 表示这个变量将要作为 对象 去使用
-
变量
a
分别被赋值为undefined
和null
,这两种写法的效果几乎等价。在
if
语句中,它们都会被自动转为false
,相等运算符(==
)甚至直接报告两者相等。-
if (!undefined) { console.log('undefined is false'); } // undefined is false if (!null) { console.log('null is false'); } // null is false undefined == null // true
-
- 1995年 JavaScript 诞生时,最初像 Java 一样,只设置了
null
表示"无"。根据 C 语言的传统,null
可以自动转为0
-
Number(null) // 0 5 + null // 5
-
- Undefined 未定义类型 "未赋值"
- 只是声明, 而未曾赋值的变量,其值和类型都是 undefined
- 读取对象中不存在的 属性/方法
- 调用函数时,形参不赋值,则 形参 为 undefined
- 函数如果没有指定 return 返回值,则默认为 undefined
-
null
就像在 Java 里一样,被当成一个对象,Brendan Eich 觉得表示“无”的值最好不是对象。 -
其次,那时的 JavaScript 不包括错误处理机制,Brendan Eich 觉得,如果
null
自动转为0,很不容易发现错误。因此,他又设计了一个
undefined
。 -
区别是这样的:
-
null
是一个表示“空”的对象,转为数值时为0
; -
undefined
是一个表示"此处无定义"的原始值,转为数值时为NaN
。 -
Number(undefined) // NaN 5 + undefined // NaN
-
- String 字符串
-
// 变量声明了,但没有赋值 var i; // i = undefined // 调用函数时,应该提供的参数没有提供,该参数等于 undefined function f(x) { return x; } f() // x = undefined // 对象没有赋值的属性 var o = new Object(); o.p // o.p =undefined // 函数没有返回值时,默认返回 undefined function f() {} ret = f() // ret = undefined
- 注意:
- 通常,数值、字符串、布尔值这三种类型合称为 "原始类型 primitive type" 的值。
- 对象,则称为 "合成类型" 的值。
- 一个对象往往是多个原始类型的值的合成,可以看作一个存放各种值的容器。
- 将 undefined 和 null 一般看作两个特殊的值。
- 对象是最复杂的数据类型,又可以分成三个子类型
- 狭义的对象 object
- 数组 array
- 函数 function
- 狭义的对象和数组是两种不同的数据组合方式
- 函数其实是处理数据的方法,JavaScript 把它当成一种数据类型,可以赋值给变量,这为编程带来了很大的灵活性,也为 JavaScript 的“函数式编程”奠定了基础。
- 一种引用数据类型
- 对象类型 各种值组成的对象
- 内建对象
-
普通对象Object
-
数组对象Array
-
函数对象Function
-
-
宿主对象
-
自定义对象
- 对象就是一组“键值对”(key-value)的集合,是一种无序的复合数据集合。
var x = 'sex';
var obj = { foo: 'Hello', bar: 'World',
[x]: "男" };
// 属性的值还是一个对象,就形成了链式引用。 - 查看一个对象本身的所有属性,可以使用
Object.keys
方法。var obj = { key1: 1, key2: 2 }; Object.keys(obj); // ['key1', 'key2']
delete
命令用于删除对象的属性,删除成功后返回true
var obj = { p: 1 }; Object.keys(obj) // ["p"] delete obj.p // true obj.p // undefined Object.keys(obj) // []
// 注意: 删除一个不存在的属性,delete
不报错,而且返回true
只有一种情况,
delete
命令会返回false
,那就是该属性存在,且不得删除。// Object.defineProperty() 创建的对象obj的p属性是不能删除的, var obj = Object.defineProperty({}, 'p', { value: 123, configurable: false }); obj.p // 123 delete obj.p // false 所以delete命令返回false
即使
delete
返回true
,该属性依然可能读取到值。var obj = {}; delete obj.toString // true obj.toString // function toString() { [native code] } // 上面代码中,toString是对象obj继承的属性, // 虽然delete命令返回true,但该属性并没有被删除,依然存在
- 检查对象是否包含某个属性
var obj = { p: 1 }; 'p' in obj // true 'toString' in obj // true // toString() 方法是继承的 // 使用对象的hasOwnProperty方法判断,是否为对象自身的属性 var obj = {}; if ('toString' in obj) { console.log(obj.hasOwnProperty('toString')) // false } // for...in循环用来遍历一个对象的全部属性。 // 遍历的是对象所有可遍历(enumerable)的属性,会跳过不可遍历的属性 // 对象都继承了toString属性,但是for...in循环不会遍历到这个属性 // 关于对象属性的可遍历性,参见《标准库》章节中 Object 一章的介绍。 var obj = {a: 1, b: 2, c: 3}; for (var i in obj) { console.log('键名:', i); console.log('键值:', obj[i]); } // 使用for...in的时候,应结合 hasOwnProperty(),在循环内判断,某个属性是否为对象自身的属性。 var person = { name: '老张' }; for (var key in person) { if (person.hasOwnProperty(key)) { console.log(key); } } // name
- 操作同一个对象的多个属性
// 例一 , 设置已有属性 var obj = { p1: 1, p2: 2, }; with (obj) { p1 = 4; p2 = 5; } // 必须是当前对象已经存在的属性,否则创造一个当前作用域的全局变量
// 等同于 obj.p1 = 4; obj.p2 = 5;
// 例二 访问已有属性 with (document.links[0]){ console.log(href); console.log(title); console.log(style); }
// 等同于 console.log(document.links[0].href); console.log(document.links[0].title); console.log(document.links[0].style);这是因为
with
区块没有改变作用域,它的内部依然是当前作用域。这造成了with
语句的一个很大的弊病,就是绑定对象不明确。 - 单纯从上面的代码块,根本无法判断
x
到底是全局变量,还是对象obj
的一个属性。这非常不利于代码的除错和模块化,编译器也无法对这段代码进行优化,只能留到运行时判断,这就拖慢了运行速度。因此,建议不要使用with
语句,可以考虑用一个临时变量代替with
。
- 对象就是一组“键值对”(key-value)的集合,是一种无序的复合数据集合。
- 内建对象
- 对象类型 各种值组成的对象
面试题
1. a[变量] 其中 a 是一个对象,使用 [] 来读写对象,会调用 .toString() 将 变量 隐式转换 为 字符串
-
var a{}; var b = { n: 2 }; var c = { m: 3 }; a[b] = 4; // a[b.toString()] = 4 a["object Object"] = 4 a[c] = 5; // a[c.toString()] = 5 a["object Object"] = 5 console.log(a[b]); // 打印 5
== 会进行复杂的 隐式类型转换
=== 会进行 数据类型 和 值 的比较
三种方法 确定一个值是什么数据类型
- typeof 运算符 检测基本数据类型 Number、Boolean、String、Undefined
- 使用 typeof 来查看一个变量的数据类型。
-
typeof 123 // "number" typeof '123' // "string" typeof false // "boolean" typeof typeof 123 // "string" 因为 typeof 返回值是 string
// 函数返回function function f(){} typeof f // "function" // 对象返回object typeof window // "object" typeof {} // "object"
/**** 一个数组 也返回 object ****/
typeof [] // "object" /**** null 返回 object 表示将要作为对象使用 ****/ typeof null // "object" // undefined 返回 undefined typeof undefined // "undefined" // typeof可以用来检查一个没有声明的变量,而不报错。 console.log(typeof a); // 返回一个字符串 "undefined" // 实际编程中,这个特点通常用在判断语句 // 错误的写法 if (v) { // ... } // ReferenceError: v is not defined // 正确的写法 if (typeof v === "undefined") { // ... }
-
- 使用 typeof 来查看一个变量的数据类型。
- instanceof 运算符 检测引用数据类型
-
// 空数组([])的类型也是object,这表示在 JavaScript 内部,数组本质上只是一种特殊的对象。 // 这里顺便提一下,instanceof运算符可以区分数组和对象。var o = {}; var a = []; o instanceof Array // false 对象不是数组类型的 a instanceof Array // true 数组是对象类型的
-
- Object.prototype.toString() 方法
变量类型: 变量的类型实际上是变量内存中数据的类型
- 基本类型: 保存基本类型数据的变量
- 引用类型: 保存对象地址值的变量
数据对象:
- 基本类型
- 对象类型
数据
即存储于内存中代表特定信息的东东,本质就是 01 二进制。
具有 可读 、可传递 的基本特性,一切皆数据
数据运行于内存中,读写速度快。
- 硬盘 持久存储数据
- 内存 临时存储数据 变量名 变量值
- (空间较小)栈 基本数据的变量名,基本数据的值,引用数据的变量名(对象的引用地址)
- (空间较大)堆 引用数据的值(对象: Object、Array、Function)
垃圾回收机制: 当堆中的一个对象,再也没有任何一个变量指向它,则将在一段时间后被销毁
所以,我们不再需要某个对象时,只需要 obj = null; 即可
变量
- 存储的,要么是 基本数据的值,或者 引用数据的地址值(变量名)
- 操作的,无非就是 值传递 或者 引用传递