没办法 只好自己积累了
学的总是记不住,只好自己记一记,写一写了。
Web相关
Web开发之Spring
Springboot 启动加载机制
Spring bean生命周期
JS相关
es678特性介绍
es6
两分钟明白浏览器渲染
这样写promise
cookie和session
浏览器中输入网址(URL)到浏览器显示的过程
js异步和同步、阻塞和非阻塞、进程和线程的总结
Vue 实现递归组件的原理
http
vue-x
vue-router
使用js的三种方式
1.直接在HTML标签中,使用事件属性,调用js代码:
点我啊!
2.在页面的任意位置,使用script标签
3.外部:使用script标签 src属性选择外部地址, type属性选择"text/javascript" charset=“utf-8”
注意事项:
1.js代码可以放在页面的任意位置使用,但是放置的位置不同将影响执行的顺序。
2.引入的外部script标签,不能再包含任何的js代码。
js中的变量
1.变量的声明:
var num1=1; //使用var声明的变量,是局部变量,在函数内可用
num2=“哈哈哈哈”; //直接声明的是全局变量。全局可用。
var a=1,b,c=2; //使用一行代码,声明多个语句,其中b为undefined;
js中声明变量的注意事项
1.js中声明变量的关键字 var,类型取决于赋值类型,默认值 undefined;
2.js中同一个变量可以在多次赋值中被修改数据类型。
3.变量可以使用var声明,也可以直接赋值声明;var声明的为局部变量;直接声明的为全局变量。
4.js中 变量可以重名,相当于后边的覆盖前边的。
5.变量名区分大小写。大小写不同不是同一变量。
js中的(6种)数据类型:
null:空,表示空的引用;
Undefined: 使用var声明,但是为赋值的变量;
Number: 数值类型,包含整型和浮点型;
Boolean:真假;
String:字符串;
Object:对象。
js中没有字符,单引号和双引号都是字符串。
常用数值函数
①isNaN 用于检测一个变量是不是一个非数值(Not a Number)
在检查时会先调用Number函数,尝试将变量转化为数值类型如果最终结果能转化为数值则不是NaN
②Number 用于将各种数据类型转化为数值类型
>>> Undefined无法转换返回NaN
>>> null 转为0
>>> Boolean true转为1 false转为0
>>> String 如果字符串是纯数值字符串,则可以转换
如果字符串包含非数字字符,则不可以转换 返回NaN
如果是空字符串转为0,可以是空格
③parseInt 将字符串转化为数值类型
>>>如果是空字符串不能转 “”–>NaN
>>>如果是纯数值类型字符串,则可以转换且小数点直接舍去,不保留 “123.9”–>123 “123”–>123
>>>如果包含非数字字符,则将非数值前面的整数进行转换 “123a”–>123 “a123”–>NaN
④parseFloat 转换机制与parseInt相同,不同的是转换数值字符串时,如果字符串为小数则可以保留小数点
“123.9”–>123.9 “123”–>123
⑤typeof 检测一个变量的数据类型
字符串–>string 数值–>number true/false–>boolean 未定义–>Undefined 对象/null–>Object 函数–>function
常用的输入输出
alert() 弹窗输出
prompt(); 弹窗输入 尽收两部分参数,①输入提示内容 ②默认框的默认文本 (两部分都可以省略) 输入的内容默认都是字符串
document.write("
12345
") 在浏览器屏幕上打印console.log(“2222”) 浏览器控制台打印
JS中的运算符
①除号 无论符号两边是整数还是小数,出完后都将按照实际结果保留小数
② === 要求等式的两边的数据,类型和值都必须相同,如果类型不同,直接返回false
③==只判断两边的数据,并不关心两边的数据类型是否相同
④!==不全等 !=不等
⑤条件运算符 a>b?true:false
在JS中,只能进行按位运算,如果两边不是数据类型,将转化为数字类型在运算
&& 进行逻辑运算
js中的真假判断
1.Boolean true为真 false 为假
2.数值类型 0为假 非0为真
3.字符串类型 ""为假 非空字符串为真
4.null/Undefined/NaN 全为假
5.object 全为真
switch结构的()中可以放各种数据类型
比对时采用===进行判断 要求类型和值都必须相同
js中的函数的声明与调用
函数声明的格式
function函数名(参数1,参数2…){
//函数体代码
return 返回值;
}
1.函数调用
①直接调用 函数名(参数1,参数2…);
②通过事件调用 在HTML标签中,通过事件属性进行调用
点
2.函数的声明与调用的注意事项
①函数中有没有返回值,只取决于函数中有没有return 无需刻意声明 在JS中,有返回值可以不接收 没有返回值也可以接收,结果为Undefined
②JS中函数的形参列表与实参列表 没有任何关联 也就是说 有参数可以不赋值(未赋值Undefined),没有参数也可以赋值. 函数的实际参数个数取决于实参列表
③JS中 函数是变量的唯一作用域 那么,函数的形参就是属于函数的局部变量
④函数的声明与调用语句没有先后之分,即,可以先写调用语句,再声明函数 func(); function func() {}
匿名函数的声明与使用
1.匿名函数表达式 var func=function(){} 调用函数 func();
注意,函数的调用语句,必须放在声明语句之后
2.直接将匿名函数,赋值给一个事件
window.οnlοad=function () { } //文档就绪函数,确保函数中的代码,在HTML文档加载完成之后执行
document.getElementById(“btn2”).οnclick=function () { }
3.自执行函数
①!function(){ }(); 开头用!表明这是自执行函数
②(function(){}()); 用()将匿名函数声明与调用包裹在一起
③(function(){})(); 用()将匿名函数声明语句进行包裹;
JS代码的执行顺序
JS代码的执行分为两个阶段 检查编译阶段 代码执行阶段
检查编译阶段 主要检查语法的错误 变量的声明 函数的声明 等声明操作
执行的操作 var num; function func1() {} var func2;
代码执行阶段 变量的赋值,函数的调用等执行语句 属于代码执行阶段
执行的操作 console.log(num); num=1; func1(); func2(); func2=function () {};
复制代码
console.log(num);
var num=1;
func1();
function func1() {}
func2();
var func2=function () {}
复制代码
arguments对象
1.作用用于保存函数的所有实参
>>>但函数存在实参时,可以使用数组下标访问函数的所有实参
>>>alert(arguments[4])
2.arguments中元素的个数,取决于实参列表,与形参个数无关
3.一旦函数调用时,传入了实参,那么对应位数的形参,将与arguments对应的元素进行绑定
修改形参,arguments中对应的元素将被改掉,反之也成立
但是,如果莫一位置没有传入实参,那么该位置的形参和arguments将不进行关联
4.arguments.callee();执行当前函数的引用,用于在函数中使用递归调用自身
BOM
screen对象
复制代码
console.log(window.screen);
console.log(screen);
console.log(screen.width);
console.log(screen.height);
console.log(screen.availWidth);//可用宽度
console.log(screen.availHeight);//可用高度=screen.height-底部任务栏高度
复制代码
location对象
复制代码
console.log(location);
console.log(location.href); //完整的URL路径
console.log(location.protocol); //协议名
console.log(location.hostname); //主机名
console.log(location.port); //端口号
console.log(location.host); //主机名+端口号
console.log(location.pathname); //文件路径
console.log(location.search); //从?开始的参数部分
console.log(location.hash); //从#开始的锚点位置
复制代码
使用location进行页面跳转
function gotobaidu(){
① location=“http://www.baidu.com”;
② window.location.href=“http://www.baidu.com”;
}
跳转页面,加载新界面之后可以点击回退按钮返回
function gotobaiduByAssign(){
location.assign(“http://www.baidu.com”); }
跳转页面,加载新界面之后没有回退按钮,无法返回
function gotobaiduByReplace(){
location.replace(“http://www.baidu.com”); }
刷新当前页面
location.reload(); 刷新页面 如果本地有缓存,将从缓存中读取 相当于按F5
location.reload(true);强制刷新 ,无论是否有缓存,都将请求后台加载最新数据,相当于Ctrl+F5
history 对象
console.log(history);
console.log(history.length);//用于记录当前页面跳转的历史页面个数
点击去前一页 相当于浏览器的前进按钮
function forward(){
history.forward(); }
点击去后一页相当于浏览器的后退按钮
function back(){
history.back(); }
表示跳转到浏览历史的任意一个界面
+1 表示前面一页 -1 表示后面一页 0 表示当前页 因此history.go(0);相当于刷新页面
function go(){
history.go(); }
navigator 对象
返回关于浏览器的各种系统信息
console.log(navigator);
输出浏览器的所有插件
for (var i=0;i<navigator.plugins.length;i++) {
console.log(navigator.plugins[i].name); }
window对象的常用方法
①prompt()弹窗输入
②alert() 弹窗输出
③confirm() 待确定删除的提示框 分别返回true false
④close() 关闭当前浏览器窗口
⑤open() 打开一个新窗口 参数一 新窗口的地址 参数二 新窗口的名字 没啥用 参数三 新窗口的各种配置属性 scrollbars=yes表示是否显示滚动条 只在IE有用
window.open(“http://www.baidu.com”,“百度”,“width=600px, height=600px,top=100px,left=100px,scrollbars=yes”);
⑥setTimeout 延时器,表示延时多少ms执行一个函数
参数一 可以传入匿名函数,也可以传入函数名
参数二 延时的毫秒数
参数三到参数n 传给回调函数的参数
setTimeout(function(num1,num2){},2000,“哈哈哈”,123,456,47)
⑦setInterval 定时器 表示每隔多少ms执行一遍函数
其他用法与setTimeout完全相同
⑧clearInterval 清除定时器
⑨clearTimeout 清除延时器
声明定时器时可以接受返回的id 并将id返回给clearInterval即可清除
DOM数的节点
DOM节点分为三大类 元素节点(标签节点) 属性节点 文本节点
属性节点 文本节点都属于元素节点的子节点,因此操作时,需先选中元素节点,再修改属性和文本
查看元素节点
1.使用getElement系列方法
var li=document.getElementById(“first”)
var list1=document.getElementsByClassName(“cls”)
var list2=document.getElementsByName(“name”)
var list3=document.getElementsByTagName(“li”)
注意事项
①id不能重名 如果id重复,只能取到第一个
②获取元素节点时,必须等到DOM树加载完成后才能获取 两种方式 将js写在文档最后 将代码写入window.onload函数中
③通过getElements系列取到的为数组格式,操作时必须取到其中的每一个元素,才能进行操作,而不能直接对数组进行操作
document.getElementsByClassName(“cls”).click()=function(){}; 错误
document.getElementsByClassName(“cls”)[0].click()=function(){}; 正确
④这一系列方法,也可以先选中一个DOM节点,从选中的DOM节点中,选择需要的节点
document.getElementById(“first”).getElementsByTagName(“li”);
- 通过querySelector系列方法
①传入一个选择器名称,返回第一个找到的元素,通常用于查找id var dq1=document.querySelector("#id")
②传入一个选择器名称,返回所有找到的元素无论找到几个,都返回数组格式 var dqs1= document.querySelectorAll("#div1 li")
查看修改属性节点
查看属性节点 .getAttribute(“属性名”)
设置属性节点 .setAttribute(“属性名”,“属性值”)
注意事项 .setAttribute()在老版本IE中存在兼容问题,可以使用.符号代替
document.getElementById(“first”).classname=“haha”;
JS修改css的多种方式
1.使用setAttribute设置class和style
document.getElementById(“first”).setAttribute(“class”,“class1”)
document.getElementById(“first”).setAttribute(“style”,“color:red”)
2.使用.className添加一个class选择器
document.getElementById(“first”).className=“class1”
3.使用.style.样式名 直接修改单个样式,注意样式名必须使用驼峰命名法
document.getElementById(“first”).style.color=“red”;
document.getElementById(“first”).style.fontSize=“18px”;
4.使用.style或者.style.cssText添加一串行级样式
document.getElementById(“first”).style=“color:red”; //IE不兼容
document.getElementById(“first”).style.cssText=“color:red”;
查看设置文本节点
.innerHTML取到或设置一个节点中的HTML代码
document.getElementById(“first”).innerHTML
document.getElementById(“first”).innerHTML=“hah”
.innerText取到或设置一个节点中的文本,不能设置HTML代码
document.getElementById(“first”).innerText
层次节点操作
-
.childNodes获取当前节点的所有子节点 包括元素节点和文本节点
.children获取当前节点的所有元素子节点 不包括文本节点 -
.parentNode获取当前节点的父节点
-
.firstChild获取第一个子节点包括回车等文本节点
.firstElementChild 获取第一个元素节点 不含文本节点
.lastChild .lastElementChild 获取最后一个
- .previousSibling获取当前节点的前一个兄弟节点 包括文本节点
.previousElementSibling获取当前节点的前一个元素兄弟节点
.nextSibling .nextElementSibling 获取后一个
- .attributes获取当前节点的所有属性节点 返回数组格式
创建并新增节点
- .document.createElement(“标签名”) 创建一个新节点,并将创建的新节点返回 需要配合.setAttribute为新节点设置属性
2.父节点.insertBefore(新节点,目标节点) 在父节点中将新节点插入到目标节点之前 父节点.appendChild(新节点)在父节点的内部最后,插入一个新节点
3.源节点.cloneNode() 克隆一个节点 传入true表示克隆源节点以及源节点的所有子节点 传入false或者不传,表示只克隆当前节点,而不克隆子节点
删除替换节点
1.父节点.removeChild(子节点) 从父节点中,删除指定子节点
2.父节点.replaceChild(新节点,老节点) 在父节点中用新节点替换老节点
Java相关
Java 二叉树、红黑树、B+树
Java多线程
java线程池
fabric相关
Hyperledger Fabric 学习三:共识机制
区块链之共识算法
区块链之加密算法