JavaWEB笔记08 Javascript中的内置对象（上）

JavaWEB笔记08 Javascript中的内置对象（上）

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