JavaWEB笔记08 Javascript中的内置对象（上）
JavaWEB笔记08 Javascript中的内置对象（上）
文章目录
- JavaWEB笔记08 Javascript中的内置对象（上）
-
- JS中的三大对象：
- 一.JS中的对象--String：
-
-
- 1.String对象的创建：
- 2.String对象的方法：
- 3.字符串的反转：
-
- 二.JS中的对象--Math：
- 三.JS中的对象--Date：
-
-
- 1.Date对象的创建以及基本方法：
- 2.其他多种形式的格式返回：
-
- 四.JS中的对象--Boolean：
- 五.JS中的对象--Number：
- 六.JS中的对象--Array：
-
-
- 1.JS中的数组对象介绍：
- 2.数组对象中的常用方法：
- 3.ES6增加的数组方法：
-
- 七.关于String和Array的练习：
JS中的三大对象：
JS中有三大对象：分别是本地对象、内置对象和宿主对象，在此引用ECMA-262（ECMAScript的制定标准）对于他们的定义：
- 本地对象：
1）与宿主无关，独立于宿主环境的ECMAScript实现提供的对象
2）简单来说，本地对象就是 ECMA-262 定义的类（引用类型）
3）这些引用类型在运行过程中需要通过new来创建所需的实例对象 - 内置对象：
1）与宿主无关，独立于宿主环境的ECMAScript实现提供的对象
2）在 ECMAScript 程序开始执行前就存在，本身就是实例化内置对象，开发者无需再去实例化
3）内置对象是本地对象的子集 - 宿主对象：
1）由 ECMAScript 实现的宿主环境提供的对象，包含两大类，一个是宿主提供，一个是自定义类对象
2）所有非本地对象都属于宿主对象
3）对于嵌入到网页中的JS来说，其宿主对象就是浏览器提供的对象，浏览器对象有很多，如Window和Document等，并且所有的DOM和BOM对象都属于宿主对象
| 对象类型 | 对象包含 |
|---|---|
| 本地对象 | Object、Array、Date、RegExp、Function、Boolean、Number、String等。 |
| 内置对象 | Global和Math（ECMAScript5中增添了JSON这个存在于全局的内置对象） |
| 宿主对象 | window、document、DOM、BOM |
一.JS中的对象–String：
1.String对象的创建：
JS中的String对象用于处理文本字符串，创建对象时有加new或不加new两种方式创建：
var s=new String("abc") 或 var s=String("abc")
使用new String(str)和String(str)是不同的！
- 使用new创建，里面装进字符串，创建的类型是string，new只是作为一个指针
- 不使用new进行创建，保持object引用类型
- 检测方法：instanceof运算符是判断是判断引用是不是该类型的引用对象，可以使用instanceof对于上述两种进行检查：
<script type="text/javascript">
var s1=new String("abc");
var s2=String("abc");
alert((s1 instanceof(Object))+" "+(s2 instanceof(Object)));
</script>
由上面的代码中的效果呈现中可以看到：使用new创建是引用对象，不使用new创建不是引用对象
2.String对象的方法：
var len=String.length获得字符串长度
charAt() 返回在指定位置的字符
concat() 连接字符串
indexOf() 根据字符检索此符在字符串中的索引
lastIndexOf() 从后向前搜索字符串
substring() 提取字符串中两个指定的索引号之间的字符
toLowerCase() 把字符串转换为小写
toUpperCase() 把字符串转换为大写
replace() 替换字符串
split() 把字符串分割为字符串数组
trim()去除字符串两端的空格
3.字符串的反转：
示例：
<script type="text/javascript">
var s=String("nwkcmckj;ocwkoac");
var sx=s.split(' ').reverse();
alert(sx)
</script>
效果：
二.JS中的对象–Math：
JS中的Math对象是静态对象，在创建时不用new，可以直接进行调用，如：Math.random()是随机数等与java中math类有很多相同之处：
示例：随机生成六组四位验证码：包含数字和字母：
基本步骤：生成随机索引：Math.floor(Math.random()*str.length); floor函数向下取整，使用charAt进行获取字符串，并最后拼串即可：
<script type="text/javascript">
var str=String("abcdefghijklmnopqrstuvwxyz0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ");
function YanZhengMa(s) {
var len = s.length;
var arr="";
for (var i=0;i<4;i++){
var index=Math.floor(Math.random()*len);
arr += s[index];
}
return arr;
}
var yzm="";
for(var i=0;i<6;i++){
var yanzhengma = YanZhengMa(str);
yzm += (yanzhengma+"\n");
}
alert(yzm);
</script>
三.JS中的对象–Date：
1.Date对象的创建以及基本方法：
新建一个date对象，可以使用new来创建：var date=new Date(); Date对象故名思意返回的是时间：
基本方法：
getFullYear()得到年份（四位返回）getMonth()得到月份getDay()得到日期toLocaleDateString()是格式：年/月/日
2.其他多种形式的格式返回：
- 把日期转成毫秒值：使用
Date.unix()； - 使用第三方的日期格式：
var datastr = moment().format('YYYY-MM-DD HH')显示出的时间是年-月-日 时的形式，需要加上秒是ss，分钟是mm- 格式化指定的日期：
var datastr = moment(time).format('指定格式')将指定时间进行格式化
四.JS中的对象–Boolean：
JS中的Boolean对象中值得注意的是：if中的类型转换：
- 空串转false，有内容的串转true
- 转换规则：如果省略 value 参数，或者设置为 0、-0、null、""、false、undefined 或 NaN，则该对象设置为 false。否则设置为 true（即使 value 参数是字符串 “false”）
五.JS中的对象–Number：
JS中的Number对象可以使用new进行创建，其创建出的类型为Number类型，而不使用new进行创建，其类型为object（同上String）：
基本方法：
1）toFixed方法可以将Number类型中将数字转换为字符串，结果的小数点后有指定位数的数字，会四舍五入
2）toPrecision方法可以将数字格式化为指定长度， 保留小数点后几位
六.JS中的对象–Array：
1.JS中的数组对象介绍：
JS的数组对象，更类似于Java中的ArrayList集合，新建数组有以下三种方式：
- 1）空参构造函数：new Array();
- 2）new Array(数组长度); 定义数组长度
- 3）new Array(element1,…elementn); 定义时直接加载元素
Array对象细节：
- JS中数组长度是可变的，JS中数组可以存储任意数据类型，获取数组长度：var len=arr.length;
- 若对于数组值的定义仅定义arr[0],arr[5]，则使用len进行测量长度为6，而访问未定义元素结果为undefined
- 数组的创建在元素不多且已知的情况下可以采取简写方式：
var arr=[100,200,300,400,"abc",true]长度可变，类型不限
2.数组对象中的常用方法：
concat() 连续两个或多个数组，并返回结果是一个新数组，相当于java中的addAll
join() 将数组元素变成字符串，中间用后面的东西隔开，默认使用逗号隔开
pop() 删除并返回数组中的最后一个元素
shift() 删除并返回数组的第一个元素，且数组中会缺少该被删除的元素
push() 往数组中添加元素，向数组的末尾进行添加
reverse() 反转数组元素
slice(起始索引,终止索引) 可以从某个已有的数组中返回选定的元素
sort() 对数组元素进行排序，是按照字典序进行排序的，想要按照大小排，需要传入比较函数
function(a,b){ return a-b} 比较函数中常用
splice() 删除数组中的元素，指定索引进行删除下标对应的后面跟参数str，即删除之后将删除的地方进行替换，splice方法算是数组对象中最常用且最实用的一种方法
3.ES6增加的数组方法：
filter() 过滤方法：检测数组元素并返回符合条件的所有元素的数组,在filter后面中加入函数：
var newArr = arr.filter(function(elem)){
return elem>100;
}
即返回符合条件的元素，成立新数组
forEach() 遍历方法：数组中的每个元素都执行一次回调函数
arr.forEach(function(elem)){
alert(elem);
}
即将数组中全部元素遍历并弹框
map() 处理方法：通过指定函数处理数组的每个元素，并返回处理后的数组
var newArr = arr.map(function(elem)){
return elem*elem;
}
即将数组中每一个元素都平方
reduce() 规约方法：将数组中的元素进行计算，可以作为一个累加器使用：
var sum = arr.reduce(function(total,currentValue){
return total+currentValue
},0);
即将数组中全部的值进行相加
七.关于String和Array的练习：
（注：JS语法错误在浏览器中的控制台处可以进行查看）
1.给你一个字符串String=“adadfdfseffqdjhuserfefsefseetsdg”，要求找出里边的字符串qdjhu，使用JavaScript实现。
<script type="text/javascript">
var str=String("adadfdfseffqdjhuserfefsefseetsdg")
var index=str.indexOf("qdjhu")
alert(index)
</script>
运行结果：11
2.请自定义一个函数，实现字符串反转。
<script type="text/javascript">
stra=String("hougfyedtfgjkokoiusgwftyrdsadhggjklwoiyuyftdtyd");
function STRreverse(a) {
var b="";
var len = a.length;
for(let i=0;i<len;i++){
b+=a[len-i-1];
}
alert(b);
}
STRreverse(stra);
</script>
运行结果：dytdtfyuyiowlkjgghdasdrytfwgsuiokokjgftdeyfguoh
3.JavaScript中如何检测一个变量是一个string类型？
<script type="text/javascript">
str=new String("ebgjcbekcnjcbejcnelcghwcwjmakncw");
alert(str instanceof String);
</script>
运行结果：true
4.有一个字符串abcd-ef-ghi，请用javascript将它处理成ghi&ef&abcd。
<script type="text/javascript">
var str=String("abcd-ef-ghi");
var newstr=str.replace(/-/g,"&");
function STRreverse(a) {
var b="";
var len = a.length;
for(let i=0;i<len;i++){
b+=a[len-i-1];
}
return b;
}
var ns=STRreverse(newstr);
var arr=ns.split('&');
for (let i=0;i<arr.length;i++){
arr[i]=STRreverse(arr[i]);
}
var fstr='';
for(let i=0;i<arr.length-1;i++){
fstr+=(arr[i]+'&');
}
fstr+=arr[arr.length-1];
alert(fstr);
</script>
运行结果：ghi&ef&abcd
5.请编写尽可能简洁的javascript代码，找到第一个数组array1中出现，而在第二个数组array2中没有出现的数字。
<script type="text/javascript">
var arr1=new Array(1,10,45,4,42,61,5,5,27,258,8,45,5,8);
var arr2=new Array(1,5,1,45,55,42,5,9955,51,896641,855);
var arr3=new Array(0,0,0,0,0,0,0,0,0,0,0);
for(var i=0;i<arr1.length;i++){
for(var j=0;j<arr2.length;j++){
if(arr2[j] === arr1[i]){
arr3[j]=1;
}
}
}
var arr4=new Array();
var index=0;
for(var j=0;j<arr2.length;j++){
if(arr3[j]===0){
arr4[index]=arr2[j];
index++;
}
}
alert(arr4);
</script>
运行结果：55,9955,51,896641,855