【JS】07 JS对象
所有事物都是对象
JavaScript 提供多个内建对象,比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。
- 布尔型可以是一个对象。
- 数字型可以是一个对象。
- 字符串也可以是一个对象
- 日期是一个对象
- 数学和正则表达式也是对象
- 数组是一个对象
- 甚至函数也可以是对象
对象只是一种特殊的数据。对象拥有属性和方法。
访问对象属性的语法是:
objectName.propertyName
方法是能够在对象上执行的动作
objectName.methodName()
自定义对象:
类似JavaOOP一开始的写法:
person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue";
但是JS支持这种K&V键值写法:
person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
使用函数对象构造
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
函数对象装函数对象
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor; this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}
JavaScript 类 ?
JavaScript 是面向对象的语言,但 JavaScript 不使用类。
在 JavaScript 中,不会创建类,也不会通过类来创建对象(就像在其他面向对象的语言中那样)。
JavaScript 基于 prototype,而不是基于类的。
FOR IN 遍历JS对象的属性 ?
for (variable in object)
{
执行的代码……
}
1、prototype(原型对象)
所有的 JavaScript 对象都会从一个 prototype(原型对象)中继承属性和方法。
Date
对象从Date.prototype
继承。Array
对象从Array.prototype
继承。Person
对象从Person.prototype
继承。
所有 JavaScript 中的对象都是位于原型链顶端的 Object 的实例。
JavaScript 对象有一个指向一个原型对象的链。
当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,
直到找到一个名字匹配的属性或到达原型链的末尾。
Date
对象, Array
对象, 以及 Person
对象从 Object.prototype
继承。
添加属性和方法
有的时候我们想要在所有已经存在的对象添加新的属性或方法。
另外,有时候我们想要在对象的构造函数中添加属性或方法。
使用 prototype 属性就可以给对象的构造函数添加新的属性:
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
} Person.prototype.nationality = "English";
2、Number 对象
所有 JavaScript 数字均为 64 位
JavaScript 不是类型语言。与许多其他编程语言不同,JavaScript 不定义不同类型的数字,比如整数、短、长、浮点等等。
在JavaScript中,数字不分为整数类型和浮点型类型,所有的数字都是由 浮点型类型。
JavaScript 采用 IEEE754 标准定义的 64 位浮点格式表示数字,它能表示最大值为 ±1.7976931348623157e+308,最小值为 ±5e-324。
可以使用 toString() 方法 输出16进制、8进制、2进制。
var myNumber=128;
myNumber.toString(16); // 返回 80
myNumber.toString(8); // 返回 200
myNumber.toString(2); // 返回 10000000
无穷大(Infinity)
当数字运算结果超过了JavaScript所能表示的数字上限(溢出),结果为一个特殊的无穷大(infinity)值,在JavaScript中以Infinity表示。
同样地,当负数的值超过了JavaScript所能表示的负数范围,结果为负无穷大,在JavaScript中以-Infinity表示。
无穷大值的行为特性和我们所期望的是一致的:
基于它们的加、减、乘和除运算结果还是无穷大(当然还保留它们的正负号)。
myNumber=2;
while (myNumber!=Infinity)
{
myNumber=myNumber*myNumber; // 重复计算直到 myNumber 等于 Infinity
}
NaN【Not a Number】 - 非数字值
NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值,来指示其不是数字值。
你可以使用 isNaN() 全局函数来判断一个值是否是 NaN 值。
var x = 1000 / "Apple";
isNaN(x); // 返回 true
var y = 100 / "1000";
isNaN(y); // 返回 false
可以是数字或者对象
数字可以私有数据进行初始化,就像 x = 123;
JavaScript 数字对象初始化数据, var y = new Number(123);
var x = 123;
var y = new Number(123);
typeof(x) // 返回 Number
typeof(y) // 返回 Object
但是数字和Number对象类型判断不会一致
var x = 123;
var y = new Number(123);
(x === y) // 为 false,因为 x 是一个数字,y 是一个对象
Number对象具有的一些属性
Number.MAX_VALUE | 最大值 |
Number.MIN_VALUE | 最小值 |
Number.NaN | 非数字 |
Number.NEGATIVE_INFINITY | 负无穷,在溢出时返回 |
Number.POSITIVE_INFINITY | 正无穷,在溢出时返回 |
Number.EPSILON |
表示 1 和比最接近 1 且大于 1 的最小 Number 之间的差别 |
Number.MIN_SAFE_INTEGER | 最小安全整数。 |
Number.MAX_SAFE_INTEGER | 最大安全整数。 |
Number对象具有的一些方法
Number.parseFloat() | 将字符串转换成浮点数,和全局方法 parseFloat() 作用一致。 |
Number.parseInt() |
将字符串转换成整型数字,和全局方法 parseInt() 作用一致。 |
Number.isFinite() | 判断传递的参数是否为有限数字。 |
Number.isInteger() | 判断传递的参数是否为整数。 |
Number.isNaN() | 判断传递的参数是否为 isNaN()。 |
Number.isSafeInteger() | 判断传递的参数是否为安全整数。 |
Number对象所属原型的一些方法
toExponential() | 返回一个数字的指数形式的字符串,如:1.23e+2 |
toFixed() |
返回指定小数位数的表示形式。 var a=123; |
toPrecision() |
返回一个指定精度的数字。如下例子中,a=123 中,3会由于精度限制消失: var a=123; |
3、字符串(String) 对象
允许单引号或者双引号表示字符串
var carname="Volvo XC60";
var carname='Volvo XC60';
使用位置(索引)可以访问字符串中任何的字符
索引从零开始, 所以字符串第一字符为 [0],第二个字符为 [1], 等等
var character=carname[7];
单双引号的嵌套使用:
var answer="It's alright";
var answer="He is called 'Johnny'";
var answer='He is called "Johnny"';
或者使用转义
var answer='It\'s alright';
var answer="He is called \"Johnny\"";
length属性
用于获取字符串的长度,也就是字符个数
var txt="Hello World!";
document.write(txt.length); var txt="ABCDEFGHIJKLMNOPQRSTUVWXYZ";
document.write(txt.length);
查找参数字符串在此String对象中的首个字符首次出现的位置
小提示:只要结果是大于-1的就表示存在,字符可能在开头就会出现,而开头就返回0,首个位置
var str="Hello world, welcome to the universe.";
var n=str.indexOf("welcome");
查找指定的字符串
match()函数用来查找字符串中特定的字符,并且如果找到的话,则返回这个字符。
var str="Hello world!";
document.write(str.match("world") + "<br>");
document.write(str.match("World") + "<br>");
document.write(str.match("world!"));
替换字符串中的内容
replace() 方法在字符串中用某些字符替换另一些字符。
str="Please visit Microsoft!"
var n=str.replace("Microsoft","Runoob");
全大小写转换
字符串大小写转换使用函数 toUpperCase() / toLowerCase():
var txt="Hello World!"; // String
var txt1=txt.toUpperCase(); // txt1 文本会转换为大写
var txt2=txt.toLowerCase(); // txt2 文本会转换为小写
按照指定的符号对字符串分割,返回一个字符串数组
字符串使用split()函数转为数组:
txt="a,b,c,d,e" // String
txt.split(","); // 使用逗号分隔
txt.split(" "); // 使用空格分隔
txt.split("|"); // 使用竖线分隔
String对象详细见Runoob描述:
https://www.runoob.com/jsref/jsref-obj-string.html
4、Date(日期) 对象
创建日期对象:
new Date() // 当前日期和时间
new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)
示例:
var today = new Date()
var d1 = new Date("October 13, 1975 11:13:00")
var d2 = new Date(79,5,24)
var d3 = new Date(79,5,24,11,33,0)
对日期对象设置一个指定的时间:
var myDate=new Date();
myDate.setFullYear(2010,0,14);
对日期的比较:
var x=new Date();
x.setFullYear(2100,0,14);
var today = new Date(); if (x>today)
{
alert("今天是2100年1月14日之前");
}
else
{
alert("今天是2100年1月14日之后");
}
5、Array(数组) 对象
用于存储一些列的值
创建数组:
1: 常规方式:
var myCars=new Array();
myCars[0]="Saab";
myCars[1]="Volvo";
myCars[2]="BMW";
2: 简洁方式:
var myCars=new Array("Saab","Volvo","BMW");
3: 字面:
var myCars=["Saab","Volvo","BMW"];
访问数组元素:
以下实例可以访问myCars数组的第一个值:
var name=myCars[0];
以下实例修改了数组 myCars 的第一个元素:
myCars[0]="Opel";
数组支持存放一切对象【数组,函数,对象】
所有的JavaScript变量都是对象。数组元素是对象。函数是对象。
因此,你可以在数组中有不同的变量类型。
你可以在一个数组中包含对象元素、函数、数组:
myArray[0]=Date.now;
myArray[1]=myFunction;
myArray[2]=myCars;
一些属性和方法:
var x=myCars.length // myCars 中元素的数量
var y=myCars.indexOf("Volvo") // "Volvo" 值的索引值
concat() | 连接两个或更多的数组,并返回结果。 |
copyWithin() | 从数组的指定位置拷贝元素到数组的另一个指定位置中。 |
entries() | 返回数组的可迭代对象。 |
every() | 检测数值元素的每个元素是否都符合条件。 |
fill() | 使用一个固定值来填充数组。 |
filter() | 检测数值元素,并返回符合条件所有元素的数组。 |
find() | 返回符合传入测试(函数)条件的数组元素。 |
findIndex() | 返回符合传入测试(函数)条件的数组元素索引。 |
forEach() | 数组每个元素都执行一次回调函数。 |
from() | 通过给定的对象中创建一个数组。 |
includes() | 判断一个数组是否包含一个指定的值。 |
indexOf() | 搜索数组中的元素,并返回它所在的位置。 |
isArray() | 判断对象是否为数组。 |
join() | 把数组的所有元素放入一个字符串。 |
keys() | 返回数组的可迭代对象,包含原始数组的键(key)。 |
lastIndexOf() | 搜索数组中的元素,并返回它最后出现的位置。 |
map() | 通过指定函数处理数组的每个元素,并返回处理后的数组。 |
pop() | 删除数组的最后一个元素并返回删除的元素。 |
push() | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reduce() | 将数组元素计算为一个值(从左到右)。 |
reduceRight() | 将数组元素计算为一个值(从右到左)。 |
reverse() | 反转数组的元素顺序。 |
shift() | 删除并返回数组的第一个元素。 |
slice() | 选取数组的的一部分,并返回一个新数组。 |
some() | 检测数组元素中是否有元素符合指定条件。 |
sort() | 对数组的元素进行排序。 |
splice() | 从数组中添加或删除元素。 |
toString() | 把数组转换为字符串,并返回结果。 |
unshift() | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() | 返回数组对象的原始值。 |
6、Boolean(布尔) 对象
用于将非布尔值转换为布尔值(true 或者 false)
toString() | 把布尔值转换为字符串,并返回结果。 |
valueOf() | 返回 Boolean 对象的原始值。 |
下面的代码定义了一个名为 myBoolean 的布尔对象:
var myBoolean=new Boolean();
如果布尔对象无初始值或者其值为:
0
-0
null
""
false
undefined
NaN
那么对象的值为 false。
否则,其值为 true(即使当变量值为字符串 "false" 时)!
7、Math(算数) 对象
类似Java的Math类,不过按JS这里就是说成Math对象
abs(x) | 返回 x 的绝对值。 |
acos(x) | 返回 x 的反余弦值。 |
asin(x) | 返回 x 的反正弦值。 |
atan(x) | 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。 |
atan2(y,x) | 返回从 x 轴到点 (x,y) 的角度(介于 -PI/2 与 PI/2 弧度之间)。 |
ceil(x) | 对数进行上舍入。 |
cos(x) | 返回数的余弦。 |
exp(x) | 返回 Ex 的指数。 |
floor(x) | 对 x 进行下舍入。 |
log(x) | 返回数的自然对数(底为e)。 |
max(x,y,z,...,n) | 返回 x,y,z,...,n 中的最高值。 |
min(x,y,z,...,n) | 返回 x,y,z,...,n中的最低值。 |
pow(x,y) | 返回 x 的 y 次幂。 |
random() | 返回 0 ~ 1 之间的随机数。 |
round(x) | 四舍五入。 |
sin(x) | 返回数的正弦。 |
sqrt(x) | 返回数的平方根。 |
tan(x) | 返回角的正切。 |
【JS】07 JS对象的更多相关文章
- 程序猿都没对象,JS竟然有对象?
现在做项目基本是套用框架,不论是网上的前端还是后端框架,也会寻找一些封装好的插件拿来即用,但还是希望拿来时最好自己过后再回过头了解里面的原理,学习里面优秀的东西,不论代码封装性,还是小到命名. 好吧, ...
- js中判断对象具体类型
大家可能知道js中判断对象类型可以用typeof来判断.看下面的情况 <script> alert(typeof 1);//number alert(typeof "2" ...
- 浅解析js中的对象
浅解析js中的对象 原文网址:http://www.cnblogs.com/foodoir/p/5971686.html,转载请注明出处. 前面的话: 说到对象,我首先想到的是每到过年过节见长辈的时候 ...
- js中XMLHttpRequest对象实现GET、POST异步传输
js中XMLHttpRequest对象实现GET.POST异步传输 /* * 统一XHR接口 */ function createXHR() { // IE7+,Firefox, Opera, Chr ...
- 170104、js内置对象与原生对象
内置对象与原生对象 内置(Build-in)对象与原生(Naitve)对象的区别在于:前者总是在引擎初始化阶段就被创建好的对象,是后者的一个子集:而后者包括了一些在运行过程中动态创建的对象. 原生对象 ...
- (转)JS获取当前对象大小以及屏幕分辨率等
原文 JS获取当前对象大小以及屏幕分辨率等 <script type="text/javascript">function getInfo(){ var ...
- JavaScript基础17——js的Date对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JavaScript基础18——js的Array对象
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JavaScript学习12 JS中定义对象的几种方式
JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...
- JS获取当前对象大小以及屏幕分辨率等...
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta nam ...
随机推荐
- 机器学习策略篇:详解进行误差分析(Carrying out error analysis)
从一个例子开始讲吧. 假设正在调试猫分类器,然后取得了90%准确率,相当于10%错误,,开发集上做到这样,这离希望的目标还有很远.也许的队员看了一下算法分类出错的例子,注意到算法将一些狗分类为猫,看看 ...
- IceRPC之依赖注入>快乐的RPC
作者引言 很高兴啊,我们来到了IceRPC之依赖注入>快乐的RPC,基础引导,打好基础,才能让自已不在迷茫,快乐的畅游世界. 依赖注入和IceRPC 了解 IceRPC (C#) 如何为依赖注入 ...
- ETL工具-nifi干货系列 第十四讲 nifi处理器PublishKafka实战教程
1.kettle的kafka生产者叫kafka producer,nifi中的相应处理器为PublishKafka,如下图所示: 可以很清楚的看到PublishKafka处理器支持多个版本的kafka ...
- kettle从入门到精通 第五十一课 ETL之kettle Avro input
1.我们在学习nifi的过程中有接触到Avro schema,当时我在想kettle应该也支持Avro,果不其然kettle也是支持Avro文件的读和写的.今天我们一起来学习下kettle中如何使用A ...
- 前端实现预览PDF
下载包 npm install react-pdf 我使用的是react-pdf@5.7.2版本 以下例子使用的是react创建的项目 直接上代码=>cv可用,保证高效 1.新增依赖 yarn ...
- YUM退役了?DNF本地源配置
客户遇到在OEL8安装Oracle缺包问题,使用dnf安装也没有,甚至连oracle-database-preinstall-21c都装不上.本质是DNF配置问题. 早期为了解决这类问题,专门写过很多 ...
- 淘宝二面:千万级数据中如何用Redis维护热点数据"?
MySQL里有千万条数据,但是Redis中只存10万的数据,如何保证redis中的数据都是热点数据? 我是小宋, 一个只熬夜但不秃头的Java程序员.关注我,带你轻松过面试.提升简历亮点(14个dem ...
- 使用 TensorRT C++ API 调用GPU加速部署 YOLOv10 实现 500FPS 推理速度——快到飞起!!
NVIDIA TensorRT 是一款用于高性能深度学习推理的 SDK,包含深度学习推理优化器和运行时,可为推理应用程序提供低延迟和高吞吐量.YOLOv10是清华大学研究人员近期提出的一种实时目标 ...
- vim中ctags 的使用
--- title: vim中ctags 的使用 EntryName: vim-config-with-ctags date: 2020-08-19 11:17:38 categories: tags ...
- Coap 协议学习:具体协议介绍具体
协议框架 CoAP默认运行在UDP上,但它也支持运行在SMS,TCP等数据传输层上.本文主要是基于UDP上的CoAP协议介绍 1.消息模型 Messages COAP协议通信是通过在UDP上传输消息类 ...