JS学习笔记01-对象类型

JavaScript是一种"动态类型"语言，变量没有类型限制，可以随时更改类型，可以随时赋予任意值。本文主要记录两大类常见类型：

原始类型：boolean、number、string
合成类型：Object、Function、Array

一、原始类型

1.1、boolean

1.1.1 相关方法

none

1.1.2 重点难点

none

1.1.3 类型转换

Boolean()函数可以将任意类型的值转为布尔

它的转换规则相对简单：除了五个值(null、undefined、0、NaN、空字符串)的转换结果为false，其他的值全部为true。注意所有对象(包括空对象)的转换结果都是true，连false对应的对象new Boolean(false)也是true。

1.2、number

1.2.1 相关方法

parseInt：用于将字符串转为整数

parseFloat：用于将一个字符串转为浮点数

1.2.2 重点难点

JS内部所有数字都是以64位浮点数形式储存，即使整数也是如此：

第1位：符号位，0表示正数，1表示负数

第2位到第12位(共11位)：指数部分

第13位到第64位(共52位)：小数部分(即有效数字)

所以1与1.0是严格相同的。又因浮点数不是精确的值，所以涉及小数比较和运算要小心。如(0.3-0.2)===(0.2-0.1)// false

JavaScript提供了两个特殊的值

NaN：表示“非数字”。NaN不等于任何值，包括它本身。如要判断使用isNaN()函数。

Infinity：表示“无穷”。Infinity有正负之分，分别为正负无穷，两者不相等。

1.2.2 类型转换

Number函数可以将任意类型的值转化成数值

Number函数将字符串转为数值时，基本上只要有一个字符无法转成数值，整个字符串就会被转为NaN。

原始类型值：

null：转为0

undefined：转为NaN

boolean：转为对应值的数值

string：可以被解析为数值，则转换为相应的数值，否则转为NaN进行报错。空串为0。

合成类型值：

Number背后的转换规则(与String相反)：

调用对象自身的valueOf方法。如果返回原始类型的值，则对该值使用Number函数，不再进行后续步骤。

调用对象自身的toString方法。如果返回原始类型的值，则对该值使用Number函数，不再进行后续步骤。(当单个数组调用toString方法，返回下标0的value)

转为NaN进行报错。

1.3、string

1.3.1 相关方法

btoa()：任意值转为Base64编码

atob()：Base64编码转为原来的值

Base64 就是一种编码方法，可以将任意值转成 0～9、A～Z、a-z、+和/这64个字符组成的可打印字符。使用它的主要目的不是为了加密，而是为了不出现特殊字符，简化程序的处理。

注意这两个方法不适合非ASCII码的字符，要将非ASCII码字符转为Base64编码，必须中间插入一个转码环节，再使用这两个方法：
function b64Encode(str) {
return btoa(encodeURIComponent(str));
}

function b64Decode(str) {
return decodeURIComponent(atob(str));
}

b64Encode('你好') // "JUU0JUJEJUEwJUU1JUE1JUJE"
b64Decode('JUU0JUJEJUEwJUU1JUE1JUJE') // "你好"

1.3.2 重点难点

JS内部使用Unicode字符集，即所有字符都用Unicode表示。

每个字符在JS内部都是以16位(即2个字节)的UTF-16格式储存。也就是说JS的单位字符长度固定为16位长度，即2个字节。

但是UTF-16有两种长度：对于码点在U+0000到U+FFFF之间的字符，长度为16位；对于码点在U+010000到U+10FFFF之间的字符，长度为32位，而且前两个字节在0xD800到0xDBFF之间，后两个字节在0xDC00到0xDFFF之间。因此四字节字符𝌆，浏览器会正确识别这是一个字符，但是JS无法识别，会认为这是两个字符。所以处理的时候，必须把这一点考虑在内，也就是说JS返回的字符串长度可能是不正确的。

1.3.3 类型转换

String函数可将任意类型值转化成字符串

原始类型值：

null：转为字符串"null"

undefined：转为字符串"undefined"

boolean：转为对应值的字符串

number：转为相应的字符串

合成类型值：

String背后的转换规则(与Number相反)：

调用对象自身的toString方法。如果返回原始类型的值，则对该值使用Number函数，不再进行后续步骤。

调用对象自身的valueOf方法。如果返回原始类型的值，则对该值使用Number函数，不再进行后续步骤。

进行报错。

二、合成类型

2.1、Object

典型的面向对象编程语言(如Java)有“类”的概念，而JS的对象体系是基于原型链。两者共同联系是都有“构造函数”概念。

2.1.1 相关属性

删除对象的属性：delete命令用于删除对象自身的属性，删除成功后返回true

查看对象的属性：使用in运算符检查对象是否包含有某个属性，因此可以使用for...in循环遍历一个对象的全部可遍历(enumerable)的属性。

2.1.2 相关方法

静态相关方法：静态方法定义在Object对象上的方法。

Object(...)：Object本身是一个函数，可以使用它来将任意值转为对象。该函数可接受一个参数，如该参数是一个对象则直接返回这个对象，如果是一个原始类型的值则返回该值对应的包装对象。

对象属性模型的相关方法：

Object.create：可指定原型对象和属性，返回一个新对象

Object.getPrototypeOf：获取对象的Prototype对象

Object.getOwnPropertyNames：用来遍历对象的自身属性。返回自身所有属性的数组

Object.getOwnPropertyDescriptor：获取某个自身属性的描述对象

对象状态控制的相关方法：

Object.frozen：设置对象被冻结，使得对象既无法添加新属性、也无法删除旧属性、也无法改变属性的值，使得这个对象实际上变成了常量。对应有is函数。

Object.seal：设置对象不可配置，使得对象既无法添加新属性，也无法删除旧属性，但并不影响修改某个属性的值(因writable为true)。该函数实质是把属性描述对象的configurable属性设为false。对应有is函数。

Object.preventExtensions：设置对象不可扩展，使得对象无法再添加新的属性，但可以删除旧属性，也不影响修改某个属性的值。对应有is函数。

实例相关方法：实例方法定义在Object.prototype对象中的方法。

valueOf：返回当前对象对应的值

toString：返回当前对象对应的字符串形式

isPrototypeOf：判断当前对象是否为另一个对象的原型

hasOwnProperty：判断某个属性是否为当前对象自身的属性

2.1.3 注意事项

JavaScript提供了一个内部数据结构，用来描述对象的属性和控制它的行为，比如该属性是否可写、可遍历等等。这个内部数据结构称为“属性描述对象”。每个属性都有自己对应的属性描述对象，保存该属性的一些元信息。属性描述对象的各个属性称为“元属性”，因为它们可以看作是控制属性的属性。下面是属性描述对象的一个例子：
{
  value: 123,// 属性值。只要writable和configurable有一个为true就允许改动
  configurable: false,// 表示本描述对象是否可配置性(可改变)，默认true
  writable: false,// 表示value是否可写，默认true。它决定是否可以被修改
  enumerable: true,// 表示value是否可遍历，默认true。它决定是否可以被删除
  get: undefined,// 表示该属性的取值函数，默认为undefined
  set: undefined,// 表示该属性的存值函数，默认为undefined
}

2.2、Function

2.2.1 相关属性

name：返回函数的名字，只会一次性赋值。

length：返回函数预期传入的参数个数，并不是实际传入的个数。

arguments：对象包含了函数运行时的所有参数。

arguments对象的callee属性，返回它所对应的原函数

arguments对象的length属性，可判断函数调用时到底带几个参数

2.2.2 相关方法

bind：该方法第一个参数是this要指向的那个对象，后面参数则是原函数对应位置上的参数。用于将函数体内的this指向到某个对象，然后返回一个绑定后的新函数。

call：该方法第一个参数是this要指向的那个对象，后面参数则是函数调用时所需参数。用于指定函数内部this的指向对象，使该对象(位于栈区)指向该函数定义(位于堆区)，不然函数就是一个单独的内存地址(位于堆区而不属于任何对象)导致用户不能直接操作。

apply：作用与call方法类似(互为语法糖)。该方法第一个参数是this要指向的那个对象，第二个参数则是一个数组(该数组的所有成员依次作为参数，传入原函数)。

2.2.3 注意事项

如果同时用function命令和赋值语句声明同个函数，最后采用赋值语句的定义，因为函数声明先于变量声明，后者能覆盖前者。
function func() {
console.log('1');
}

var func = function () {
console.log('2');
}

func() // 2
apply和call可以去改变函数执行的Scope，从而改变this(它代指调用该函数的对象，是运行时确定的)指向。函数在正常调用时是种语法糖，本质上是func.call(CurObj,...)的调用。
var a1 = 11;
a2 = 22;


function func(){
 var b1 = 21;
 b2 = 22;
 console.log(this);
 
 return function(){
     var c1 = 31;
     c2 = 32;
     
     console.log(this);
 }
}

console.log(this);
this.func()();
function func() { 
 console.log(this.a);
}

var a = 1;

var obj1 = { 
 a: 2,
 func: func 
};

var obj2 = { 
 a: 3,
 obj1: obj1
};

obj2.obj1.func();
var funcPtr = obj2.obj1.func;// 其实就是funcPtr为一个指针，指向了func函数
funcPtr();

2.3、Array

通过typeof运算符可以看到返回数组的类型是object。数组可以理解为是一种下标默认整数(会被转化为字符串)的对象，因此数组是按次序排列的一组无类型的值(即任何类型的数据都可组合放入数组)，下标从0开始。

如果一个对象的所有键名都是正整数或零，并且有length属性，那么这个对象就很像数组，语法上称为“类似数组的对象”，典型的“类似数组的对象”是字符串、函数的arguments对象、大多数DOM元素集。

2.3.1 相关属性

length：返回数组的长度

2.3.2 相关方法

元素增删改相关方法：

shift：用于删除数组的第一个元素，并返回该元素。会改变原属组。

unshift：用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。会改变原属组。

pop：用于删除数组的最后一个元素，并返回该元素。会改变原属组。

push：用于在数组的末端添加一个或多个元素，并返回添加新元素后的数组长度。会改变原属组。

slice：用于提取目标数组的一部分，返回一个新数组。还可将“类似数组的对象”变成真正数组。会改变原属组。

concat：将新数组的成员，添加到原数组成员的后部，返回一个新数组。如果数组成员包括对象，新数组成员则是一个“浅拷贝”。不改变原数组。

map：将数组所有成员依次传入参数函数，然后把每次执行结果组成新数组返回。不改变原数组。

元素查找相关方法：

filter：用于过滤数组成员，满足条件的成员组成一个新数组返回。

forEach：用于遍历数组，使用forEach.call方法可以把forEach()嫁接到类似数组的对象上。

indexOf：返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1。

2.3.3 注意事项

delete命令：删除一个数组成员会形成空位，并且不会影响length属性，且数组的空位是可以读取的，返回undefined

2.4、Regex

新建正则表达式有两种方法：

使用字面量，以斜杠表示开始和结束：var regex = /xyz/;
使用RegExp构造函数：var regex = new RegExp('xyz');

2.4.1 相关属性

RegExp.prototype.source：返回正则表达式的字符串形式(不包括反斜杠)，该属性只读。

RegExp.prototype.flags：返回一个字符串，包含了已经设置的所有修饰符，按字母排序。

RegExp.prototype.global：返回一个布尔值，表示是否设置了g修饰符。

g修饰符表示全局匹配。默认情况下，第一次匹配成功后，正则对象就停止向下匹配；加上它以后，正则对象将匹配全部符合条件的结果，主要用于搜索和替换。

RegExp.prototype.multiline：返回一个布尔值，表示是否设置了m修饰符。

m修饰符表示多行模式，会修改^和$行为。默认情况下，^和$匹配字符串的开始处和结尾处；加上m修饰符以后，^和$还会匹配行首和行尾，即^和$会识别换行符（\n）。

RegExp.prototype.ignoreCase：返回一个布尔值，表示是否设置了i修饰符。

i修饰符以后表示忽略大小写。默认情况下，正则对象区分字母的大小写，加上它以后表示忽略大小写。

2.4.2 相关方法

RegExp.prototype.test(str)：返回一个布尔值，表示当前模式是否能匹配参数字符串

RegExp.prototype.exec(str)：返回匹配结果。如匹配就返回一个数组，成员是匹配成功的子字符串，否则返回null

2.4.3 注意事项

字符串的实例方法之中，有4种与正则表达式有关：

String.prototype.match()：返回一个数组，成员是所有匹配的子字符串。

String.prototype.search()：按照给定正则表达式搜索，返回一个表示匹配开始的位置的整数。

String.prototype.replace()：按照给定正则表达式进行替换，返回替换后的字符串。

String.prototype.split()：按照给定规则进行字符串分割，返回包含分割后各个成员的数组。

三、常见操作符

3.1、变量声明

在JS中变量声明有几种方式：

不用任何修饰符的变量作为全局对象的属性。

使用var修饰符的变量作为当前对象的属性。

var存在变量提升，let不存在变量提升。

3.2、对象比较

三等号本质上是内存比较。当进行三等号比较时，如果类型不同直接就是false，否则进行内存比较。

三等号时，如果两个值都是null，或是undefined，那么相等，否则不相等。

三等号时，如果两个都是字符串且每个位置的字符都一样，那么相等，否则不相等。

双等号本质上是数值比较。当进行双等号比较时，当进行双等号比较时先检查两个操作数数据类型，如果相同则进行三等号比较。如果不同则进行一次类型转换，转换成相同类型后再进行比较。

双等号时，如果一个是null且另一个是undefined，那么相等，否则不相等。

双等号时，如果两个都是字符串且每个位置的字符都一样，那么相等，否则不相等。

其它类型不再概述，随用随查吧*_*

3.3、类型判断

typeof运算符，返回值为数据类型的字符串。注意的是因历史原因typeof null // "object"。
instanceof运算符，返回值为校验对象是否为指定的构造函数的实例
Object.prototype.toString方法

3.4、加载时机

document.ready()是DOM文档树加载完成之后执行，不包含图片以及其他媒体文件。

window.onload是在页面中包含图片在内的素有元素全部加载完成再执行。

因此document.ready()快于window.onload执行。

来源：https://www.cnblogs.com/vpdong/p/11958253.html

标签

字符数组

对象数组

js面向对象

字符串函数