当前位置: 代码迷 >> 综合 >> Java学习笔记——JavaScript(一)
  详细解决方案

Java学习笔记——JavaScript(一)

热度:69   发布时间:2024-02-06 02:28:43.0

JavaScript

是什么
脚本语言:不需要编译,可直接允许;嵌套在HTML里面
做什么
1)js能动态的修改HTML、CSS(修改:删除、添加、更新)
2)数据校验

组成
1)DOM对象 :Document Object Model 文档(理解为HTML)对象模型
对象模型:理解为,是通过js得到某些HTML标签对象,有了标签对象,就可以对标签进行操作,比如:给标签添加属性、删除属性、添加样式等等
2)BOM对象 :浏览器对象模型
得到浏览器对象,就可以操作浏览器,比如:让页面刷新、跳转、弹窗、记录Cookie等

在HTML中使用js的方式
1)标签内使用
在HTML标签内使用事件属性(点击鼠标、键盘等事件)引入js(事件属性 :是在HTML中以on开头的属性,比如onclick、ondbclick)
2)标签外HTML页面内使用
js代码可以通过<script></script>引入
js代码可以放在html页面内的任意地方,但是建议js代码越晚加载越好,即放在最后
3)引入外部文件
编写一个js文件,后缀为.js,在HTML页面内任意地方使用<script>标签引入该js文件
注意:2、3方式不可写入同一个<script>标签

语法

变量


Java等编程语言,强数据类型语言
js是若数据类型语言,
1)变量不需要数据类型修饰,使用var 变量名 = 值;
2)变量名可以重复,但是后者会把前面的覆盖
3)同一个变量名,多次赋值,数据类型可以不同
4)var修饰,为局部;不使用为全部

数据类型


原始/基本数据类型
1)数字 number:整型+浮点型
2)字符串 string:字符+字符串
3)布尔型 boolean:true/false
4)空 null
5)未定义 undefined
注意:js的函数typeof(变量名),会返回数据类型

运算符


1)算数 + - * /
数字之间的数学运算(" + " 与java类似,可以做字符串拼接)
2)赋值 =
3)关系 > < >= <= != == ===
js中“==”可以判断数字是否相等,如果是字符串与数字相比,当字符串内容与数字相等,就会返回true
“===” 需要值与数据类型都相同才会返回true,否则返回false
4)逻辑 & | !
& | 判断返回值数:0(false)、1(true)
! 返回值true、false

流程控制语句


1)if...else...
if(布尔表达式){}else{}
布尔表达式:true(1)/false(0);逻辑运算;关系运算;字符串:非空字符串为true,空字符串为false。

2)while...
console.log();//向控制台输出日志
3)do...while
4)for...
5)switch

对象

内置对象


1)Number对象
返回值是Object,即对象;因为是new Number创建出的所以叫Number对象
Number.MAX_VALUE :返回Number最大值
Number.parseInt : 将字符串转换成数字。如果字符串里面有除数字外的其他字符,将从第一个不是数字的地方停止转换。
NaN : not a number

2)String对象
使用字符串原始数据,如,s1 = "js";使用new String,如,s2 = newString("js");都可以调用字符串的属性和方法。
属性:
length : 返回字符串长度
方法:
charAt(number a) : 根据下标找字符
indexOf(string s) : 返回第一个出现的指定字符的下标
concat(string s) : 字符串拼接
lastIndexOf(string s) : 返回最后出现的指定字符的下标
match(string s) : 在原字符串中匹配与参数相等的字符串,匹配成功返回该字符串,匹配失败返回null
replace(string s1,string s2) : 将第一个出现的字符串s1,替换为s2
split(string regex) : 拆分。返回拆分后的[字符串]数组
substr(起始下标[,截取长度]) : 截取字符串
substring(起始下标[,结束下标]) : 截取[起始下标,结束下标)
charAt()    返回在指定位置的字符。
charCodeAt()    返回在指定的位置的字符的 Unicode 编码。
fromCharCode()    将 Unicode 编码转为字符。
includes()    查找字符串中是否包含指定的子字符串。
repeat()    复制字符串指定次数,并将它们连接在一起返回。
search()    查找与正则表达式相匹配的值。
slice()    切片,提取字符串的片断,并在新的字符串中返回被提取的部分。
startsWith()    查看字符串是否以指定的子字符串开头。
toLowerCase()    把字符串转换为小写。
toUpperCase()    把字符串转换为大写。
trim()    去除字符串两边的空白
toLocaleLowerCase()    根据本地主机的语言环境把字符串转换为小写。
toLocaleUpperCase()    根据本地主机的语言环境把字符串转换为大写。
valueOf()    返回某个字符串对象的原始值。
toString()    返回一个字符串。

3)Date对象
var date = new Date();//返回当前时间
new Date(1);//以指定毫秒值创建对象,从1970年1月1日 0:0:0开始
new Date(dateString); //"October 13,1975 11:13:00"
new Date(year,month,day[,hours,minutes,seconds,millonseconds])
//想要获得的月减一,其他不变
方法:
getDate()    从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()    从 Date 对象返回一周中的某一天 (0 ~ 6)。
getFullYear()    从 Date 对象以四位数字返回年份。
getHours()    返回 Date 对象的小时 (0 ~ 23)。
getMilliseconds()    返回 Date 对象的毫秒(0 ~ 999)。
getMinutes()    返回 Date 对象的分钟 (0 ~ 59)。
getMonth()    从 Date 对象返回月份 (0 ~ 11)。
getSeconds()    返回 Date 对象的秒数 (0 ~ 59)。
getTime()    返回 1970 年 1 月 1 日至今的毫秒数。
parse()    返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate()    设置 Date 对象中月的某一天 (1 ~ 31)。
setFullYear()    设置 Date 对象中的年份(四位数字)。
setHours()    设置 Date 对象中的小时 (0 ~ 23)。
setMilliseconds()    设置 Date 对象中的毫秒 (0 ~ 999)。
setMinutes()    设置 Date 对象中的分钟 (0 ~ 59)。
setMonth()    设置 Date 对象中月份 (0 ~ 11)。
setSeconds()    设置 Date 对象中的秒钟 (0 ~ 59)。
setTime()    setTime()方法以毫秒设置 Date 对象。
toLocaleDateString()    根据本地时间格式,把 Date 对象的日期部分转换为字符串。
toLocaleTimeString()    根据本地时间格式,把 Date 对象的时间部分转换为字符串。
toLocaleString()    根据本地时间格式,把 Date 对象转换为字符串。

4)Array对象
长度不固定,数据类型不固定
有下标,从0开始
创建方式:
1、直接赋值
var arr1 = [1,"js",true,null,undefined,new String("a")];
2、new对象
var arr2 = new Array(1,"js",true,null,undefined,new String("a"));
var arr3 = new Array();
arr3[0] = 1;
arr3[1] = "js";
可以通过下标添加值,如果下标处有值则是修改
属性:
length 获得数组长度
方法:
indexOf()    搜索数组中的元素,并返回它所在的位置。
pop()    删除数组的最后一个元素并返回删除的元素。
push()    向数组的末尾添加一个或更多元素,并返回新的长度。
sort()    对数组的元素进行排序。


5)Math对象
Math对象不能new可以直接使用
方法:
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) 返回角的正切。

6)RegExp对象
主要用于校验数据
使用方式:
1、创建校验模板
1.1、var a = new RegExp("模板");
1.2、var a = /模板/;
模板是指,方括号[]、元字符、\d\w等 数量 + * ?
2、判断
var s = "java";
var regexp = /模板/;
regexp.test(要匹配的);//返回是否匹配成功
regexp.exec(要匹配的);//匹配成功返回成功的元素,失败返回null

// 模板1 只匹配数字
var reg1 = new RegExp("[0-9]");
//var reg2 = /[0-9]/;
// 模板2 匹配至少一个数字
var reg2 = /[0-9]+/;
//模板3 匹配至多一个数字
var reg3 = /[0-9]?/;
//模板4 匹配开头是数字
var reg4 = /^\d/;
//模板5 匹配开头是数字,中间任意,末尾是字母
var reg5 = /^\d.*[A-z]$/;/** ^[A-Z] 开头必须是大写* ()内的内容表示的是一个表达式/组,()本身不匹配任何东西,只是把括号内的内容作为*   同一个表达式来处理,当做匹配规则,但是不返回匹配到的字符串*  多个() 就是多个规则* ?=n 匹配任何其后紧接指定字符串 n 的字符串。*  例如 : 对其后紧跟 "all" 的 "is" 进行全局搜索:var str="Is this all there is";var patt1=/is(?= all)/g;* .* 匹配任意字符* (?=.*[a-z]) 即其后必须有任意的小写字符* (?=.*[A-Z]) 即其后必须有任意的大写字符* (?=.*\d)    即其后必须有任意的数字* []  匹配会出现的数据*/
//模板7 首字母大写,后续包含大写和小写,有数字,总长度6-10
var reg7 = /^[A-Z](?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{5,9}$/;
//---------|  1  ||   2     ||   3     ||  4   ||   5    ||  6 |
/** 第1部分 匹配是否已大写字母开头* 第2部分 其后紧跟包含有小写字符的任意字符*       例如 : 对其后紧跟 "all" 的 "is" 进行全局搜索:*			var str="Is this all there is";*			var patt1= /is(?= all)/  ; is后紧跟?=后面的" all"*			返回的patt1= is,  是Is this all there is,是this中的is*	如果()前没有字符,那就是从头开始寻找有没有符合?=后面的内容的结果*	.*[a-z] 匹配所有任意字符+小写字符,*	.*?[a-z] 匹配到第一个任意字符+小写字符就结束匹配*	第3,4部分 同上*	总 2,3,4部分是要求字符串中必须包含小写,大写和数字*	第4部分 *	第5部分 匹配只能包含大写或小写或数字*	第6部分 限定第5部分长度 {5,9}*	$ 是必须以第5部分内容结尾*	() 中只是判断条件,不占用总体判断长度*/
//模板8 首字母大写,后续包含大写或小写,有数字,总长度6-10
var reg8 = /^[A-Z](?=.*[a-zA-Z])(?=.*\d)[a-zA-Z\d]{5,9}$/;
//---------|  1  ||      2     ||   3  ||    4   ||  5 |
/** 第1部分 匹配是否已大写字母开头* 第2部分 从开头大写字母后,匹配必须包含小写或大写* 第3部分 从开头大写字母后,匹配必须包含数字* 第4部分 匹配只能包含大写或小写或数字