JavaScript回顾学习：基本知识

你的名字 2022-05-20 02:23 155阅读 0赞

1、JavaScript5种基本数据类型、1种复杂数据类型：

基本数据类型：Undefined、Null、Boolean、Number和String

复杂数据类型：Object， 本质是一组键值对组成的

2、typeof操作符：用于检测给定变量的数据类型，对一个值试用typeof操作符可能返回下列某个字符串：

"undefined"——表示值未定义；  
    "boolean"——表示值是布尔值；  
    "string"——表示值是字符；   
    "number"——表示值是数值；    
    "object"——表示值是对象或null；

"function"——表示值是函数；

3、Boolean类型：

该类型只有两个字面值：true和false

以下为各种数据类型及其对应的转换规则：

<table style="border-spacing:0px;background-color:rgb(255,255,255);width:620px;border-top:1px solid rgb(221,221,221);border-right:1px solid rgb(221,221,221);border-bottom:1px solid rgb(221,221,221);border-left:none;color:rgb(47,47,47);font-family:'-apple-system', 'SF UI Text', Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;font-size:16px;"> 
 <thead> 
  <tr> 
   <th style="text-align:center;line-height:20px;vertical-align:middle;">数据类型</th> 
   <th style="text-align:center;line-height:20px;vertical-align:middle;">转换为true的值</th> 
   <th style="text-align:center;line-height:20px;vertical-align:middle;">转换为false的值</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">Boolean</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">true</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">false</td> 
  </tr> 
  <tr style="background-color:rgba(181,181,181,.1);"> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">String</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">任何非空字符串</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">""(空字符串)</td> 
  </tr> 
  <tr> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">Number</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">任何非零数值(包括无穷大)</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">0和NaN</td> 
  </tr> 
  <tr style="background-color:rgba(181,181,181,.1);"> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">Object</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">任何对象</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">null</td> 
  </tr> 
  <tr> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">Undefined</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">n/a</td> 
   <td style="line-height:20px;vertical-align:middle;text-align:center;">undefined</td> 
  </tr> 
 </tbody> 
</table>

4、Number类型

（1）NaN,即非数值(Not a Number),表示一个本来要返回数值的操作数未返回数值的情况(这样就不会跑出错误了)。

（2）Number() 转型函数用于任何数据类型

（3）parseInt() 字符串转换为数值

（4）parsefloat()只解析十进制，转换为浮点数，十六进制总会被转化为0

（5）toFixed()数值小数点几位

（6）isNaN()判断是否Nan类型

例如：alert(isNaN(NaN))  //true  
          alert(isNaN(10)); //false (10是一个数值)  
          alert(isNaN("10"));  //false (可以被转换成数值10)  
          alert(isNaN("blue")) ; //true（不能转换成数值）  
          alert(isNaN(true));  //false 可以被转换成数值1

5、String类型

（1）toString(); 转换为字符串，null和undefined值无此方法

（2）String(); 将任何类型的值转换为字符串

6、Object类型

（1）constructor: 保存用于创建当前对象的函数。构造函数(constructor)就是Object()。  
（2）hasOwnProperty(propertyName): 检查给定属性是否在当前的对象实例中(而不是在实例的原型中)，o.hasOwnProperty("name")。  
（3）isPrototypeOf(object), 检查传入的对象是否是传入对象的原型  
（4）propertyIsEnumerable(propertyName) 检查给定的属性是否可用for...in 枚举

（5）valueOf() 返回对象的字符串、数值或布尔值表示。

7、Undefined类型

只有一个值，即特殊的undefined.在使用var 声明变量但未对其加以初始化时，这个变量的值就是undefined. undefined值是派生自null值的

8、Null类型

null值表示一个空对象指针，而这也正是使用typeof 操作符检测null值时会返回"object"的原因。

null==undefined  //true

null===undefined //false

9、Array类型

（1）创建数组

new操作符 + Array构造函数：

var colors = new Array(20); //创建length值为20的数组  
    var colors = Array(20); //同上  
    var colors = Array("Gred");

var colors = new Array("Gred");

数组字面量表示法：

var colors = \[\];

（2）检测数组

instanceof 对于只有一个网页或全局作用域而言可以使用instanceof

Array.isArray() 不管数组在哪个全局环境中创建的

（3）toLocaleString() 返回数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串

valueOf() 返回数组

toString() 返回数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串

join() 返回用指定分隔符拼接而成的字符串

push() 添加元素到数值中，接受任意数量的参数，添加至数组末尾，返回修改后数组的长度

pop() 移除栈顶元素，不接受，返回一个移除的元素

shift() 从数组前端移除项，返回一个移除的元素

unshift() 向数组前端添加任意项并返回新数组的长度

push() + shift() 可以模拟队列

reverse() 反转数组

sort() 升序排列，也可以传入function函数指定排序方式。

concat() 两个数值合并

slice() 接受一个或两个参数，返回数组指定位置起始和结束位置中的所有项(不包括起始位置)，不会修改数值

splice() 向/从数组中添加/删除项目，然后返回被删除的项目。

arrayObject.splice(index,howmany,item1,.....,itemX)

<table style="border:1px solid rgb(170,170,170);color:rgb(0,0,0);font-family:'PingFangSC-Regular', Verdana, Arial, '微软雅黑', '宋体';font-size:14px;background-color:rgb(253,252,248);"> 
 <tbody> 
  <tr style="border-top:0px;background-color:rgb(245,245,245);"> 
   <th style="border-color:rgb(63,63,63);vertical-align:baseline;background-color:rgb(63,63,63);color:rgb(255,255,255);width:180.333px;">参数</th> 
   <th style="border-color:rgb(63,63,63);vertical-align:baseline;background-color:rgb(63,63,63);color:rgb(255,255,255);">描述</th> 
  </tr> 
  <tr style="border-top:0px;background-color:rgb(255,255,255);"> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">index</td> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。</td> 
  </tr> 
  <tr style="border-top:0px;background-color:rgb(245,245,245);"> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">howmany</td> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">必需。要删除的项目数量。如果设置为 0，则不会删除项目。</td> 
  </tr> 
  <tr style="border-top:0px;background-color:rgb(255,255,255);"> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">item1, ..., itemX</td> 
   <td style="border-color:rgb(170,170,170);vertical-align:text-top;">可选。向数组添加的新项目。</td> 
  </tr> 
 </tbody> 
</table>