JS-对象

最新推荐文章于 2024-01-31 09:20:15 发布

ImmortalSYM

最新推荐文章于 2024-01-31 09:20:15 发布

阅读量135

点赞数

分类专栏： JavaScript 文章标签： js javascript

本文链接：https://blog.csdn.net/ImmortalSYM/article/details/119837279

版权

JavaScript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

JS-对象

对象
—五种基本数据类型：String字符串、Number数值 Boolean布尔值、Null空值、Undefined未定义；

—如果看到某个数据类型不属于以上五种基本类型，则全部为对象Object；

—基本数据类型的不足：

（1）都为单一值，值与值之间无联系；

（2）如果使用基本数据类型数据，我们所创建的变量都是独立的，不是一个整体；

—对象属于一种复合数据类型，在对象中可以保存多个不同数据类型的属性；

—对象的分类：
1. 内建对象：由ES标准中定义的对象，在任何ES的实现中都可以使用；比如：String、Math、Number、Boolean、Function、Object…
2. 宿主对象：由JS运行环境提供的对象，目前来讲主要是浏览器提供的对象；比如：BOM(console) 、DOM(document)；
3. 自建（自定义）对象：由开发人员自己创建的对象；
对象的基本操作
（1）创建对象

—语法：var obj = new Object();

—使用new关键字调用的函数，是构造函数constructor；构造函数是专门用来创建对象的函数；

—使用typeof检查对象时，会返回object；

（2）添加属性

—在对象中保存的值称为属性；

—语法：对象.属性名 = 属性值;

（3）读取对象属性

—语法：对象.属性名

—如果读取对象中没有的属性，不会报错，而是返回undefined；

（4）修改对象属性值

—语法：对象.属性值 = 新属性值;

（5）删除对象属性

—语法：delete 对象.属性名;
```
<script>
	//创建对象
var obj=new Object();
//添加属性
obj.name="Tom";
obj.age=18;
//读取对象属性名
console.log(obj.name);
//删除对象的属性
delete obj.age;
</script>
```
对象的属性名和属性值
属性名

—对象的属性名不强制要求遵循标识符的规范，但是使用过程尽量按照标识符的规范；

—如果要使用特殊的对象属性名，不能采用对象.属性名的方式，需要使用另一种方式：对象[“属性名”] = 属性值；属性名传递的是字符串例如： obj["123"] = 789;；注意读取时也要按照上述方式；

—使用[]这种形式去操作属性，更加的灵活，在[]中可以直接传递一个变量，这样变量值是多少就会读取哪个属性；
```
<script>
	//创建变量
	var n = "123";
	//传递变量读取属性值，更加灵活
	console.log(obj[n]);
</script>
```
—. [] new的优先级是最高的；

—in运算符：通过该运算符可以检查一个对象中是否含有指定的属性，如果有则返回true，否则返回false；语法："属性名" in 对象
属性值

—JS对象的属性值可以是任意数据类型；甚至可以是一个对象；
```
<script>
	var obj1=new Object();
    var obj2=new Object();
    obj1.name="Tom";
    //将obj1对象设置为obj2的属性
    obj2.test=obj1;
    //读取属性值
    console.log(obj2.test.name);
    //检查obj2中是否含有属性test
    console.log("test" in obj2);
</script>
```
栈内存和堆内存

栈内存

—JS中的变量都是保存在栈内存中；

—基本数据类型的值直接在栈内存中存储；

—值与值之间是独立存在的，修改一个变量的值不会影响其他变量的值；

堆内存

—JS中的对象即引用数据类型的值直接在堆内存中存储；

—每创建一个新的对象，就会在堆内存中开辟一个新的空间，而变量值保存的是对象的内存地址（对象的引用）；

—如果两个变量保存的是同一对象的引用，当一个变量修改属性时，另一个变量也会发生变化；

—对象是通过地址进行内容修改；

—当比较两个基本数据类型的值时，就是比较两个数据类型的值，而比较两个引用数据的类型时，比较的是对象的内存地址；如果两个对象的内容是相同的，但是地址不同，两个对象是不同的；
对象字面量
—使用对象字面量创建对象；

—语法：var obj={}

—使用对象字面量，可以在创建对象时，直接指定对象中的属性，语法：var obj={属性名：属性值,属性名：属性值}

注意属性名之间用逗号隔开；

var obj = {name:"孙悟空",age:18,gender:"男"};

—对象字面量的属性名可以加引号，也可以不加，建议不加；如果要使用一些特殊的属性名必须要加引号；

—属性名和属性值是一组一组的名值对结构，名和值之间使用冒号 : 连接，多个名值对结构使用逗号, 隔开；如果一个属性之后没有其他属性就不要写逗号了；

—对象字面量中可以创建新的对象：
```
<script>
	var obj={
        name:"Tom",
        age:18,
        test:{name:"Jack"}
}
</script>
```

方法

—对象的属性值可以是任何数据类型，也可以是个函数；

—函数也可以作为对象的属性，如果一个函数对象作为一个对象的属性保存，那么我们称为这个函数是这个对象的方法，调用函数就是调用对象的方法；

—调用函数和调用方法只是名称上的区别，本质上无差别；
<script>
 //通过构造函数创建对象
	var obj=new Object();
    obj.name="Tom";
 //向对象添加函数对象作为属性，即方法
    obj.sayName = function(){
        console.log("My Name is"+obj.name);
 }
 //调用对象方法
   obj.sayName();

 //通过对象字面量创建对象
 var obj2={
     name:"Tom";
     sayHello:function(){
         console.log("My Name is"+obj2.name);
     }
 }
 //调用对象方法
 obj2.sayHello();
</script>

枚举对象的属性
—使用for in语句枚举对象中的属性

—语法：
```
for(var 变量 in 对象){
	//枚举对象的属性名
	console.log("属性名："+i);
	//枚举对象的属性值
	console.log("属性值："+obj[i]);
}
```
—for in语句，对象有几个属性，循环就会执行几次；每次执行时都会将对象中的属性名赋值给变量；

—读取对象属性值，语法：对象[变量]

工厂方法创建对象

—通过该方法可以大批量创建对象；

—使用工厂方法创建的对象，使用的构造函数都是Object，所以创建的对象都是Object这个类型，导致我们无法区分出多种不同类型的对象；

<script>
 //使用工厂方法创建对象
	function creatObj(name,age,gender){
     //创建对象
     var obj = new Object();
     //向创建的对象中添加属性
     obj.name=name;
     obj.age=age;
     obj.gender=gender;
     obj.sayName=function(){
         alert(this.name);
     };
     //返回创建的对象
     return obj;
 }
 //调用工厂方法创建对象
 var obj1 = creatObj("Tom",18,"boy");
 console.log(o);
</script>

原型对象prototype
—我们所创建的每一个函数，解析器都会向函数中添加一个属性prototype；

—prototype属性对应的一个对象就是原型对象；

—如果函数作为普通函数调用，这个prototype没有任何作用；

—当函数以构造函数调用时（创建实例），它所创建的对象中都会有一个隐含的属性指向该构造函数的原型对象；我们可以通过__proto__（两个下划线）来访问该属性；

—原型对象就相当于公共区域，所有同一个类的实例都可以访问到这个原型对象；我们可以将对象中共有的内容，统一设置到原型对象中；

—当我们访问对象的一个属性或者方法时，它会先在对象自身中寻找，如果有则直接使用，如果没有则会去原型对象中寻找，寻找到即使用；

—创建构造函数中，可以将对象中共有的属性和方法同一添加到构造函数中的原型对象中，这样不用分别为每一个对象添加，也不会影响全局作用域，就会使得每一个对象都具有这些属性和方法了；

—原型对象也是对象，它也有原型，当使用一个对象的属性或方法，先在自身中寻找自身中，如果有则直接使用，如果没有就去原型对象中寻找使用，如果原型对象中没有，则去原型对象的原型对象中寻找，直到找到Object对象的原型，Object对象的原型没有原型，如果在Object的原型中依然没有找到，就返回undefined；

—使用in检查对象中是否含有某个属性，如果对象中没有，但是原型中有，也会返回true

—可以使用对象的hasOwnProperty()方法检查对象自身中是否含有属性；传递的参数为属性名字符串；使用该方法只有对象自身中含有属性才会返回true
```
<script>
	//创建函数
function myClass(){

}
//向原型对象中添加方法
myClass.prototype.sayHello=function(){
  alert("Hello");
};
//函数指向prototype
console.log(myClass.prototype);
//调用构建函数，创建myClass实例
var mc = new myClass();
//访问实例中的prototype属性
console.log(mc.__proto__);
//实例中的prototype属性和构造函数中的属性是一样的
console.log(mc.__proto__==myClass.prototype);//返回true
</script>
```
垃圾回收

垃圾回收（GC）

—就像人生活时间长了会产生垃圾一样，程序运行过程中也会产生垃圾；

—垃圾积攒过多以后，会导致程序运行速度过慢，所以需要垃圾回收机制来处理程序运行过程中产生的垃圾；

—当一个对象没有任何的变量或属性对他进行引用，此时我么将用于无法操作该对象，此时这种对象就是一个垃圾；这种对象过会占用大量内存，导致程序运行变慢；所以必须进行垃圾清理；

—在JS中拥有自动的垃圾回收机制，会自动将垃圾对象从内存中销毁，我们不需要也不能进行垃圾回收操作；

—我们需要做的是将不在使用的对象设置为null即可；
Date对象

Date函数对象

—在JS中使用Date对象来表示一个时间；

—如果直接使用构造函数创建一个Date对象，则会封装为当前代码执行的时间；

var date = new Date();

—创建一个指定时间对象，需要在构造函数中传递一个表示时间的字符串作为参数；传递字符串日期格式：月/日/年时:分:秒

var date = new Date(08/05/2021 17:37:10);
Date对象方法
1. getDate()
  
  —获取当前日期对象是几日；
2. getDay()
—获取当前日期对象是周几；

—返回0-6之间的数值，0表示周日；
1. getMoth()
—获取当前日期对象的月份；

—返回0-11之间的数值，0表示1月，11表示12月；
1. getFullYear()
—返回当前日期对象的年份；
1. getTime()
—获取当前日期对象的时间戳；

—时间戳指的是从格林威治标准时间的1970年1月1日，0时0分0秒到当前日期所花费的毫秒数；1秒=1000毫秒；

—计算机底层在保存时间时，使用的都是时间戳
1. now()
—获取当前的时间戳；

—利用时间戳来测试代码的性能；
```
<script>	//时间戳获取代码性能    var start = Date.now();    for(var i=0;i<100;i++){        console.log(i);    }    var end = Date.now();    console.log("代码执行了"+（end-start）+"ms");</script>
```
Math

Math是一个对象，不是构造函数，它属于工具类对象，他里边封装了数学运算相关的属性和方法；

Math属性

—大写的属性都为常量，比如Math.PI表示圆周率；

Math方法

abs()

—可以用来计算一个数的绝对值；

ceil()

—可以对一个数进行向上取整；小数位只要有数值，就计1；

floor()

—可以对一个数进行向下取整；小数部分会被舍掉；

round()

—四舍五入取整，可以对一个数进行四舍五入取整；

random()

—可以用来生成一个0-1之间的随机数；生成范围为（0，1），不包含0和1；

—生成0-x之间的随机数（包含0和x），可以使用 Math.round(Math.random()*x);

—生成x-y之间的随机数，可以使用 Math.round(Math.random()*(y-x)+x);

max(x,y)

—可以获取多个数值中的最大值；

min(x,y)

—可以获取多个数值中的最小值；

pow(x,y)

—返回x的y次幂；

sqrt()

—返回数值的开方根；开方运算；
包装类

在JS中为我们提供了三个包装类，浏览器底层使用，通过包装类可以将基本数据类型临时转换为对象；
1. String()
  
  —可以将基本数据类型的字符串转换为String对象；
2. Number()
  
  —可以将基本数据类型的数值转换为Number对象；
3. Boolean()
  
  —可以将基本数据类型的布尔值转换为Boolean对象；
—如果在开发中，不会使用基本数据类型的对象，如果使用基本数据类型对象，在做一些比较时，会产生不可预期的结果（一般存储的主要是对象地址）；

—方法和属性只能添加给对象，不能添加给基本数据类型；

—当我们对一些基本数据类型的值去调用属性和方法时，浏览器会临时使用包装类将其转换为对象，然后在调用对象的属性和方法；在调用完成后，在将其转换为基本数据类型；

—因此String对象中的方法可以在基本数据类中String使用，因此他会临时转换为String对象；
```
<script>	//创建Number类型的对象    var num1 = new Number(3);    var num2 = new Number(3);    //创建String类型的对象    var str = new String("hello");    //创建Boolean类型的对象    var bool = new Boolean(ture);    //可以向对象添加属性，而基本数据类型不可以    num.name = "number";    //返回false，因为对象中存储的是堆内存地址，两个对象地址不同    console.log(num1==num2);</script>
```
String对象的相关方法

—在底层，字符串是以字符数组的形式保存的，即：["H","e","l","l","o"]

—可以通过属性length查看字符串数组的长度；
1. charAt()
  
  —可以返回字符串中指定索引位置的字符；
  
  —根据索引获取指定字符；
  
  —不会影响原数组；
2. charCodeAt()
  
  —可以返回字符串中指定索引位置的字符的Unicode编码；
3. fromCharCode()
  
  —可以根据Unicode字符编码去获取字符；
  
  —这个使用时，需要构造函数String.fromCharCode()；
4. concat()
  
  —可以连接两个或者多个字符串；
  
  —作用和+一样；
  
  —不会影响原来字符串；
5. indexOf()
  
  —该方法可以检索一个字符串中是否含有指定内容；—如果字符串中含有该内容，则会返回第一次出现的索引；
  
  —如果字符串中没有指定内容，则会返回-1；
  
  —可以指定第二个参数，指定开始查找位置的索引；
6. lastIndexOf()
  
  —该方法用法和indexOf()一样，不同的是indexOf()是从前往后找，而lastIndexOf()是从后往前找；
  
  —也可以指定开始查找的位置；
7. slice()
  
  —可以从字符串中截取指定的内容；传递两个参数，第一个参数为开始索引，第二个为结束索引；
  
  —截取时，包括开始索引位置的字符，但是不包括结束位置索引的字符；
  
  —如果省略第二个参数，则会截取后面所有的字符；
  
  —不会影响原来字符串，而是将截取的内容返回；
  
  —也可以传递一个负数作为参数，负数表示倒数位置；
8. substring()
  
  —可以用来截取一个字符串，和slice相似；
  
  —传递两个参数，第一个为开始位置索引，包括开始位置，第二个参数为结束位置索引，不包括结束位置；
  
  —不同的是，这个方法不接受负值，如果传递了一个负值，默认使用0；
  
  —而且他会自动调整参数的位置，如果第二个参数小于第一个，则自动交换参数位置；
9. substr()
  
  —也是用来截取字符串的，但是不在ES标准中；
  
  —传递参数，第一个为开始位置索引，第二个为截取的长度；
10. split()
  
  —与数组中的join()相反；
  
  —可以将一个字符串拆分为一个数组；
  
  —传递一个字符串参数，将会根据该字符串进行字符串的拆分；
  
  —如果传递一个空串""，则会将字符串中每个字符拆分为数组中的一个元素；
11. toLowerCase()
  
  —将一个字符串转换为小写并返回；
12. toUpperCase()
  
  —将一个字符串转换为大写并返回；

ImmortalSYM

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS-对象

JS-对象对象—五种基本数据类型：String字符串、Number数值 Boolean布尔值、Null空值、Undefined未定义；—如果看到某个数据类型不属于以上五种基本类型，则全部为对象Object；—基本数据类型的不足：（1）都为单一值，值与值之间无联系；（2）如果使用基本数据类型数据，我们所创建的变量都是独立的，不是一个整体；—对象属于一种复合数据类型，在对象中可以保存多个不同数据类型的属性；—对象的分类：内建对象：由ES标准中定义的对象，在任何ES的实现中都可以使用；
复制链接

扫一扫

专栏目录