03-2 JS的常用对象（2）

原创 于 2017-08-28 23:43:58 发布 · 272 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript常用对象

本文深入讲解JavaScript中的核心对象，包括Boolean、Number、String、Array、Date、Math和RegExp等，覆盖了这些对象的基本用法、常见属性及方法。

1、Boolean（了解）

Boolean对象描述

         1）Js提高的3个包装对象之一，是基本类型boolean的包装类；

2）Boolean 对象主要用于提供将布尔值转换成字符串的 toString() 方法。

 

Boolean对象创建

Boolean 对象表示两个值："true"或 "false"。

创建 Boolean 对象的语法：

new Boolean(value);        //构造函数

Boolean(value);                 //转换函数

当作为一个构造函数，把它的参数转换成一个布尔值，并且返回一个包含该值的 Boolean 对象。

如果作为一个函数调用时，B把它的参数转换成一个原始的布尔值，并且返回这个值。

 

注释：如果省略 value 参数，或者设置为 0、-0、null、""、false、undefined或 NaN，则该对象设置为 false。否则设置为 true（即使 value参数是字符串 "false"）。

2、Number（了解）

Number对象描述

         1）Js提高的3个包装对象之一，是基本类型 数值类型的包装类；

2）在必要时，JavaScript 会自动地在原始数据和对象之间转换。

 

Number对象创建

Number 对象是原始数值的包装对象。

创建 Number 对象的语法：

var myNum=new Number(value);

var myNum=Number(value);

当作为一个构造函数时，它返回一个新创建的 Number 对象。

当作为一个函数来调用，把自己的参数转换成一个原始的数值，并且返回这个值（如果转换失败，则返回 NaN）。

3、String

String对象描述            

1）字符串是 JavaScript 的一种基本的数据类型。

2）String对象的length 属性 声明了该字符串中的字符数。

3）String 类定义了大量操作字符串的方法。

例如：从字符串中提取字符或子串；检索字符或子串；大小写转换等

 

注意：JavaScript 的字符串是不可变的（immutable），String类定义的方法都不能改变字符串的内容。像String.toUpperCase()这样的方法，返回的是全新的字符串，而不是修改原始字符串。

 

String对象创建

String 对象用于处理文本（字符串）。

创建 String 对象的语法：

new String(s);

String(s);

当作为构造函数使用时，它返回一个新创建的 String 对象，存放的是字符串 s 或 s 的字符串表示。

当作为函数调用时，它只把 s 转换成原始的字符串，并返回转换后的值。

 

3.1String常用属性和方法

属性length：返回字符串的长度；

 字符方法

charAt、charCodeAt、formCharCode

var s = "abcd";
console.log(s.charAt(1));//b
console.log(s.charCodeAt(1));//98
//*静态方法
console.log(String.fromCharCode(98));//b 

位置方法

indexof：返回某一个指定的字符首次出现的位置,对应的字符函数返回-1

lastIndexof：与上面恰好相反，从末尾查找起。

var s = "abcdcba";
console.log(s.indexOf('b'));     //1
console.log(s.lastIndexOf('b')); //5

从原字符串中获取子串

substring、substr、slice

var s = "abcdefg";
console.log(s.substring(1));   //bcdefg
// 截取索引是1，4的子串（顾头不顾尾）
console.log(s.substring(1,4));//bcd
// 负值转换为0
console.log(s.substring(-1,4));//abcd
 
console.log(s.substr(1));      //bcdefg
// 截取从索引1，开始截取，往后截取4个
console.log(s.substr(1,4));    //bcde
// 第一个参数与字符串长度相加，第二个参数转换为0
console.log(s.substr(-1,4));   //g
 
console.log(s.slice(1));       //bcdefg
console.log(s.slice(1,4));     //bcd
//负值与字符串长度相加
console.log(s.substr(-1,4));   //g

大小写转换

toLowerCase、toUpperCase

略

去处空格

trim、trimLeft、trimRight

略

匹配方法

match、search、replace、split

var s = "aabcddee";
//如果没有找到，返回null;0表示被匹配到的字符串;index表示被匹配到的位置;input表示被查找的这个子串
console.log(s.match("abc")); //[0："abc", index: 1, input:"aabcddee"]
//查找下标
console.log(s.search("bc")); //2
console.log(s.replace("aa","**"));//**bcddee
console.log(s.split("dd"));  //["aabc","ee"]                                                                   

 拼接方法

concat

var s = "a";
// 可添加n个参数
console.log(s.concat("bc","de","f","g"));//abcdefg          

编码方法

字符串常规编码与解码：escape、unescape

URI字符串编码与解码：encodeURI、decodeURI

URI组件编码与解码：encodeURIComponent、decodeURIComponent

用的比较多的是encodeURI / decodeURI

//encodeURIComponent & decodeURIComponent
var url = "http://baidu.com?k=张三&q= a";
var enURI =encodeURIComponent(url);
var deURI =decodeURIComponent(encodeURI);
// 对整个url进行编码，不推荐
console.log(encodeURI);  //http%3A%2F%2Fbaidu.com%3Fk%3D%E5%BC%A0%E4%B8%89%26q%3D%20a
console.log(decodeURI);  // http://baidu.com?k=张三&q= a
 
// encodeURI& decodeURI
// 只对uri部分进行编码，推荐
var enURI =encodeURI(url);
var deURI =decodeURI(enURI);
console.log(enURI);  // http://baidu.com?k=%E5%BC%A0%E4%B8%89&q=%20a
console.log(deURI);  // http://baidu.com?k=张三&q= a

3.2字符串细节

n  typeof与instanceof：

var s1 = new String("abc");
console.log(typeof s1);  //object
 
var s2 = "abc";
console.log(typeof s2); //String
 
console.log((s1instanceof String)); //true
console.log((s2instanceof String)); //false

总结：instanceof适合判断对象，typeof适合判断基本类型；由此可以得到基本类型与包装类型的区别。

n  字符串的组成：

//字符串，就是一个字符数组，可以通过下标获取值
var s = new String("abcd");
console.log(s[1]);//b

n  boolean类型转换：

//boolean类型转换为字符为相应的字符串
var s = new String(true);
console.log(s);//true

4、Array

Array对象描述

Array 对象用于在单个的变量中存储多个值。

 

Array对象创建

创建 Array 对象的语法：

new Array();

new Array(size);

new Array(element0, element1, ..., elementn);

返回新创建并被初始化了的数组。

作为构造函数使用：

如果调用构造函数 没有参数 时，那么返回的数组为空，length 字段为 0。

当调用构造函数 传递一个数字参数 时，该构造函数将返回具有指定个数、元素为 undefined 的数组。

当调用构造函数 传递多个参数 时，会将参数值来初始化数组。

作为函数调用：

作为函数调用时，它的行为与使用 new 运算符调用它时的行为完全一样。

 

4.1基本操作

存取与增加数组

//数值型下标数组
var arr = new Array("aa","bb","cc","dd");
console.log(arr[1]);// bb
 
//非数值型下标数组
var arr = new Array(3);
arr["aa"] = 1;
arr["bb"] = 2;
arr["cc"] = 3;
arr["dd"] = 4;
console.log(arr["aa"]); //1

删除数组

//非数值型下标数组
var arr = new Array(3);
arr["aa"] = 1;
arr["bb"] = 2;
arr["cc"] = 3;
console.log(arr["aa"]); //1
 
delete arr["aa"];
console.log(arr["aa"]); //undefined

遍历数组//数值型下标数组

var arr = new Array("aa","bb","cc","dd");
for(var index in arr){
    console.log(arr[index]);
}

4.2Array常用属性&方法

constructor:引用数组对象的构造函数

length：返回数组的长度

prototype:通过增加属性和方法扩展数组

 

判断是否是数组

isArray()

 

在数组的头部添加元素

unshift

var arr = new Array();
arr.unshift("aa");
arr.unshift("bb");
console.log(arr[1])//aa

 

队列方法（先进先出）

push\shift（添加\删除）  

//队列方法
var arr = new Array();
console.log(arr.push("aa")); //返回数组长度1
console.log(arr.push("bb")); //返回数组长度2
console.log(arr.push("cc")); //返回数组长度3
console.log(arr.shift());//"aa"
console.log(arr.shift());//"bb"

栈方法（后进先出）

push\pop（添加删除）

//栈方法
var arr = new Array();
console.log(arr.push("aa")); //返回数组长度1
console.log(arr.push("bb")); //返回数组长度2
console.log(arr.push("cc")); //返回数组长度3
console.log(arr.pop());//"cc"
console.log(arr.pop());//"bb"

 子数组

splice: 从一个数组中移除一个或多个元素，如果必要，在所移除元素的位置上插入新元素，返回所移除的元素。

arrayObj.splice(start,deleteCount,[item1[,item2[, . . . [,itemN]]]])

start  - 删除的开始位置；

deleteCount  -  删除元素的个数

第三参数  -  在删除的位置插入的元素

注意：该方法改变了原数组

 

slice：返回一个数组的一段。

arrayObj.slice(start, [end])

start  -- 开始位置

end   -- 结束位置

 

//子数组
var arr =[1,2,3,4,5,6,7,8]; 
console.log(arr.splice(2,3,[9,9,9,9]))//[3, 4, 5]
console.log(arr);  //[1, 2, Array(4), 6, 7, 8]
var arr =[1,2,3,4,5,6,7,8];
console.log(arr.slice(2,4));//[3, 4]
console.log(arr);  //[1, 2, 3,4, 5, 6, 7, 8]
 

数组排序（略）

reverse（反转）、sort（排序）

 

数组转换（略）

toString

toLocaleString

join

 

位置方法（略）

indexof、lastIndexOf

 

迭代方法

every、filter、forEach、map、some

//every()相当于逻辑与
var arr =[1,2,3,4,5,6,7,8];
var everyRes =arr.every(function(item,index,array){
    //index当前下标； item当前值； array被迭代的数组
    return (item>2);
});
console.log(everyRes); //false
 
//some()相当于逻辑或
var someRes =arr.some(function(item,index,array){
    return (item>2);
});
console.log(someRes); //true
 
//filter()返回给定条件的数组
var filterRes =arr.filter(function(item,index,array){
    return (item>2);
});
console.log(filterRes); //[3, 4, 5, 6, 7, 8]
 
//map()返回给定条件的数组
var mapRes =arr.map(function(item,index,array){
    return (item*2);
});
console.log(mapRes);   //[2, 4, 6, 8, 10, 12, 14, 16]
 
//forEach()没有返回值
arr.forEach(function(item,index,array){
   console.log(item);
})

 

缩小方法

reduce、reduceRight

//reduce()归并方法接受传入的函数和作为归并基础的初始值(可选
//要传入的函数接收四个函数，前一个值，当前值，索引项，数组对象
var sum =arr.reduce(function(prev,cur,index,array){
   return prev + cur;
});
console.log(sum);  //36
 
//reduceRight()归并方法和reduce()方法本质一样，区别就在于是从后向前开始边里
var sum2 =arr.reduceRight(function(pre,cur,index,array){
   return pre + cur;
});
console.log(sum2); //36

5、Date

Date对象创建

Date 对象用于处理日期和时间。

创建 Date 对象的语法：

var myDate=new Date()

注释：Date 对象会自动把当前日期和时间保存为其初始值。

 

Date对象的静态方法：

Date.now()

返回当前距离1970年1月1日00:00:00 UTC的毫秒数（Unix时间戳乘以1000）。

Date.parse()

用来解析日期字符串，返回当前距离1970年1月1日00:00:00 UTC的毫秒数，解析失败返回NaN

 

Date对象的实例方法：

to类方法

toString：返回一个完整的日期字符串

 

get类方法

getTime()：返回实例对象距离1970年1月1日00:00:00 UTC的毫秒数，等同于valueOf方法

getDate()：返回实例对象对应每个月的几号（从1开始）

getDay()：返回星期几，星期日为0，星期一为1，以此类推

getYear()：返回距离1970的年数

 

valueOf方法

返回实例对象距离1970年1月1日00:00:00 UTC的毫秒数，等同于getTime方法

var date = new Date();
console.log(date); //Mon Aug 28 2017 23:33:35 GMT+0800 (中国标准时间)
console.log(Date());//Mon Aug 282017 23:33:35 GMT+0800 (中国标准时间)
console.log(date.toString());//Mon Aug 282017 23:33:35 GMT+0800 (中国标准时间)
 
console.log(date.getTime());//1503934415139
console.log(date.getDay()); //1
console.log(date.getYear());//117
 
console.log(date.valueOf());//1503934415139
 
console.log(Date.now()); //1503934415139
console.log(Date.parse("Mon Aug28 2017 23:33:35"));//1503934415139
 
date.setDate(2015,1,6);
console.log(date.valueOf());//1675611515700

6、Math

Math对象创建

Math 对象用于执行数学任务。

使用 Math 的属性和方法的语法：

var pi_value=Math.PI;

var sqrt_value=Math.sqrt(15);

注意：Math 对象并不像 Date和 String那样是对象的类，因此没有构造函数 Math()，像 Math.sin()这样的函数只是函数，不是某个对象的方法。您无需创建它，通过把 Math作为对象使用就可以调用其所有属性和方法。

7、RegExp

RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。

直接量语法

/pattern/attributes

创建 RegExp 对象的语法：

new RegExp(pattern, attributes);

pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。

 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。

 

一个新的 RegExp 对象，具有指定的模式和标志。如果参数 pattern 是正则表达式而不是字符串，那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。

如果不用 new 运算符，而将 RegExp() 作为函数调用，那么它的行为与用 new 运算符调用时一样，只是当 pattern是正则表达式时，它只返回 pattern，而不再创建一个新的 RegExp 对象。 

 

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值