JavaScript的基本语法之内置对象（六）

 

    实例对象:通过构造函数创建出来,实例化的对象
    静态对象:不需要创建,直接就是一个对象,方法(静态方法)直接通过这个对象名字调用,
    实例方法必须通过实例对象调用
    静态方法必须通过大写的对象调用

1、Math对象

Math对象不是构造函数，它具有数学常数和函数的属性和方法，都是以静态成员的方式提供，跟数学相关的运算来找Math中的成员（求绝对值，取整）

 常用的属性与方法：

Math.PI                        // 圆周率
Math.random()                // 生成随机数
Math.floor()/Math.ceil()     // 向下取整/向上取整（返回小于或等于一个给定数字的最大整数/函数返回大于或等于一个给定数字的最小整数。）
Math.round()                // 取整，四舍五入
Math.abs()                    // 绝对值
Math.max()/Math.min()         // 求最大和最小值

Math.sin()/Math.cos()         // 正弦/余弦
Math.power()/Math.sqrt()     // 求指数次幂/求平方根

    //绝对值
    console.log( Math.abs('-1'));//1
    console.log( Math.abs(-2));//2
    console.log(Math.abs(null));//---------0  重点
    console.log(Math.abs("string"));//NaN

    //向上取整 都是13
    console.log(Math.ceil(12.3));
    console.log(Math.ceil(12.9));
    console.log(Math.ceil(12.09));
    console.log(Math.ceil(12.03));
    console.log(Math.ceil(12.92));

    //向下取整  都是12
    console.log(Math.floor(12.3));
    console.log(Math.floor(12.9));
    console.log(Math.floor(12.09));
    console.log(Math.floor(12.03));
    console.log(Math.floor(12.92));

     //找一堆数字中的最大值

    console.log(Math.max(10,1,9,100,200,45,78));   //200
    console.log(Math.min(10,1,9,100,200,45,78));   //1

 最大值案例延伸：自己定义一个对象，实现系统的max方

     function MyMath() {
		this.getMax=function(){
		 var max=arguments[0];
		 for(var i=0;i<arguments.length;i++){
			if(max<arguments[i]){
			  max=arguments[i];
				}

			}
		return max;
		};
	}

		//实例对象
		var mt=new MyMath();
		var result=mt.getMax(10,50,44,55,88,96);
		console.log(result);

 

       //求指数次幂和平方根
        console.log(Math.pow(2,4));   //16
        console.log(Math.sqrt(16));   //4

随机数案例：随机产生一个十六进制的颜色值

        //封装函数
		function getColor(){
			var str="#";

		//一个十六进制值的数组
		var arr=["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
		for(i=0;i<6;i++){
			//产生的每个随机数都是一个索引，根据索引找到数组中对应的值，拼接到一起
			var num=parseInt(Math.random()*16);
			str=str+arr[num];

		   }
		   return str;
		}
        console.log(getColor());

2、Date对象

获取日期指定部分

getTime()        // 返回毫秒数和valueOf()结果一样，valueOf()内部调用的getTime()
getMilliseconds() 
getSeconds()  // 返回0-59
getMinutes()  // 返回0-59
getHours()    // 返回0-23
getDay()      // 返回星期几 0周日   6周6
getDate()     // 返回当前月的第几天
getMonth()    // 返回月份，***从0开始***需+1
getFullYear() //返回4位的年份  如 2019

案例：获取当前日期

            //获取当前日期
		function getDate(dt) {
			//获取年
			var year=dt.getFullYear();

			//获取月
			var month=dt.getMonth()+1;//月份是从0开始的

			//获取日
			var day=dt.getDate();


			//获取小时

			var hour=dt.getHours();

			//获取分钟
			var min=dt.getMinutes();


			//获取秒
			var sec=dt.getSeconds();
			month=month<10?"0"+month:month;
			day=day<10?"0"+day:day;
			hour=hour<10?"0"+hour:hour;
			min=min<10?"0"+min:min;
			sec=sec<10?"0"+sec:sec;
			return year+"年"+month+"月"+day+"日"+hour+":"+min+":"+sec;
			
		}
		var dt=new Date();
		console.log(getDate(dt) );

 

3、Array对象

创建数组对象的两种方式

• 字面量方式

• new Array()

 1. 使用字面量创建数组对象

var arr = [1, 2, 3];

 

 2. 使用构造函数创建数组对象

// 创建了一个空数组
var arr = new Array();
// 创建了一个数组，里面存放了3个字符串
var arr = new Array('zs', 'ls', 'ww');
// 创建了一个数组，里面存放了4个数字
var arr = new Array(1, 2, 3, 4);

检测一个对象是否是数组

• instanceof

• Array.isArray() HTML5中提供的方法，有兼容性问题

函数的参数，如果要求是一个数组的话，可以用这种方式来进行判断

 var obj=[];
 console.log(obj instanceof Array);//ture

 var obj=[];
 console.log(Array.isArray(obj));

数组常用方法

 1 栈操作(先进后出)
     .push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度

var arr=[20,25,35,45];
var resule=arr.push(50);
console.log(resule);
console.log(arr);

     .pop();--->删除数组中最后一个元素,返回值就是删除的这个值

 var arr=[45,88,55,24,66];
 var result=arr.pop();
 console.log(result);
 console.log(arr);

 2 队列操作(先进先出)
    .shift();--->删除数组中第一个元素,返回值就是删除的这个值

var arr=[45,88,55,24,66];
var result=arr.shift();
console.log(result);
console.log(arr);

    .unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的长度

 var arr=[10,20,30,40,50];
 var result=arr.unshift(100);
 console.log(result);
 console.log(arr);

 3 排序方法
    .reverse();----->反转数组

var arr=[10,20,30,40,50];
arr.reverse();//反转
console.log(arr);

    .sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码

var arr=[1,40,20,10,100];
  //a---arr[j]
  //b---arr[j+1]
 arr.sort(function (a,b) {
	if(a>b){
	 return 1;
   }else if(a==b){
     return 0;
     }else{
     return -1;
	  }
   });
 console.log(arr)

// 带参数的sort是如何实现的？
 4 操作方法
    .concat(数组,数组,数组,...) 组合一个新的数组

  var arr1=[10,20,30];
  var arr2=[40,50,60];
  var arr3=[70,80,90];
  console.log(arr1.concat(arr2,arr3));

    .slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值

 var arr=[10,20,30,40,50,60,70,80,90,100];
 var newArr= arr.slice(3,7);
 console.log(newArr);

    .splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素

     var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
     myFish.splice(2, 0, 'drum'); // 在索引为2的位置插入0个元素，插入'drum'
	   // myFish 变为 ["angel", "clown", "drum", "mandarin", "sturgeon"]
     myFish.splice(2, 1); // 从索引为2的位置删除1个元素（也就是'drum'这一项）
     console.log(myFish);
	   // myFish 变为 ["angel", "clown", "mandarin", "sturgeon"]

 5 位置方法
   .indexOf(元素值);返回的是索引,没有则是-1  

 var arr=[10,20,30,40];
 var index=arr.indexOf(30);
 console.log(index);

 

 6 迭代方法 不会修改原数组(可选)
   .every(函数)--返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值，第二个参数是索引值,第三个参数是原来的数组(没用)

  var arr=[1000,2000,3000];
  //a----: 元素的值
  //b----: 索引的值
  //c----:谁调用了这个方法,那么c就是谁---->arr
  var flag= arr.every(function (a,b,c) {
  console.log(a+"==="+b+"===="+c);
  return a>500;//数组中的每个元素的值都要大于2000的情况,最后才返回true
 });

 var arr=["小明明lkko","小曹操674","小白白bd","笑眯眯a"];
 var flag=arr.every(function (ele,index) {
   //数组中的每个元素的长度是不是大于4
  return ele.length>4;
	  });
 console.log(flag); 

   .filter(函数);返回的是数组中每一个元素都符合条件的元素,组成了一个新的数组

 var arr=[10,20,30,40,50,60,70,80];
 var newArr=arr.filter(function (ele) {//ele---每个元素
   return ele>40;
 });
   console.log(newArr);

 var arr=[10,0,20,0,40,0,60,100];
 var newArr=arr.filter(function (ele) {
	 return ele!=0;
  });
	 onsole.log(newArr)

   .forEach(函数)方法---遍历数组用---相当于for循环

 var arr = [10, 20, 30, 40];
 arr.forEach(function (ele,index) {
  console.log(ele+'======'+index);
 });

   .map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中

 var numbers = [1, 4, 9];
 var roots = numbers.map(Math.sqrt);
 console.log(roots);

   .some(element,index,array,thisArg)--->测试是否至少有一个元素可以通过被提供的函数方法。该方法返回一个Boolean类型的值。

function isBiggerThan10(element, index, array) {
  return element > 10;
}

[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true

 7 方法将数组的所有元素连接到一个字符串中。
   .join("字符串");----返回的是一个字符串

var arr=["小白","小黑","小红","小芳","小绿","小苏"];
var str=arr.join("|");
console.log(str);

• 清空数组

// 方式1 推荐 
arr = [];
// 方式2 
arr.length = 0;
// 方式3
arr.splice(0, arr.length);

4、String对象

 String---->是一个对象
 字符串可以看成是字符组成的数组,但是js中没有字符类型
 字符是一个一个的,在别的语言中字符用一对单引号括起来
 在js中字符串可以使用单引号也可以使用双引号
 因为字符串可以看成是数组,所以,可以通过for循环进行遍历

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

 字符串的值之所以看起来是改变的,那是因为指向改变了,并不是真的值改变了

var str = 'abc';
str = 'hello';
// 当重新给str赋值的时候，常量'abc'不会被修改，依然在内存中
// 重新给字符串赋值，会重新在内存中开辟空间，这个特点就是字符串的不可变
// 由于字符串的不可变，在大量拼接字符串的时候会有效率问题

1 、字符方法
  .charAt(索引),  返回值是指定索引位置的字符串,超出索引,结果是空字符串

var str="whatareyounoshalei";
var result=str.charAt(10);
console.log(result);

2 、字符串操作方法
   .concat(字符串1,字符串2,...);  返回的是拼接之后的新的字符串

 var str="我";
 console.log(str.concat("喜欢","喝","哇哈哈"));

   .slice(开始的索引,结束的索引);  不包含结束的索引

//从索引5的位置开始提取,到索引为11的前一个结束,没有11，并返回这个提取后的字符串

		var str = "我说过我最喜欢喝哇哈哈了";
	   	str = str.slice(5, 11);
	   	console.log(str);

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

var str = "我说过我最喜欢喝哇哈哈了";
str = str.substring(0, 5);
console.log(str);

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

var str = "我说过我最喜欢喝哇哈哈了";
str = str.substr(0, 6);
console.log(str);

 3、 位置方法
   .indexOf(要找的字符串,从某个位置开始的索引);   返回的是这个字符串的索引值,没找到则返回-1

  var str="我真的好喜欢喝娃哈哈啊";
  var index=str.indexOf("好",3);
  console.log(index);

  .lastIndexOf(要找的字符串);从后向前找,但是索引仍然是从左向右的方式,找不到则返回-1，只找第一个匹配的

var str="我真的好喜欢喝娃哈好哈啊";
var index=str.lastIndexOf("好");
console.log(index);

 4 、去除空白   
    .trim();干掉字符串两端的空格

var str="     哇哈哈     "
str=str.trim();
console.log("=="+str+"==");

5、 大小写转换方法
    to(Locale)UpperCase()     //转换大写

var str="i like drink wa haha"
str=str.toUpperCase();
console.log(str);

    to(Locale)LowerCase()     //转换小写

  var str="I LIKE DRINK WA HAHA"
  str=str.toLowerCase();
  console.log(str);

6 、其它
    .replace("原来的字符串","新的字符串");   用来替换字符串的

var str="哇哈哈很好喝，我喜欢";
if (str.indexOf("哇哈哈")!=-1) {//先找到这个字符串的索引值再进行替换
	str=str.replace("哇哈哈","爽歪歪");
} else {
   console.log("不存在")
}
   console.log(str);

    .split("要干掉的字符串",切割后留下的个数);   切割字符串

 var str="乔峰|慕容|凤姐|梅超风|小苏|大蛇丸";
 var arr=str.split("|");
 for(var i=0;i<arr.length;i++){
	 console.log(arr[i]);
  }

    .fromCharCode(数字值,可以是多个参数),   返回的是ASCII码对应的值

 var str=String.fromCharCode(107,108,109);
 console.log(str);

案例1：截取出哇哈哈三个字

var str="哇哈哈很好喝，我每天都要喝";
   var key="哇哈哈";
//先获取要截取字符串索引的位置
  var index=str.indexOf(key);
//从指定的地方开始截取，截取三个即可
  str=str.substr(index,3);
  console.log(str);

案例2：找到这个字符串中y出现的位置

var str="my name is yang yu ying";
  var index=0  //开始的位置
  var key="y"  //要找的字符串
  while((index=str.indexOf(key,index))!=-1){
	console.log(index);
	index=index+key.length;
}

案例3：找到字符串中的每个字符串出现了多少次

var str="kWdsTyrvHurghFShgdfghfhasUyeu";
		//第一步：统一格式（大写/小写）
		str=str.toLocaleLowerCase();
		//第二步：创建一个新对象。目的：把字母作为键，次数作为值传入
		var obj={};
		//第三步:遍历字符串，获取每个字母
		for(i=0;i<str.length;i++){
			//判断obj这个对象有没有这个字母（字母---键）
			var key=str[i];//每个字母
			if(obj[key]){//判断obj中有没有这个键
				//对象中有这个字母了
				obj[key]++;
			}else{
				//对象中没有这个字母，那就把字母加到对象中，并且给这个字母一个出现的次数，默认为1
				obj[key]=1;
			}
		}
		//遍历对象
		for(var key in obj){
			console.log(key+"这个字母出现了"+obj[key]+"次");

		}