weixin_40725706

这个屌丝很懒，什么也没留下！

热门标签

js对象、属性、函数、方法_js对象属性函数

作者：weixin_40725706 | 2024-05-22 08:44:21

踩

js对象属性函数

文章目录

js对象
js函数
js方法
js属性
js事件

对象、属性、函数、方法的区别？

console：这是一个对象，无前后缀

.length：这是对象的一个属性，点做前缀

alert（）：这是一个函数，括号做后缀，函数是在对象外定义的

.log（）：这是对象的一个方法，对象和函数的结合体，点做前缀，括号做后缀，方法就是对象内定义的函数

js对象

对象的规范：**console：**这是一个对象，无前后缀

1.console

console：控制台，js的内置对象，控制输出到控制台的中的数据

.log（输出的内容）:控制台输出方法
- console.log（‘输出的内容’）；：括号表示调用函数，引号是定义字符串类型，引号中的内容是给函数的参数
- 控制台输出的内容会全部显示在浏览器的console中，console.log的执行不会打断程序的运行
- console是js中的内置对象，通过.可以调用它内置的log“方法”，console是对象，log是对象中的函数。
.dir(标签对象):获取标签变量的详细对象信息

2.document

Document：文档对象模型

属性：

.documentElement：获取html元素
- .clientWidth/Height:获取不带滚动条的浏览器宽度，其实就是html元素，根标签的宽高
- .scrollTop：获取滚动条已经动高度，不是只读的，可以修改值来规定滚动条滚动了多少
- ```
document.documentElement.scrollTop= 500;//使打开页面时滚动栏距离顶部的值为500
1
```
.body：获取body元素

方法：

.write():文档写入，将结果写入到文档中，我们可以在网页上看到写入的数据，会替换掉页面原来的内容
.getElementById(“id名”)：根据id获取元素节点,由于id是唯一的，所以直接返回单元素
.getElementsByClassName(“类名”)：根据类名获取元素节点，类名可以重复，所以返回的是元素数组
.getElementsByTagName(“标签名”)：根据标签名获取元素节点，标签名可以重复，所以返回的是标签数组
- .getElementsByTagName("*"):获取html文件中所有的标签，封装为一个类数组对象
.querySelector(“选择器”)：根据选择器获取元素，只会获取一个元素，单选，所以返回的是单元素，注意加选择器的前缀
.querySeletorAll(“选择器”)：根据选择器获取元素，能够获取所有符合选择器条件的元素，多选，所以返回元素数组
.createElement(“标签名”):用于创建一个指定tagname的html元素，创建出来的节点是孤儿标签，它没有被挂载到dom树上面
.createTextNode(“文本内容”):创建一个孤儿文本节点。

3.window

window：BOM，浏览器对象模型

.onload:页面加载完毕事件，延迟运行事件，当页面资源、结构全部加载完成之后，才会执行这个函数表达式
.hasOwnProperty(属性名):方法，检查对象中是否有该属性，返回布尔值
.innerWidth/Height:窗口的内宽高，包含竖直/水平滚动条宽度
.outerWidth/Height:窗口的外宽，包含竖直/水平滚动条宽度
- 窗口全屏时没有边框，如果窗口不占全屏，会有边框，这时outerWidth/Height会稍大于innerWidth/Height
scorllY:表示在垂直方向已滚动的像素值，但在获取窗口卷动高度时常与document.documentElement.scrollTop属性一起获取滚动值，是只读的，不能赋值

   var scrollPX=window.scrollY||document.documentElement.scrollTop;//短路运算，如果第一个有值，则赋值第一个，否则赋第二个值
1

.navigator:获取本浏览器的信息对象
.history：获取浏览器的操作会话历史对象
location:获取当前网址
- .href：获取当前页面网址
- .href=“网址”：跳转到某个页面
- .reload(true):强制刷新
- search：获取当前浏览器的GET请求参数
  - 比如访问http://www.baidu.com?a=1&b=2
  - ```
     window.location.search;//"?a=1&b=2"
  1
```

4.math

10个常用方法

Math:数学对象，存放一些数学运算的方法，比如幂计算方法.pow()和开根号计算方法.sqrt()

Math.abs(-1):求绝对值，abs就是absolute的缩写，绝对的意思
Math.ceil(1.2):2,向上取整
Math.floor(1.9)：1,向下取整
Math.round(1.5):2，四舍五入
- Math.round(-1.5),-1，负数比较特殊，只要比-1.5小就是舍，只要比-1.5大一点点，比如-1.51得到的结果就是-2
Math.PI:得到圆周率
Math.sqrt(4):2，求开平方
Math.pow(3,2):求幂次方，3的2次方
Matn.random():随机数，获取包含0，但不包含1的随机小数
- 求n-m之间的随机小数：Math.random()*(m-n)+n;
- 求n-m之间的随机整数,包含m：Math.round(Math.random()*(m-n)+n);
Math.min(1,2,3):求最大值

Math.max(1,2,3):求最小值

不能够求数组中的最大值，需要用展开运算符…转换一下

Math.min(...[1,2,3]);//结果为3 
...能够将数组展开为1,2,3

//两个数组拼接成一个数组，再加数据项，也可以用...展开运算符
var ary1=[1,2,3];
var ary2=[5,6,7];

var newary=[...ary1,...ary2,10];//结果就是拼接够的数组
1
2
3
4
5
6
7
8

5.array

Array：数组对象，内置了一些关于数组处理的方法

.isArray（）：判断对象是不是一个数组

6.number

Number.Max_safe_integer:获取数字整型的最大安全范围
Number.Min_safe_integer：获取数字整形的最小安全范围

7.object

.getOwnPropertySymbols(“对象变量名”)：获取对象中所有唯一数据类型的键值对
.getPrototypeOf(“对象名”)：获取对象名对象的原型

8.navigator

Navigator：导航栏的意思，能够通过这个对象获取浏览器的相关属性和标识

.appName:获取浏览器的官方名称
.appVersion：获取浏览器版本
.userAgent:浏览器的用户代理，(含有内核信息和封装壳信息)
.platform：用户的操作系统

9.history

window.history对象就封装了操作浏览器会话历史

常用的操作就是模拟浏览器回退键
history.back()方法，等于点击浏览器的回退键
history.go(-1),等同于history.back

//实现超链接回退到上一页面 
<a href="javascript:history.back();"></a>
1
2

js函数

函数的规范：alert（）：这是一个的函数，括号做后缀

1.输入输出函数

1.1alert()

alert()：警告函数，弹出警告框

alert（‘弹出的内容’）；：括号表示调用函数，引号是定义字符串类型，引号中的内容是给函数的参数
alert的特点：浏览器在遇到一个alert语句时，就会暂停程序的执行，直到用户点击了alert语句中的确定按钮，程序才会继续执行。

1.2confirm()

confirm()：弹出确认框

存在返回值，如果用户点击确定，返回true，用户点击取消，返回false

1.3prompt()

prompt（‘请输入’）：弹出输入框，括号中的文本是提示文本

存在返回值，点击确定返回值是输入的字符串型内容，如果内容为空，返回空字符串
点击取消，返回null

2.类型判断函数

2.1.typeof

typeof：类型判断，typeof是一个操作符，不是函数，在使用时不用将判断的值用括号括起来。它是特殊的函数，因为它后缀没有括号，而是直接输入值。

使用规范：typeof+要测试的数据；

typeof 5;//number
typeof '慕课网';//String

//输出变量类型
var a= 11;
console.log(a)//11
console.log(typeof a);//number
1
2
3
4
5
6
7

使用方式：
- 在浏览器repl环境下，直接输入typeof 5;
- 在html编辑器中需要用输出语句比如console.log(typeof 5);

2.2isNaN()

isNaN（）：判断数据是否为NaN，返回布尔值，有缺陷，只要使用Number（）函数转换结果为NaN,则它的返回结果就为true

3.类型转换函数

3.1Number()

Number（）：函数，是系统的内置函数，可以将其他类型转换为数字类型
- 如果转换的数据不是纯数字，则转换之后的值是NaN
- 空字符串会转为0
- e会转为科学计数法中的e
- 布尔值：true：会转为1 ，false：会转为0
- undefined会转为NaN
- Null会被转为0
- Number（'1+1‘）结果是NaN

3.2parseInt()

parseInt（）函数，功能是将字符串转为整数
- 注意：parseInt（）会自动截取字符串第一个非数字之前的数值作为整数，点也算是非数值
- 如果字符串中第一个字符不是数字，则直接转为NaN数值
- parseInt不会四舍五入
- parseInt也常用来净化，比如将100px转为100

3.3parseFloat()

parseFloat（）函数，功能是将字符串转为浮点型
parseFloat与parseInt的区别就是parseFloat会认为字符串中第一个小数点儿也是合法的
parseInt和parseFloat转换true和float时转的值也是NaN

3.4String()

String（）函数将数字、布尔值、undefined和null转为长度相同的字符串。
- 科学计数法和非10进制数字会转为10进制值

3.5Boolean()

Boolean()函数，将其他值转为布尔值
- 数字转布尔值：0和NaN是false，其他是true
- 字符串转布尔值：空字符串""是false，其他都是true
- undefined和null转布尔值：转为fasle

4.Date()

new Date():获取当前本机时间
Date
- .prase():将日期对象转为时间戳，精确到秒

5.定时器函数

setInterval():设置定时器，该函数可以重复调用一个函数，设置一个具体的固定的时间间隔。

var a=0;
setIntervat(function(){
		//这个函数将自动以固定时间间隔被调用。
		console.log(++a);//每两秒会输出一个++a的结果
},2000)
1
2
3
4
5

（）:括号内有两个参数，
- 第一个参数：匿名函数，要执行的函数
- 第二个参数：间隔时间，以毫秒为单位，2000就是2秒

clearInterval():清除定时器函数，可以清除一个定时器

根据定时器的变量名来清除定时器，如果传入的定时器变量名是undefined是不会报错的
- ```
var timer=setInterval(function(){

},2000)
clearInterval(timer);//清除timer定时器。
1
2
3
4
```

6.延时器函数

setTimeout()函数可以设置一个延时器，当指定时间到了以后，会执行函数一次，不再重复执行

setTimeout(function(){
	//函数体会在两秒之后执行一次,只会执行一次
},2000)
1
2
3

clerTimeout()函数可以清除延时器

7.eval()

eval()：执行函数

var str=arr.join("+");//将数组中各项用+连字符连接，组成新的字符串
eval(str);//eval会将字符串作为数学运算执行

8.dir()

dir():获取标签的详细信息

js方法

方法规范：**.log（）：**这是对象的一个方法，对象和函数的结合体，点做前缀，括号做后缀

1.String常用方法

String常用方法都不会改变原字符串，都需要新变量去接收新字符串

.charAt():得到指定位置字符
- 字符串中字符从左到右从零开始编号，通过输入编号获取指定位置的字符。
- 如果输入的位置在字符串中没有，则返回空字符串。
.substring（）：提取子串
- 使用方式：substring（5,10）；截取字符串中从第5位开始到第10位结束的字符串，不包括第10位，即符合左闭右开原则。
- substring如果省略第二个参数，那么就会从第一个参数开始截取到字符串的结尾
- substring中的两个参数，第一个参数可以大于第二个，系统会自动调整小的数值到前面
.substr（）：提取子串
- substr（5,10）：截取字符串中从位置5开始，长度为10的子串
- substr中的第二个值可以省略，表示到字符串结尾。
- substr中第一个值可以是负数，表示从倒数第几个字符开始
.slice（）：提取子串
- slice（5,10）：与subString相同，同样是截取位置5到10但不包括10的子串
- slice的参数可以是负值
- slice中的第一个参数必须小于第二个参数
.toUpperCase()：将字符串全部转为大写
.toLowerCase():将字符串全部转为小写
.indexOf（）：检索字符串
- 返回某个指定的字符串值在字符串中首次出现的位置
- 如果要检索的字符串值没有出现，就返回-1
- 检索的不管是字符还是字符串，都需要用引号包裹
.lastIndexOf(“子串”)：获取子串最后一次出现的位置，没有出现返回-1
.replace(“好的”,“坏的”)：找到字符串中第一次出现的”好的“字符串，并替换为"坏的"
- 如果想替换所有的，需要使用正则
str.split():字符串以括号中的分割符进行分割，分割成数组
- split():字符串不分割，存成一个数组中的一个数据项
- split(""):将字符串每一个字符都分为一个数据项，得到一个数组
- split("
  声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/weixin_40725706/article/detail/607451