js的基础笔记

不用var定义的数据无论定义在那都是全局变量 全局变量：声明在函数外面，全局共享

const 定义常量 局部变量：生命在函数内部，仅函数内有效

基本数据类型 空null 未定义undefined 布尔 字符串 数字类型number

null和undefined的区别，unll是在内存中分配了区域但没有值可以运算，而undefined没有在内存那种分配区域，所以不能参与运算

引用类型：对象，里面包含function array date

运算符：两个数相除不取整 + - * / ++ –

赋值运算符：= += -= *= /=

比较运算符： == != > < === >= <= *==是比较值是否相等，相等的话为ture ===是比较完全相等

位运算符：& | ~ << >>

逻辑控制语句 if else switce case 循环语句for foreach 逻辑控制语句break;跳出循环，continue跳出这个循环进行下个

函数供能：被调用时执行可被重复执行的代码块（没有重载，写了相同名的函数会被后面的函数覆盖）不能嵌套，弥明函数可嵌套

系统函数：parseInt() parseFloat() isNaN()判断是不是一个数字

变量匿名函数 var 函数名 = function(){} click=“变量匿名函数名” 进行调用

无名称匿名函数(function(){})();

函数调用的五种方式：函数名() 对象.时间=函数名 页面加载完成之后调用和页面部分标签调用：click=“变量匿名函数名”

window.alert(“弹窗内容”) innerHTML将内容插入到html中：可以插入文本，也可以插入HTML语句

BOM、Broswer、Object、Model浏览器对象

BOM最根本对象是Windos对象 BOM(Windows) > DOM(docment) > html > body

Windows对象的常用属性

document对Document对象的只读引用
history对history对象的只读引用
Screen对screen对象的只读引用
location用于窗口或框架的引用 
navigator对navigator的只读引用
name设置或返回窗口名称
self相当于windows对象
parent返回当前窗口的父窗口对象
top返回当前窗口顶层的父窗口对象
windows对象的常用方法
alert()返回一个窗口对象
confirm()弹出一个确认框

<button onclick="return confirm('是否跳转')">点击查看</button>

blur之当前窗口失去焦点

DOM:创建动态的html(元素、属性) css

获取元素document.getElementById(‘id’).value=n把n显示在此id栏里

document.getElementById() : HTMLElement通过id找到HTML元素

document.getElementByTagName : Nodelist 根据标签名获取元素列表 返回的是对象名.[0]获取第一个

document.getElementName : Nodelist 通过元素name属性获取元素

document.getElementClassName() : Nodelist 通过class获取元素

querySelector(selector) : HTMLElement 匹配该选择器要求的第一个元素

querySelectorAll(selector) : HTMLElement 获取符合该选择器的所有列表

绑定事件：document.getElementById(‘id’).addEventListner(“事件名”,函数名)

通过DOM这些获取到那些节点可获取元素、标签、文本，从而进行有针对性的操作

<div id="a">aa</div>
<button id="b">点击我把</button>
<div id="c">随机数</div>
</body>
<script>
document.getElementById('b').addEventListener("click",shijian)
    document.getElementById('b').addEventListener("click",xssj)
    document.getElementById('b').addEventListener("click",sjs)
    function shijian() {
        document.getElementById('a').innerHTML = Date();
    }
    function xssj() {
        alert("显示时间")
    }
    function sjs() {
        document.getElementById('c').innerHTML = Math.random()
    }
</script>

event对象(事件)

onload 在对象已加载的时候触发，就是页面在岗加载的时候触发

onclick 鼠标点击事件

onfocus 元素获得焦点

onblur 元素失去焦点

onchange 在域内容改变的时候发生

oninput 表单中内容发生改变、

ondblclick 鼠标双击事件

oncontextment 鼠标右键点击

onmousedown 某个鼠标键被按下

onmouseup 鼠标键松开

onmousemove 鼠标移动事件（鼠标悬停）

onmouseenter 鼠标移入

onmouseleave 鼠标移出

onKeydown 键盘按下事件

onKeypress 键盘按下或按住

onKeyup 键盘抬起

onresize 元素宽高发生改变

onsubmit 在form表单中当用户点击提交按钮时候触发

onreset 点击重置按钮时候触发 重置按钮reset

onabort 图像加载被中断

onerror 当加载某个文档或者图像时候发生错误时候发生错误

onunload 用户退出界面

有些元素自带事件、右键 a标签 可组织默认事件document.oncontextment = function(){return flast}

改变样式setAttribute(“style”,“样式名：样式值”) 还可设置属性setAttribute(“typy”,“text”),还可以对属性进行添加获取移除

document.getElementById('a').setAttribute("style","color:red")

Node节点

nodeName 节点名

nodeType 节点类型

nodeValue 节点值

parentNode 获取父节点

firstNode 获取指定节点的第一个节点

lastNode 获取指定节点的最后一个节点

childNodes 返回元素下面直接包含的所有子节点（包含文本节点和元素节点）

children 返回指定元素下所有的标签元素和节点

className 属性设置或返回元素的class属性

createElement()创建元素。参数为标签名称

createTextNode()创建文本节点

添加动态的option 元素.potions.add(new option(文本,value))

screen对象：获取屏幕的相关信息 document.write(screen.width)获取屏幕的宽度

location对象：地址相关信息 location.href(“地址名”)跳转地址 location.reload 刷新

history对象：历史信息相关记录

hength返回浏览器历史url记录

<a href="javascript:history.forward(1)">向前一步</a>
<a href="javascript:history.back(1)">后退一步</a>
<a href="javascript:history.go(3)">指定3步，后退就是负数</a>

核心ECMAScript对象

宿主对象：BOM、DOM两大类

内置对象(系统已经new好)

Global对象：idNaN()检查是否是数字 parseFloat()解析字符串返回一个浮点数 parseInt()解析字符串返回一个整数

Math对象：ceil(3)返回不小于3的数 floor(3)返回不大于3的数 random()生成随机数 round()四舍五入保留整数部分

sprt()返回整数的平方根 abs(-10)返回10的绝对值 PI返回Π(圆周率) max()最大数 min()最小数 括号里为参数

本地对象（需要开发者初始化）本地对象就是ECMA-262定义的类（引用类型）

string对象：拼接字符串 + 以及 concat()方法 str1.concat(str2)

str.indexof(“字符”)查询字符串 str.lastIndexof(“字符”)返回指定字符最后一次出现的位置 str.charAt(索引)按照索引查找

str.substring(2,4)截取字符串开始位置，截取长度 substr(2,4)同上 slice(startSice[]endSice)如果starSice是正数就同上，负数从右开始

startWith(“内容”):boolean 判断内容是否是开头 endsWith(“内容”)判断内容是否为结尾

split() 拆分自负串，把字符串拆分为字符数组

str.replace(/a/,“b”) 替换字符串，把a换成b

toLowerCase() 转换小写 UpperCase()转化大写

trim() 去掉前空格

Date对象（处理日期和时间）

var date = new Date 返回当前时间

getFullYear() 返回年份的四位数字例如：2022

getMonth() 从Date对象返回月份

getDate() 从Date对象返回一个月中的某一天

getHours() 返回小时

getMinutes() 返回分钟

getgetSeconds() 返回秒钟

getDay() 返回某一天

toLocaleString 把日期打印成标准格式

Array对象（处理数组）

常用方法

length() 返回长度的方法

phsh() 向数组的末尾添加一个新的元素并返回新的长度

pop() 移除数组最后一个元素并改变长度

unshift() 像数组开头添加一个元素并返回新的长度

shift() 移除数组中第一个元素并改变长度

slice() 可从数组中选定元素，假如选定1那么就返回1之后的元素

升序降序 sort() 、

var a = [45,78,14,23,96,45,8,41,589,35]
a.sort(function (a,b) {
    return a-b;
});
function dd() {
    console.log(a)
}

concat() 链接两个或多个数组

join() 把所有元素放入一个字符串中，有分隔符进行分割

reverse() 把所有数组颠倒顺序

splice() 删除元素并添加新元素

toString() 数组转化字符串

遍历用for foreach

for (index in a){
    console.log(a[index])
}

Number对象

MAX_VALUE最大值

MIN_VALUE最小值

toFixed(number):string 保留指定小数位，四舍五入

toPrecision(number):string 保留数字位置

toString:string 数字转字符串

Regexp对象（正则表达式的简写）

var reg = (/^1(3|4|5|6|7|8|9)[0-9]{9}$/) 不写引号 但是要写 / 如果是new出来的就要写引号

邮箱，手机号，密码，用户名的正则表达式去百度查

\将下一个字符标记为特殊字符或是字面值

^匹配输入开始部分 $匹配输入结尾部分

0次或者多次匹配前面的字符 +一次或多次匹配前面的字符 ?0次或一次匹配前面的字符

. 匹配任何字符但换行符除外

grep -n ‘the’ 查找the

方法

匹配a-z /[a-z]/

匹配0-9 /[0-9]/

匹配a-z0-9 /[a-z0-9]/

除了abc意外其他部分 /[^abc]/ 除了0-9 /[^0-9]/ 除了a-z0-9A-Z意外其他字符 /[^a-z0-9A-Z]/

匹配特定字符 /特定字符/

匹配空白字符 \s

量词

出现次数大于m小于n {m,n} :

刚好出现n次 {n} :

*：出现的次数大于等于0

+：一次或多次

?：0次或1次

gim g全局匹配 i忽略大小写 m匹配多行