js-内置对象

JavaScript内置对象

JavaScript对象隶属于window对象,由于它是“全局对象”,同时也是默认对象,因此window关键字可以省略不写。

window对象包含需对的子对象,这些子对象可以分为三种类型:

JavaScript内置对象

1、核心对象:这是指的是真正属于JavaScript所内置的对象,与网页、浏览器或其他环境无关,也就是说,无论使用JavaScript做任何应用都可以通过这些对象访问数据或进行运算,包括Array、Boolean、Date、Error、Function、Global、Math、Number、Object、RegExp、String等。
2、环境对象:可以通过环境对象访问浏览器或用户屏幕等信息,包括location、screen、navigator、history等。
3、document对象:这个对象代表的是HTML文件本身,可以通过它访问HTML文件的元素,包括窗体、图片、表格、超链接等。

window对象

window对象代表一个浏览器窗口、索引标签或框架。

w3c中讲解的window对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<a href="javascript:window.openNew()">打开新窗口</a>
<a href="javascript:window.closeNew()">关闭新窗口</a>
<a href="javascript:window.closeOwn()">关闭本窗口</a>
<script language="JavaScript">
var myWin=null;//此变量将存放open()所返回的window对象,即新窗口
function openNew(){//开启新窗口
myWin=window.open("https://www.baidu.com/?tn=97150107_hao_pg","myWin","width=200,height=200");
}
function closeNew(){
if(myWin)
myWin.close();
}
function closeOwn(){
if(window)
window.close();
else
window.open("http://xXX/practiceJS/js_%E6%89%93%E5%BC%80%E7%AA%97%E5%8F%A3.html");
}
</script>
</body>
</html>

下面开始讲解内置对象

核心对象

Number对象:可以通过Number对象建立数值类型的变量。

1
var num=new Number(123.89);
但是通常是下面的写法:
1
var x=123.89;

Number对象的讲解

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script language="JavaScript">
document.write("Number的最大值:"+Number.MAX_VALUE+"<br>最小值:"+Number.MIN_VALUE+"<br>");
document.write("返回NaN"+Number.NaN+"<br>");//数字
document.write("返回-Infinity"+Number.NEGATIVE_INFINITY+"<br>");
document.write("返回Infinity"+Number.POSITIVE_INFINITY+"<br>");
var x=new Number(123.87);
document.write(x+"转为科学计数法得到"+x.toExponential()+"<br>");//科学计数法
document.write(x+"取到小数点后面的二位"+x.toFixed()+"<br>");//取两位小数
document.write(x+"转换为字符串"+x.toString()+"<br>");//转为字符串
document.write(x+"设置为8位精确位数得到的"+x.toPrecision(8)+"<br>");//8位精度
document.write(x+"的值为"+x.valueOf()+"<br>");//值
</script>
</body>
</html>

Boolean对象:通过Boolean对象可以建立布尔类型的变量

1
var b=new Boolean(false);
同样的,通常用的是下面的这种写法:
1
var b=false;

当以第一种方法建立布尔类型的变量时,只有参数为false、0、null或undefined的时候,会得到false值,否则会得到true。

String对象:通过String对象建立字符串类型的变量。

1
var s=new String("javascript程序设计");

通常用的是下面的这种用法:

1
var s="javascript程序设计"

String对象只有一个属性length,表示字符串的长度

1、字符串可以看成是字符组成的数组,但是js中没有字符类型;

2、字符是一个个的,在别的语言中的字符用一对单引号阔起来

3、在js中可以使用单引号或者双引号

4、因为字符串可以看成数组,所以,可以通过for循环遍历

字符串特性:不可变性,字符串的值是不可以改变的

1
2
3
var str="hello";
str[1]="w";//字符串可以通过索引访问字符串中的某个值,但是,是可以访问--------读取-------只读
console.log(str);//hello
1
2
3
var str1="haha";
str1="helou";//设置-----可以改变
console.log(str1);

string—–>字符串类型——-基本类型

String——->字符串类型——-引用类型

String——>字符串对象,全局对象

String对象的属性和方法

.length——–>字符串的长度

1
2
var str1="hdeuw";
console.log(str1.length);

.charAt(索引);———> 默认索引是0,索引为0~length-1中的一个整数,超出索引,结果 是空字符串

1
2
3
var str2="dehwj";
var result=str2.charAt(3);
console.log(result);//w

String.fromCharCode(数字值);——-> 必须是String.fromCharCode(数字值可以是多个);,返回的是ASCII码对应的值

1
2
3
4
var s3=String.fromCharCode(106,65);//通过AScii码值转换的
console.log(s3);//jA
var s4=String.fromCharCode(83,79,83);
console.log(s4);//SOS

.concat(字符串1,字符串2,…);——-两个字符串组合成一个,返回的是新的字符串

1
2
3
4
var str3="where";
var result1= str3.concat("are","you","come","from");
//console.log(str3+"are"+"you"+"come"+"form");
console.log(result1);//whereareyoucomefrom

.indexOf(要找的字符串,从某个位置开始的索引);——–后面的参数可以不用,返回的是索引,找不到的话,返回-1

1
2
3
var str4="好犀利啊";
var index=str4.indexOf("啊");
console.log(index);//3

.lastIndexOf(要找的字符串);——–从后向前找,索引仍然是从前到后的,找不到的话,返回-1

1
2
3
var str5="leabd dbje";
var lastIndex=str5.lastIndexOf("b");//从后向前找,但是索引仍是像原本的一样的排序
console.log(lastIndex);//7

.replace(原来的字符串,新的字符串);——–用来替换原来的字符串

1
2
3
4
5
6
7
var str6="你哇哈哈哈哈";
if(str6.indexOf("你")!=-1){
str6=str6.replace("你","我");
}else{
console.log("不存在");
}
console.log(str6);//我哇哈哈哈哈

.slice(开始索引位置,结束字索引位置);——-截取一个字符串的一部分,—–不包含结束索引的值

1
2
3
var str7="怒诶嘿加班费我女不会问过绯闻";
str7=str7.slice(5,10);//没有“问”
console.log(str7);//费我女不会

.split(要去掉的字符串,切割后留下来的个数);————切割字符串

1
2
3
4
5
6
7
8
var str8="oiwe-kjhew-jweh";
str8=str8.split("-");
console.log(str8,",");// ["oiwe", "kjhew", "jweh"] ","
console.log(str8+",");//oiwe,kjhew,jweh,
var arr=str8.split("-");
for(var i=0;i<arr.length;i++){
console.log(arr[i]);
}

.substr(开始的位置,个数);———-返回的是截取后的新的字符串

1
2
3
var s5="哈哈,我很帅啊";
s5=s5.substr(3);
console.log(s5);//我很帅啊

.substring(开始的索引,结束的索引);———-返回截取后的字符串,不包含结束的索引的字符

1
2
3
var s6="花蛤还是个hjxafds";
s6=s6.substring(3,5);//包含索引为3,不包含索引为5的
console.log(s6);//是个

.toLocaleLowerCase();———将大写字母转为小写字母

.toLowerCase();将大写字母转为小写字母

.toLocaleUpperCase();———将小写字母转为大写字母

.toUpperCase();————将小写字母转为大写字母

1
2
3
4
var s7="HBLLLOPassaall";
//s7=s7.toLocaleLowerCase();
s7=s7.toUpperCase();
console.log(s7);

.match(str)———–> 寻找字符串str,返回值为字符串,不是索引

1
2
3
var str9="kdfsjhk";
var s9=str9.match("j");
console.log(s9);//["j", index: 4, input: "kdfsjhk", groups: undefined]

function对象:可以建立用户自定义函数

1
var f=new Function("X","Y","return (X+Y)")

通常使用的是下面的这种方法:

1
2
3
function sum(X+Y){
return (X+Y);
}

Object对象:建立用户自定义对象

1
2
3
4
var s=new Object();
s.Name="小丸子";
s.age=20;
console.log(s.Name+"你好啊!"+"芳龄是"+s.age);

Math对象:提供了和数学运算相关的属性和方法,比较特别的是当使用Math的对象的属性与方法时,并不需要new关键字建立Math对象。

Math不能实例化对象,不是构造器

Math.PI——-π

Math.E——–常数的底数,自然数E=2.718281828459045

Math.abs(值);———–求绝对值

1
2
3
4
5
6
7
8
console.log(Math.abs('-1'));
console.log(Math.abs(-2));
console.log(Math.abs(null));
console.log(Math.abs('string'));
//1
//2
// 0
//NaN

Math.ceil(值);———-向上取整

1
2
3
4
5
6
console.log(Math.ceil(12.4));//13
console.log(Math.ceil(12.9));//13
console.log(Math.ceil(12.09));//13
console.log(Math.ceil(12.04));//13
console.log(Math.ceil(12.93));//13
console.log(Math.ceil(12.98));//13

Math.floor(值);———向下取整

1
2
3
4
5
6
console.log(Math.floor(12.4));//12
console.log(Math.floor(12.9));//12
console.log(Math.floor(12.09));//12
console.log(Math.floor(12.04));//12
console.log(Math.floor(12.93));//12
console.log(Math.floor(12.98));//12

Math.fround(值);—-化为小数

1
2
3
console.log(Math.fround(2));//2
console.log(Math.fround(2.1));//2.0999999046325684
console.log(Math.fround(2.9));//2.9000000953674316

Math.max(12,90,29,20,110,11,20);———求最大值

1
console.log(Math.max(12,90,29,20,110,11,20));

Math.pow(3,2);————-求方根,多少次幂,3的2次幂

1
console.log(Math.pow(3,2));//9

Math.sqrt(4);—————-开方,如:给4开方

1
console.log(Math.sqrt(4));//2

Math.random();————–伪随机数(范围0-1)

1
console.log(parseInt(Math.random()*100)+1);//1-100之间的随机数

Math.log(num)————> 返回e为底的对数

1
2
console.log(Math.log(8));//2.0794415416798357
console.log(Math.floor(Math.log(8)));//2

Math.SQRT_2———-> 1/2的平方根

Math.SQRT2———-> 2的平方根

Date对象:提供了和日期时间运算相关的方法,只是在访问这些变量之前先使用new关键字建立Date对象。

1
2
var d=new Date();
console.log(d);

返回毫秒数

1
2
var d1=Date.now();
console.log(d1);//毫秒数,1528708844816

获得时间的各个变量的值

1
2
3
4
5
6
7
8
9
10
11
var d=new Date();
console.log("年份:"+d.getFullYear());
console.log("月份:"+(d.getMonth()+1));
console.log("日:"+d.getDate());
console.log("星期:"+d.getDay());
console.log("小时:"+d.getHours());
console.log("分钟:"+d.getMinutes());
console.log("秒:"+d.getSeconds());
//同理,也可以使用d.setFullYear(2018)
//d.setMonth(3)
//...

现在的毫秒数减去程序开始运行时毫秒数

1
2
3
4
5
6
7
8
9
10
11
12
// this example takes 2 seconds to run
var start = Date.now();
console.log("starting timer...");
// expected output: starting timer...
setTimeout(function() {
var millis = Date.now() - start;
console.log("seconds elapsed = " + Math.floor(millis/1000));
// expected output : seconds elapsed = 2
}, 2000);

时间的多种显示方法

1
2
3
4
5
6
var dt=new Date();
console.log(dt.toString());//Wed May 30 2018 19:45:25 GMT+0800 (中国标准时间)
console.log(dt.toDateString());//Wed May 30 2018
console.log(dt.toLocaleDateString());//2018/5/30
console.log(dt.toTimeString());//19:45:25 GMT+0800 (中国标准时间)
console.log(dt.toLocaleTimeString());//下午7:45:25

Array对象:

可以建立数组,数组和变量一样来存储数据的,不同的是数组虽然只有一个,但是存储的数据可以是多个。
1
2
3
4
5
6
//js数组对象是用于构造函数数组的全局对象,它是高阶,类似列表的对象.
//只要是数组就是对象
//构造函数
//var arr=new Array();
//字面量的方式
//var arr1=[];

怎么判断是不是Array对象?

1
2
3
4
5
6
7
//判断变量是不是数组类型:两种方法
//1、instanceof
var obj={};//这是一个对象,空对象,不是数组
var arr=[];
alert(arr instanceof Array);//true
//2、Array.isArray()
console.log(Array.isArray(arr));

数组存放的每个数据叫做元素。数组是如何区分它所存储的多个数据?

答:下标。(index),下标是一个数字,JavaScript默认下标是“零”代表第一个元素,下标为“1”的是第二个元素,依次类推,“n-1”则代表数组的第“n”个元素,即数组的最后一个元素。

可以使用如下语法声明一个包含5个元素的一维数组,然后分别给各个元素赋值:

1
2
3
4
5
6
var UserName=new Array(5);
UserName[0]="小丸子";
UserName[1]="小玉";
UserName[2]="美环";
UserName[3]="华子";
UserName[4]="滑轮";

或者是下面的声明方法:

1
var UserName=new Array("小丸子","小玉","美环","华子","滑轮");

另外JavaScript还允许使用如下方法声明一维数组:

1
var UserName=["小丸子","小玉","美环","华子","滑轮"];

Array.form()方法——-> 方法是类似数组或可迭代的对象中创建一个新的数组实例

1
2
3
var arr=["abc","def","ghi"];
var newArr=Array.from(arr);
console.log(newArr);//["abc", "def", "ghi"]

Array.prototype.concat()方法=———–> 将传入的数组或非数组值与原数组合并,组成一个新的数组并返回

1
2
3
4
5
var arr1=[10,30,40];
var arr2=[20,80,39];
console.log(arr1.concat(arr2));//将多个数组拼接为一个数组
//(3) ["abc", "def", "ghi"]
//(6) [10, 30, 40, 20, 80, 39]

every(函数)————->

1
2
3
//every(callback)方法测试数组的所有元素是否都通过了知道的函数测试。函数作为参数使用
//callback这里是函数,被调用的时候传入3个参数:元素值,元素的索引,原数组
//它的结果是boolean值
1
2
3
4
5
6
7
8
9
10
var arr=[1000,2000,3000];
/*
arr.every(function (a,b,c){
//console.log(arguments.length);//3
//console.log(a+"-------"+b+"--------"+c);//1000-------0--------1000,2000,3000
});*/
var flag=arr.every(function(a,b){
return a>2000;//这句话的值是:数组中的每个元素的都要大于2000,这个的结果才为true
});
console.log(flag);//false

filter(函数)—————->类似于过滤器

1
2
3
4
//filter(callback)方法:创建一个新数组,其包含通过所提供函数实现的测试的所有元素。
//里面是函数:被传入三个参数:
//1、元素的值2、元素的索引3、被遍历的数组
//结果是:返回的是数组中每一个都满足条件的元素组成一个新的数组
1
2
3
4
5
var arr=[19,20,40,30,29];
var newArr=arr.filter(function(ele){
return ele>20;
});
console.log(newArr);//[40, 30, 29]

foreach(函数)————>循环

1
2
3
//在js中只有for~in循环
//.forEach(callback)方法:callback为数组中的每个元素执行的函数,该函数接收三个参数:当前值,索引,正在操作的数组
//forEach(函数)也是遍历数组用的,相当于for循环
1
2
3
4
5
6
7
8
9
var arr=[10,20,30,40];
arr.forEach(function(ele,index){
console.log(ele+"------"+index);
//10------0
//20------1
//30------2
//40------3
});

indexOf()方法———-> 找某个元素的索引。如果找到这个元素,则返回元素的索引,否则返回-1

1
2
3
var arr=[10,30,90,30,29];
var index=arr.indexOf(30);
console.log(index);//1

join(“字符串”)————-> 将数组中的元素作为字符串输出

1
2
3
var arr=["apple","lemon","banana","orange"];
var str=arr.join("|");
console.log(str);//apple|lemon|banana|orange

map(函数)方法———————> 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的返回的结果,在把最新的结果全部放在新的数组中

1
2
3
var num=[1,4,9,10];
var str=num.map(Math.sqrt);//
console.log(str);//[1, 2, 3, 3.1622776601683795]

.reverse()方法———-> 反转数组中的元素

1
2
3
var num=[1,4,9,10];
var str=num.reverse();//
console.log(str);//[10, 9, 4, 1]

.splice(开始的索引,要删除的个数,替换元素的值)———–> 一般是用于删除数组中的元素,或者是替换元素,或者是插入元素

1
2
3
var arr=['hand','ear','mouth','foot','neck','hair'];
arr.splice(2,0,'eyes');
console.log(arr);//["hand", "ear", "eyes", "mouth", "foot", "neck", "hair"]

.slice(开始的索引,结束的索引)————->包含开始索引的值,不包含结束索引的值

1
2
3
var arr=[20,30,40,60,70,10,90,100];
var newarr=arr.slice(2,5);
console.log(newarr);//[40, 60, 70]

.sort(函数)———–>方法在适当的位置对数组进行排序,并返回数组,sort的排序不一定是稳定的,默认的排序顺序是根据字符串的unicode码点。

1
2
3
4
5
6
//sort(函数):升序.
var num=[1,4,39,10];
var str=num.sort(function(a,b){
return a-b;
});//
console.log(str);//[1, 4, 10, 39]
1
2
3
4
5
6
//sort(函数):降序.
var num=[1,4,39,10];
var str1=num.sort(function(a,b){
return b-a;
});
console.log(str1);//[39, 10, 4, 1]

添加元素和删除元素的讲解:

1
var arr=[10,20,30,40];//下面的几个方法的数组都是在这个的这个来实现的,在将来自己写代码的时候再重新写其他的

.push(值)方法:把值追加数组中。在原本的数组的元素后面增加元素

1
2
arr.push(50);//追加元素
console.log(arr);//[10, 20, 30, 40, 50]

.pop()方法:删除数组中的最后一个值,就是这个数组的最后一个值

1
2
3
var newarr=arr.pop();//删除最后一个元素
console.log(arr);//[10, 20, 30, 40]
console.log(newarr);//50

.shift()方法:删除的是数组的第一个元素,是数组的第一个元素

1
2
3
var newarr1=arr.shift();//删除第一个元素
console.log(arr);//[20, 30, 40]
console.log(newarr1);//10

.unshift()方法:向数组的第一个元素前追加一个元素,结果是数组的长度

1
2
3
var newarr2=arr.unshift(100);//给数组追加第一个元素
console.log(arr);//[100, 20, 30, 40]
console.log(newarr2);//4