- 博客(50)
- 收藏
- 关注
RSS订阅原创 async函数和await
1.async函数async doubleAfter2seconds(num) { console.log(num + 'kkk') }, async mm() { let n = await this.doubleAfter2seconds(2) console.log(n) } 2kkk undefinedasync函数没有返回值 默认返回 promise：{resolve}await 等待的是promise执行成功的结果2. async doubleAfter2seco
2021-01-21 16:03:38
97
原创 渲染流水线：CSS如何影响首次加载时的白屏时间？
1.css//theme.cssdiv{ color : coral; background-color:black}<html><head> <link href="theme.css" rel="stylesheet"></head><body> <div>geekbang com</div></body></html>当渲染进程接收 HT
2020-06-11 12:24:20
313
原创 DOM树：JavaScript是如何影响DOM树构建的？
1.HTML 解析器是 HTML 文档边加载边解析网络进程加载了多少数据，HTML 解析器便解析多少数据网络进程接收到响应头之后，会根据响应头中的 content-type 字段来判断文件的类型，比如 content-type 的值是“text/html”，那么浏览器就会判断这是一个 HTML 类型的文件，然后为该请求选择或者创建一个渲染进程。渲染进程准备好之后，网络进程和渲染进程之间会建立一个共享数据的管道，网络进程接收到数据后就往这个管道里面放，而渲染进程则从管道的另外一端不断地读取数据，并同时
2020-06-10 21:28:08
323
原创 js中数据的保存
1. JavaScript 的内存模型function foo(){ var a = "极客时间" var b = a var c = {name:"极客时间"} var d = c}foo()2.js为什么要用栈和堆内存空间两个表示数据？这是因为 JavaScript 引擎需要用栈来维护程序执行期间上下文的状态，如果栈空间大了话，所有的数据都存放在栈空间里面，那么会影响到上下文切换的效率，进而又影响到整个程序的执行效率。通常情况下，栈空间都不会设置太大，
2020-06-07 17:36:37
529
原创 javascript调用栈为什么栈会益处
1.代码会经过编译阶段，编译阶段会创建上下文环境变量，什么情况会创建上下文？全局代码，会被创建全局执行上下文，而且在整个页面的生存周期内，全局执行上下文只有一份。当调用一个函数的时候，函数体内的代码会被编译，并创建函数执行上下文，一般情况下，函数执行结束之后，创建的函数执行上下文会被销毁。当使用 eval 函数的时候，eval 的代码也会被编译，并创建执行上下文。var a = 2function add(){var b = 10return a+b}add()1.什么是 Ja
2020-06-05 17:02:57
144
原创 变量提升
1.JavaScript 中的声明和赋值2.JavaScript 代码的执行流程从概念的字面意义上来看，“变量提升”意味着变量和函数的声明会在物理层面移动到代码的最前面，正如我们所模拟的那样。但，这并不准确。实际上变量和函数声明在代码里的位置是不会改变的，而且是在编译阶段被 JavaScript 引擎放入内存中。输入一段代码，经过编译后，会生成两部分内容：执行上下文（Execution context）和可执行代码。VariableEnvironment:执行环境 mynam
2020-06-05 16:05:45
164
原创 HTTP请求流程
1.浏览器端发起HTTP请求流程用户在浏览器地址栏输入网址 http://baidu.com1.1 构建请求浏览器构建请求行的信息，构建好后，浏览器准备发送网络请求GET /index.html HTTP1.11.2 查找缓存发送网络请求之前，会先在浏览器缓存中查找是否有请求的文件缓存的好处:缓解服务器的压力实现资源的快速加载1.3 准备IP和端口HTTP的内容是在TCP/IP协议中传输数据阶段实现；如何获取IP和端口:DNS域名解析：百度的IP地址：119.75.2
2020-06-04 13:44:17
249
原创 Tcp/IP协议
1.如何保证页面文件能被完整的送达浏览器？互联网中的数据都是通过数据包 进行传输1.1 IP:把数据包送到目的主机数据包在互联网上运输就要符合网际协议（简称IP）标准，计算机的地址就是IP地址，访问任何网址，实际是你的计算机向另一台计算机请求信息，只要知道IP地址，就可以访问；主机A想要发送数据包给主机B，发送之前会将主机B的IP地址和A的IP地址，这些附加的信息被装进IP头数据结构里，包括源IP地址，目的IP地址，以及IP版本号，生存时间等;1.2 UDP：把数据包发送到应用程序IP是
2020-06-03 16:16:10
394
原创 React创建组件的两种方式
1.无状态组件 通过构造函数创建function Hello(props){ return <div></div>}2.有状态组件 通过es6中的class继承创建组件通过class继承创建对象 class Animal{ //class类中只能写构造函数 实例属性 、方法 ，静态属性、方法 constructor(name,age){//constructor是一个构造方法，用来接收参数 //每一个类中都有一个构造函数，如果
2020-05-29 18:51:59
446
原创 React虚拟DOM和diff算法
1.网页的呈现过程:过程：浏览器请求服务器，服务器返回Html文档，浏览器解析文档，构建DOM树，css规则树，形成渲染树，将渲染树渲染到页面；在网页上点击需求，向服务器请求数据，请求到的数据是数组对象，通过 字符串拼接的方式，将数据st绑定到页面；弊端：如果数据中只有一部分和上次请求的不一样，也得全部重新绑定数据渲染页面，性能不是最优；优化性能：按需渲染页面，只要把更新的数据渲染到页面即可，不需要全部渲染；如何按需更新：获取到浏览器内存中新旧DOM树，进行比较，渲染更新的
2020-05-28 18:49:39
207
原创 js第14章 表单提交
1.表单提交input button通过设置 type类型为submit浏览器将表单提交到服务器之前，form表单会触发submit事件，可以在这个事件中去验证表单，之后再去提交给服务器；<form method="get" action="" onsubmit="return tijiao()"> <ul> <li>姓名：<input name="name" id="n" type="text"/></li>
2020-05-17 22:21:49
254
原创 客户端存储
1.Cookie:http cookie也叫做cookie,存储在浏览器端，存储用户会话信息,跟踪用户的状态，比如当用户登录以后跳转其他界面，则不再需要登录，登陆状态则保存在cookie中，当用户看一部分视频3.20，推出后下次重新进来，则下次请求3.20秒的视频；...
2020-05-15 21:56:09
140
原创 js第13章事件
1.事件流事件流：从页面中接受事件的顺序 ；ie事件流指的是是事件冒泡 netscape指的是事件事件捕获；事件冒泡div添加点击事件， 点击div会冒泡到 body,再冒泡的html,最后再冒泡到document对象事件捕获div添加点击事件，会从document对象开始捕获，再到html,再到body最后到divDOM事件流Dom2事件规定了事件流分为事件捕获，目标阶段，事件冒泡...
2020-04-29 17:42:53
128
原创 第8章 BOM
BOM:全称Broser Object Model 浏览器模型EMScript是js的核心，浏览器要能够使用js，bom就是核心1.window对象全局对象var声明的变量，通过delete操作符不能删除window定义的变量，可以通过delete操作符删除窗口关系及框架窗口位置screenLeft screenTop 窗口距离屏幕左边的距离（支持的浏览器 IE chorme...
2020-04-28 18:06:57
123
原创 js第十二章元素大小
1.访问元素的样式任何支持style特性的html元素在javaScript中都有一个style属性，style对象包含着通过html的style指定的所有样式对于有分割线的css属性要将转化成驼峰式div.style.fontFamili2.元素的大小偏移量计算一个元素在页面的位置function jisuanoffset(ele){ var parent=ele....
2020-04-27 11:47:14
155
原创 js第十一章 扩展DOM
1.选择符APIquerySelector()可以通过document 对象调用 document.querySelector() 会在文档范文内查找匹配元素通过元素调用 document.body.querySelector() 会在元素范围内查找皮牌的元素querySelectorAll()调用的方式与querySelector()相同返回的是nodeList实例2.元素...
2020-04-26 14:30:22
91
原创 js第十章DOM
1.dom节点什么是dom?Document Object Model(文档对象模型）将html文档或者xml文档描绘成有节点层次的结构，开发者可以通过操作节点来修改页面的某一部分；节点层次文档根节点 Document文档元素 html html档中只有一个文档元素每一个文档中的标记都可以通过一个节点表示Node类型所有节点都继承于Node接口Node中的常量...
2020-04-25 21:50:22
124
原创 闭包
1、概念闭包函数：声明在一个函数中的函数，叫做闭包函数。闭包：内部函数总是可以访问其所在的外部函数中声明的参数和变量，即使在其外部函数被返回（寿命终结）了之后。2、特点让外部访问函数内部变量成为可能；局部变量会常驻在内存中；可以避免使用全局变量，防止全局变量污染；会造成内存泄漏（有一块内存空间被长期占用，而不被释放）3、闭包的创建：闭包就是可以创建一个独立的环境，每个闭包里...
2020-04-23 22:30:35
79
原创 第五章 Function String Math
1.Function声明函数的方式函数声明 （在函数声明之前也可以调用，函数声明提升）function p(){ }p()表达式声明(不能提前使用，相当于没有定义变量)var p=function(){}p()函数没有重载因为函数内部有一个arguments对象，类似于一个数组，用来保存参数，所以定义几个参数，传入几个参数对函数不会有影响，同名的函数会覆盖之前...
2020-04-23 17:38:15
189
原创 第五章 引用类型 object array
1.Object类型创建objectvar person=new Object(); person.name="猪猪"var person={ name:"猪猪" }； 对象创建属性或者方法 推荐使用读取对象的属性通过点的方式 person.name通过方括号 person[name]2.Array类型创建Array(可以保存任何类型的数据)var arr=new ...
2020-04-23 12:32:12
346
原创 js高级程序设计第四章 执行环境作用域链
1. 执行环境及作用域链执行环境：也叫做环境，定义了变量或者函数有权访问其他变量或者数据；全局环境：window对象局部环境：代码在环境中执行时，为它的变量函数分配内存空间，代码执行完毕，环境被销毁 var color="red" function color(){ var anothercolor="blue" function changecolor()...
2020-04-22 17:09:29
89
原创 js高级程序设计第三章基本概念
1.变量全局 用var来声明var message; 如果没有初始化 ，message被赋予undefined局部声明 在函数中用var声明 function p(){ var message=1;}在函数外面拿不到局部变量（在函数调用时，会为变量创建环境，之后混啊经会被销毁）如果在函数中没有使用var 则定义为全局变量 function p(){ ...
2020-04-22 12:17:06
94
原创 在html中使用javascript
1. <script>重点属性：type:text/javascriptsrcdeferasync2.javascript引入页面的方式直接在页面中写javascript代码引入外部的javascript文件3.引入外部的文件，放在哪里？以及弊端放在head中将所有外部引入的文件放在head中，当浏览器遇到javascript文件，加载...
2020-04-21 16:52:07
117
原创 JSON对象
javaScipt对象的特点：属性的引号可以加可以不加var person={ "name":"王子", "class":"大四", "kemu":["语文","数学","英语"] };Json对象的特点： 1.不用定义变量 2.属性必须要加引号 3.末尾没有分号 console.log(JSON.stringify(per...
2020-04-04 12:45:23
100
原创 web离线缓存
web应用程序本地缓存：通过每个页面的manifest文件来管理；manifest:文件是一个简单的文件夹，在该文件中，列举出需要被缓存或不需要缓存的文件资源的文件名称，文件的资源路径；可以为每个页面单独指定一个manifest文件，也可以为web应用程序指定总的manifest文件；cache:指定需要缓存在本地的资源文件；network:指定不进行本地缓存的文件 只有当客户端与服务器建...
2020-03-09 13:34:05
768
1
原创 HTML5本地数据库SQLLite
1.创建数据库对象var db=openDatabase(“数据库名字” , “版本号”，“数据库描述”，"数据库大小”)2.执行事务处理 调用transaction();(使用事务处理，防止在对数据库进行访问操作的过程中收到外界的干扰)db.transaction(function(tx){tx.executeSql(执行sql语句，[sql语句需要的参数], dataHandle...
2020-03-08 15:04:18
257
原创 html5 webstorage做简易数据库
在这里插入代码片<div class="shuru"> <ul> <li><span>姓名：</span><input type="text" id="name" placeholder="请输入姓名..." /></li> <li><span>邮箱...
2020-03-08 12:12:36
171
原创 html5拖放API
在这里插入代码片<div id="ele" style="width:500px;height: 150px;border: 1px solid red" draggable="true">请拖放我</div><div id="targetele" style="width:500px;height: 300px;border: 1px solid silve...
2020-03-06 20:35:10
129
原创 js里的继承
1.原型链继承（ 将父类的实例作为子类的原型） function animal(){ this.name=null; this.sleep=function(){ return this.name+"睡觉"; } } function dog(){ this.type="犬科"; }...
2019-06-28 22:06:40
88
原创 js中的跨域
1.js跨域：指js在不同域之间进行数据的传输与通信用ajax向一个不同的域请求数据，只要协议、域名、端口有任何一个不同，都被当作是不同的域。2.在js中，我们直接用XMLHttpRequest请求不同域上的数据时，拿不到数据解决方案1.jonsp跨域原理：通过script标签引入一个js文件，这个js文件载入成功后会执行我们在url参数中指定的函数，并且会把我们需要的json数据作为...
2019-06-21 11:54:17
233
原创 原生js中的ajax及ajax封装
1.什么是ajax? ajax主要用来请求数据是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。2.ajax的优点传统的web交互，用户发送一个http请求给服务器，服务器收到请求后响应用户，返回一个新的页面给用户；在服务器处理用户提交请求的过程中，用户一直等待，直到服...
2019-06-21 11:53:17
134
原创 正则表达式
1.正则表达式作用：验证数据的格式2.正则验证的两种方式：正则字符串用法(验证成功显示值 失败显示null) var str="13402893715"; str.match(/^[1][34578][0-9]{9}$/);正则对象用法（验证成功显示true 失败显示false） var str="13402893715"; var res=new RegExp(/^[1][3...
2019-06-14 12:17:21
205
原创 js里面的遍历方法
1.for循环遍历 （要知道数组的length） var m=["m","1","o","n"]; for(var i=0;i< m.length;i++) { console.log(m[i]); }2.for in遍历 （可以遍历数组也可以遍历对象）var m=["m","1","o","n"]; for(var key ...
2019-06-14 12:11:00
223
原创 js图片轮播案例总结
1.js里面this的指向在函数中this指向window在枚举对象中 this指向枚举对象在事件中 this指向当前对象//事件绑定var btn = document.querySelector("button")btn.onclick = function () { console.log(this) // btn}//事件监听var btn = document.qu...
2019-06-07 23:03:40
672
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人