JavaScript对象

1 .对象的概念

在JavaScript中,对象属于复杂数据类型,

                    它是由属性和方法组成的一个对象。

                    属性是指对象的特征。

                    方法是指对象的行为。

                    下面以学生的特征和行为为例进行说明。

                    学生的特征:姓名、年龄和性别,这些特征可以用对象的属性来表示。

                    学生的行为:打招呼、唱歌、写作业,这些行为可以用对象的方法来表示。

                    //将10个学生的成绩输出在页面上。

var arr  = [1,2,32,543,65,35,35,654,46,31];
				for(var i = 0 ;i<arr.length;i++){
					if(i==arr.length-1){
						document.write(arr[i] );
					}else{
						document.write(arr[i] + ',');
					}
				}
				
				document.write("<hr>");

  将10个学生的全部信息(id  name  age  sex)输出在页面上。

  传统的思路:定义40个变量 或者4个数组 或者二维数组等等

  按照对象的思想:10个学生理解10个对象  将10个对象放在一个数组里面即可

var s1 = {id:1001,name:"张三1" , age:18};
			  var s2 = {id:1002,name:"张三2" , age:18};
			  var s3 = {id:1003,name:"张三3" , age:18};
			  var s4 = {id:1004,name:"张三4" , age:18};
			  var s5 = {id:1005,name:"张三5" , age:18};
			  var s6 = {id:1006,name:"张三76" , age:18};
			  var s7 = {id:1007,name:"张三7" , age:18};
			  var s8 = {id:1008,name:"张三8" , age:18};
			  var s9 = {id:1008,name:"张三9" , age:18};
			  var s10 = {
				  id :10010,
				  name:"张三",
				  age:20,
			  };
			  
			  var arr = [s1,s2,s3,s4,s5,s6,s7,s8,s9,s10];
			  // for(var i = 0 ;i<arr.length;i++){
			  // 	if(i==arr.length-1){
			  // 		document.write(arr[i] );
			  // 	}else{
			  // 		document.write(arr[i] + ',');
			  // 	}
			  // }
			  //注意:上述写法 打印的仅仅是外观的Object而非内部的属性。
			  // for(var i = 0 ;i<arr.length;i++){
			  // 	if(i==arr.length-1){
			  // 		document.write(arr[i].id + arr[i].name + arr[i].age +"<br>");
			  // 	}else{
			  // 		document.write(arr[i].id + arr[i].name + arr[i].age +"<br>");
			  // 	}
			  // }
			  //以上写法较为麻烦
			  
			  for(var i = 0 ;i<arr.length;i++){
				  for(var sx in arr[i]){
					  document.write(arr[i][sx]);
				  }
				  document.write("<br>")
			  }
2.创建对象

判断一个变量是否为对象的小技巧:通过console.log打印.

如果打印的是一行字符串 就说明是基本数据类型

如果打印的是一个可以折叠的数据 就表示对象

var a = 11;

 console.log(a);

 var arr = [1,2,3,4];

  console.log(arr);

如何创建一个JS的对象:

方法1:使用对象的字面量创建对象(理解为直接赋值)

例如:var arr = [1,2,3];,//静态声明数组 字面量创建

 就是用大括号“{}”来标注对象成员,

每个对象成员使用键值对的形式保存,即 “key: value”的形式。

 多个成员通过逗号隔开

 键指的就是独一无二的属性  

 var student1 = { 'id' :1001 ,name:"张三" , age : 18 , 'sex-sex' : '男' } ;

          // //其中键可以选择性的加引号

          // console.log(student1);

          // //如何访问对象里面的值的方法1:  通过对象名.属性名即可

          // console.log(student1.id + "~" + student1.name + "~" + student1.age );

          // //如果存在一些命名不规范的变量 无法通过对象名.属性名访问

          // // console.log(student1.sex-sex);这行代码是报错的

          // //访问对象里面的值的方法2:通过对象名[属性名]

          // console.log(student1['sex-sex']);

          // console.log(student1['name']);

           

 创建对象的补充:如果一开始只知道有对象,但是不知道它有什么属性或属性值,

  那么可以先创建一个空对象壳子

  var s123 = {};

  后续再声明属性的同时进行赋值

 s123.id = 123;

 s123.name = "Lisi";

 s123.age = "男";

 console.log(s123.id);//123

  console.log(s123.dasd);//undefined

           

创建对象的方法2:

第一步:创建对象的函数(想象成Java的构造函数)       

function Person(id,name,age){

             this.id = id;
            this.name = name;

           this.age = age;

    }

  第二步:new对象         

var p1 = new Person(123,"王五" , 20);

    console.log(p1);

     //使用场景:如果对象很多 就用方法2   反之方法1

  补充:对象由:属性和方法       

    var s1 = {

               id :11,

                name:"张三",

                age :18,

                study : function(){

                    alert("成功调用了这个对象的这个方法");

                }

            };

           

           alert(s1.id);

           s1.study();
  3.如何遍历一个对象 
<script>
			
			// var arr = [1,2,4,3];
			// console.log(arr);
			
			var s10 = {
							  id :10010,
							  name:"张三",
							  age:20,
							  sex:'男',
							  height : 188,
							  weight :200
			};
			// console.log(s10);
			
			//由于直接输出s10将只会显示object我们需要内部的属性值/
			//方法1:如果只需要某一个属性值, 直接通过s10.属性名即可
			//方法2:如果所有的属性值都需要,那么也可以通过s10.属性名 只是比较麻烦.
			//学习:如何遍历对象:语法如下:
			// for(var i = 0;i<a10.length;i++){
			// 	//错误的写法:1.对象的键并不是012  其次对象并没有长度
			// }
			
			//i表示对象的下标(属性)    s10表示遍历的对象 
			for(var i  in s10){
				console.log(s10[i]);
			}
			
			
			
			
			
		</script>
 4,值对象和引用对象
<script>
			//JS的参数传递 也分为值传递和引用传递
			var a = 111;
			var b = "你好";
			var c = true;
			var d = [1,2,3];
			
			function change(a,b,c,d){
				a = 222;
				b = "我好";
				c = false;
				d[0] = 123;
			}
			
			change(a,b,c,d);
			
			console.log(a);//111
			console.log(b);//你好
			console.log(c);//true
			console.log(d[0]);//123
			
			
		</script>
		
5,Math对象

 Math对象的用法和Java中Math对象的用法几乎一致。

 唯一不同的就是 Java的数据类型分为int double等  但是js里面只有number

 第一个  Math.min(a,b,c,d,...);获取最小的值

alert(Math.min(2,534,32,43,76,86));

 第二个  Math.max(a,b,c,d,...);//获取最大值

  alert(Math.min(2,534,32,43,76,86));

  第三个:Math.ceil(a); 向上取整 舍去小数点   (但是Java是保留的)

  alert(Math.ceil(11.1));

  第四个:Math.floor(a); 向下取整 舍去小数点   (但是Java是保留的)

  alert(Math.floor(11.1));

    第五个 Math.round(x);四舍五入  如果是临界值都是往高的入

    alert(Math.round(1.5) + "~" + Math.round(-1.5));

      第六个:Math.random();返回一个随机数  范围  0~1  官方概念:可以取0但是不能取1  但是实             际场景可以忽略0

      alert(Math.random()); 

6.date对象

区分date表示日期和data表示数据

date对象创建的2种方式:

 第一种 不放任何参数  表示获取当前时间

  var d = new Date();

  console.log(d);

  第二种方式:放若干个数字,分别表示年月日 时分秒   按照顺序  其中月份比较特殊 0表示1月

   var d = new Date(2020,11,11);表示2020年12月11日 0点0分0秒

   date对象的常见方法:

            

 var d = new Date(2020,11,11,12,6,33);;//表示2020年12月11日 0点0分0秒

            console.log(d.getFullYear());//获取年份

            console.log(d.getMonth() + 1);//获取月份  注意0表示1

            console.log(d.getDate());//获取日期

            console.log(d.getHours());//获取小时

            console.log(d.getMinutes() );//获取分钟

            console.log(d.getSeconds() );//获取秒

           

            console.log(d.toLocaleString());//返回当前日期的字符串格式

           

           

            console.log(d.getTime());//返回从1970年1月1日0时0分0秒  到指定时刻的毫秒数
7.倒计时

计算当前时刻距离2024年1月1日0时 还差多少时间

<script>
			
			var d1 = new Date();
			var d2 = new Date(2024,0,1);
			
			var sjc = d2.getTime() - d1.getTime(); //计算出两个时间节点的相差毫秒数
			
			sjc = parseInt(sjc / 1000);//得到是  两者的秒数
			
			var s = sjc%60;
			
			var m = parseInt(sjc/60%60); 
			
			var h =  parseInt(sjc/60/60%24); 
			
			var day = parseInt(sjc/60/60/24);
			
			document.write("距离倒计时还剩下" + day +"天  " + h +"时" + m +"分" + s + "秒");
			
	
			
</script>

8.array对象

<script>
			
			
			//array对象 之前学过一遍了。
			// var arr = [];
			// arr.push("aa");//表示奖元素添加到数组的尾部
			// console.log(arr);
			
			
			// var arr = ['张三','分','阿萨德三','类似'];
			// var str  =arr.toString();//默认以,分割
			// console.log(str);
			// var str = arr.join(":");
			// console.log(str);
			
			//适用常见:  用户选择自己的爱好框  
			
			
			
			//数组的去重:
			var arr = [12,543,654,,432,12,3,342,53,543,6,546,54,675,756,7,3,5,3456,46,54,654,756,42,34,234,23];
			// //要求数组中重复的数字去掉.
			console.log(arr.length + "这是原有的长度");
			var newArr = [];
			
			for(var i = 0 ;i<arr.length;i++){
				if(newArr.indexOf(arr[i]) == -1){
					newArr.push(arr[i]);
				}
			}
			console.log(newArr);
			
			
			
			
		</script>

9.string对象

<script>
			//JS中的String对象的方法和Java几乎完全一致.
			// 判断输入的账号是否合法
			// 要求:长度8-18位。必须以yyzy开头。账号的最后6位必须是纯数字组成。
			var str = "yyzysaf111111";
			// console.log(str.substring(str.length-6,str.length));
			
			//  console.log(Number(str.substring(str.length-6,str.length))) ;
			
			var b = panduan(str);
			alert(b);
			
			function panduan(str){
				if(  !(str.length>=8 && str.length<=18) ){
					alert("长度不符合条件");
					return false;
				}
				
				if( ! str.startsWith("yyzy") ){
					alert("不是以yyzy开头");
					return false;
				}
				
				
				//思路:如何判断后6位是否为纯数字
				//步骤1: 取出后6位  思路 通过subString(a,b);截取
				//其中b是定死了 就是str.length   其中a=str.length-6
				
				if(Number(str.substring(str.length-6,str.length))+"" =="NaN"){
					alert("后6位不是纯数字");
					return false;
				}
				return true;
			}
			
				
		</script>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值