![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
学习
笔描相思
这个作者很懒,什么都没留下…
展开
-
WebRTC用到的方法
远端流通过监听事件 client.on(‘stream-added’) 获得,请在 client.join() 进房前注册该事件,确保您不会错过远端用户进房通知。收到上述事件后要通过 client.subscribe() 订阅远端音视频流。● userSig: 用户签名,参考获取临时 userSig,或者部署 userSig 签发服务。● sdkAppId: 您在腾讯云创建的音视频应用的 sdkAppId。● mode: 实时音视频通话模式,设置为 ‘rtc’。● userId: 用户 ID,由您指定。原创 2022-10-17 14:42:19 · 498 阅读 · 1 评论 -
WebRTC的基本概念
转发的协议被定义为TURN。STUN:NAT的UDP简单的网络协议,它允许位于NAT后的客户端找出自己的公网地址,查出自己位于那种类型的NAT之后,以及NAT为某一个本地端口绑定的Internet端端口。问题:STUN并不是每次都能够成功的为需要的NAT的通话设备分配IP地址的,P2P在传输媒体流时,使用本地带宽,在多人音视频通话的过程中,通话质量好坏往往需要根据使用者本地带宽确定。信令服务器除了交换网络协商信息和媒体协议信息,比如房间的管理,音视频播放的音乐信息,进度条信息等都需要通过信令服务器实现。原创 2022-10-17 14:36:25 · 952 阅读 · 0 评论 -
vite的学习笔记
vite先读取main.js中引入的index.css文件,直接使用fs模块读取index.css中的文件内容,创建一个style标签,将index.css中的文件内容直接copy进style标签里,然后将style标签插入到index.html的head中,将该css文件中的内容直接替换为js脚本,同时设置(Content-Type)为js,从而让浏览器以js脚本的形式来执行css后缀的文件。当我们在协同开发的时候,两个人开发用了相同的类名,这样导致了样式的覆盖,为了解决这个问题需要用到css模块化。..原创 2022-08-29 17:20:16 · 847 阅读 · 0 评论 -
vue中的路由学习巩固
router是全局的router实例,它有很多实例和对象,例如history,push(),replace(),go();route是当前激活的路由信息的对象。原创 2022-07-21 14:40:11 · 56 阅读 · 0 评论 -
canvas学习第一篇
一:绘制图形1:绘制一个实心长方形 ctx.fillStyle = "rgb(200,0,0)"; ctx.fillRect(10, 10, 55, 50);2:绘制一个矩形的边框ctx.fillStyle = "rgb(200,0,0)";ctx.strokeRect(10, 10, 55, 50);3:清除指定矩形区域,让清除部分完全透明。clearRect(x, y, width, height)4:案例 var canvas = document.getElementB原创 2022-04-21 17:10:51 · 851 阅读 · 0 评论 -
面经总结2
1:实现sleep函数。等待指定的时间再执行function spleep1(ms,fun){ setTimeout(() => { fun(); }, ms);}spleep1(1000,()=>{ console.log("132");})案例2:css的优先级a,不同级的优先级:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性b,同级的优先级原创 2021-09-14 09:47:47 · 51 阅读 · 0 评论 -
vue的基础知识2
1:vue的基本原理是怎么样的?vue数据的响应式原理?(这个回答要很全面,涉及到mvvm,钩子函数用法,v-model等等)1:响应式原理:是变量data和propos中的所有属性,通过object.definproperty转换成getter和setter变成响应式的,然后查看rander函数中是否用到了data或者propers中的数据,是的话对改属性进行依赖收集。当改属性被修改的时候会触发setter,通知刚刚收集好的依赖进行更新,每一个组件实例都绑定一个wathcher,当数据发生改变会通知它原创 2021-09-12 10:42:29 · 81 阅读 · 0 评论 -
vue知识总结基础篇
1:vue生命周期1)创建前(beforeCreate)初始化vue的实例对象,不能获取data和props中的数据,dom还没有进行渲染2)创建后(created)vue实例已经创建,可以获取data和props中的数据,dom还没有进行渲染3,载入前(beforeMount)已经进行了虚拟dom的渲染4,载入后(mounted)进行了真实的dom和数据的渲染5,更新前(beforeUpdate)数据更新之前6,更新后(updated)数据更新之后7,销毁前(beforeDest原创 2021-09-08 22:07:08 · 591 阅读 · 0 评论 -
面经的总结
1:懒加载是怎么实现的?懒加载就是按需加载的意思,我们通过将一个大的资源文件,打包成多个小的资源文件,当我们点击前端路由的时候就会按需的加载js文件,这样可以缩短首屏时间,提高性能。2:重排和重绘1:重排就是当元素的布局和排列方式发生改变的时候会造成重排。2:重绘的话就是当元素的外观发生改变的时候,会引起重绘。a:引起重排的原因有:增加,删除元素元素中字体大小,内容的改变元素的大小,位置的改变第一次加载页面的时候浏览器窗口缩放的时候b:引起重绘的原因有:字体颜色的改变背景颜色的改变原创 2021-08-26 00:02:30 · 81 阅读 · 0 评论 -
webpack学习与实践第二篇
1:Js的兼容性处理:第一种方法:安装:npm i babel-loader @babel/core @babel/preset-env -Dmodule:{ rules:[ { test:/\.js$/, exclude: /node_modules/, loader:'babel-loader', options:{ //指定兼容的处理原创 2021-08-22 16:14:04 · 123 阅读 · 0 评论 -
webpack学习与实践第一篇
1:webpack是什么?是模块打包工具,它会将前端的所有的资源文件(js,css,json,img,less)都会作为模块处理。模块的依赖关系进行静态的分析,生成对应的静态资源。2:什么是loader?webapck本身只能处理js/json模块,如果要加载其他的模块,需要使用对应的loader,进行转换、加载。loader本身也是运行在node.js环境中的javascript模块,它是一个函数,接受源文件作为参数,返回转换的结果。3:什么是插件?可以完成一些loader不能完成的功能,在we原创 2021-08-22 11:10:06 · 84 阅读 · 0 评论 -
call, apply,bind
1:他们主要是用来改变this的指向对象的2:call它和apply的区别就是参数不一样,call的参数传的是数组,apply传的是单个参数,他们必须是函数去调用他们。是立即执行的3:bind也可以将一个对象绑定给一个函数,它是永久绑定不能改变,返回的是一个函数,不是立即执行,要通过函数的返回值调用...原创 2021-08-02 10:23:42 · 50 阅读 · 0 评论 -
事件的循环机制
1:js它是一个单线程的所以每次操作只允许一个主线程,js它是非阻塞的当我们要执行异步任务的时候会采用事件循环来解决。2:对于同步代码执行中所调用的函数的执行环境放到执行栈中去,如果执行环境中也有函数同样也会将其 放入执行栈中,当遇到异步函数的时候,主线程会暂时挂起异步函数,当异步函数有返回结果的时候我们会将异步函数的回调函数放到事件队列中去,主线程执行执行栈发现执行栈为空的时候,主线程就会将事件队列中的第一个元素的执行环境放到执行栈中进行执行,每次执行都会先判断执行栈中有不有任务,没有任务就去执行事件队原创 2021-08-01 21:31:09 · 74 阅读 · 0 评论 -
防抖和节流
1:函数在指定时间内只会触发一次,具体实现方法第一次触发函数的时候,延迟delay时间执行,如果在delay时间段内再次触发该函数,则重新开始计时如果delay时间段内没有触发该函数,则执行该函数 function bunde(fn ,depaly) { let timetar=null; return function() { if(timetar) { clearTimeout(timetar); } timetar=setTime原创 2021-07-25 15:54:35 · 76 阅读 · 0 评论 -
深拷贝和浅拷贝
1:浅拷贝就是指赋值对象的一层给另外一个对象,深拷贝表示把一个对象的每一层都赋值给一个另外一个对象,让这两个对象没有一点关联,深拷贝和浅拷贝只针对于引用类型。浅拷贝的方法:Array.assign()function clone(obj) { return Object.assign(obj, {}) }for in:function clone(obj) { var target={}; for(var key in obj) { if(obj.h原创 2021-07-25 15:35:45 · 77 阅读 · 0 评论 -
闭包的作用
1:两个函数嵌套,内部的函数能够访问外部函数中的变量。就会形成闭包,闭包是隐藏的,不会造成全局的污染,缺点就是,闭包中的变量会造成内存溢出,因为这些变量不会被垃圾回收。原创 2021-07-25 14:04:39 · 109 阅读 · 0 评论 -
new的原理
1:首先会创建一个对象2:创建构造函数上面的属性和方法给这个对象3:将这个对象的__proto__的属性赋一个构造函数的protypeof<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title> </title> <script> // alert(2423) // console.log("423"); fun原创 2021-07-25 13:18:19 · 82 阅读 · 0 评论 -
this的指向的问题
我们看调用函数的是什么,this一般指向的就是什么,如果是构造函数this指向的是构造函数所创建的实例,如果是一个对象调用一个函数,this指向的是这个对象,如果是直接调用函数this指向的是windows,我们也可以通过call,aplly,bind改变this的指向对象...原创 2021-07-25 11:10:19 · 57 阅读 · 0 评论 -
typeof和instanceof的实现原理
1:typeof判断基本数据类型可以准确的判断,除了null,会被判为object类型,因为js底层的数据存储,前三位表示的是数据类型,而null全部的位数是0,object类型前三位是000,所以用typeof判断数据类型的时候被误判是object数据类型,typeof判断对象的数据类型的时候只能判断object和function两种。2:我们可以通过object.tostring.call()准确的判断基本数据类型和引用的数据类型。3:instanceof判断数据类型的时候会基于原型链去判断,例如:原创 2021-07-25 10:56:49 · 528 阅读 · 0 评论 -
原型的总结
举个生活中的例子,我没有房子,但是我父亲有我可以住我父亲的房子,那我父亲就相当于原型,原型,实例,构造函数的关系,构造函数有一个protype属性和他所创建的实例对象的属性__proto__指向同一个原型,原型上面有一个construct的属性指向构造函数。为什么要有原型?原型上面主要是共享属性和方法给所有的实例,因为构造函数创建实例的时候,会将构造函数中的属性和方法重新创建然后赋值给所有的实例,显然我们是没有必要创建那么多同名却不相等的方法,和属性。原型链:因为每一个属性都有一个__proto__原创 2021-07-25 09:58:05 · 77 阅读 · 0 评论 -
前端计算机网络常见面试题目总结
1:说一下 http 和 httpshttp:是超文本传输协议,是目前互联网运用最为广泛的协议,他主要是服务器和客户端传输获取数据的一个桥梁,http是明文传输,如果攻击者窃取了服务器和客户端传输的报文,很容易被读懂,因此http不适合传输比较铭感的信息。https:安全套接字层超文本传输协议HTTPS,就是在http基础上加入了ssl层,就是通过ssl对数据进行了加密,因此https要比http安全。2:http的缺点1:通信使用明文,内容可能被窃取2:不验证通信方的身份容易遭遇伪装3:无法证原创 2021-07-20 21:26:44 · 917 阅读 · 6 评论 -
http协议
请求方法:put:用来传输文件,要求在请求报文主体中包含文件的内容,但是他自身不带验证机制.head:获取报文的首部delete:删除文件,他自身不带验证机制.options:用来获取服务器支持那些请求方法tract:追踪路径发送请求的时候:在Max-Forwards首部字段中填写输入的数值,每经过服务器就减一,当数值减到0时,就服务器发起响应connect:要求和代理服务器建立隧道,通过ssl进行加密,经过隧道http:特点持久连接:通过三次握手和四次挥手,能够减少tcp的连接和断开的开原创 2021-07-18 16:33:22 · 54 阅读 · 0 评论 -
面试题收集1
1:语义化在html5没有出现之前,都是一堆的没有语义的冷冰冰的标签。以前的页面,一上来就是一堆的div+css, 为了解决这个问题提出了语义化标签.语义化标签的好处(1):通过见名知意的标签,方便开发者写界面(2):更符合W3C统一的规范标准,是技术趋势。(3):没有设置样式时浏览器的默认样式也能让页面结构很清晰。(4):支持更多的设备。屏幕阅读器会完全根据你的标记来“读”你的网页。更好的支持浏览器的阅读模式等。(5):有利于SEO(搜索引擎优化)。和搜索引擎建立良好沟通,有助于爬虫抓取更多原创 2021-07-04 16:47:39 · 61 阅读 · 0 评论 -
双飞翼布局
1:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>try</title> <style> *{ margin: 0px; padding: 0px; } .counm{ float: left; } .content{ width: 100%; } .center{原创 2021-06-25 22:00:53 · 50 阅读 · 0 评论 -
瀑布流的案例
$(function(){})表示等到dom结果加载完了后执行$(window).on('load',function(){})dom结构和图片等元素加载完了就执行原创 2021-06-25 21:39:55 · 58 阅读 · 0 评论 -
圣杯布局的实现方式
1:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>try</title> <style> *{ margin: 0px; padding: 0px; } .content{ /* background-color: #FFEB3B; */ height: 550px; //两边留空白扩大空间原创 2021-06-25 21:06:44 · 76 阅读 · 0 评论 -
es6中的set和map
1:set定义:set中存的值是唯一的不能重复创建:var set=new Set(‘参数’);参数可以是数组也可以是类数组set保证唯一性:是类似通过===,但是会NaN和NaN是相等的set的属性和方法set.prototype.constructorset.prototype.size方法:add()delete()clear()has()将set装换成数组Array.from()es6的扩展运算符…遍历setkeys()for( let item of set原创 2021-06-25 20:40:16 · 66 阅读 · 0 评论 -
canvas的学习第一篇
1:创建一个canvas画布< canvas id=“myCanvas” width=“200” height=“100”></ canvas>2:获取绘图的上下文var c = document.getElementById(“myCanvas”);var t=c.getContext(“2d”);3:body中插入一个图片<!DOCTYPE html><html lang="en"> <head> <meta cha原创 2021-06-17 11:48:25 · 255 阅读 · 1 评论 -
setTimeout和setInterval的运行机制
setTimeout和setInterval的运行机制 它们都不能保证时间精度问题,第二个参数的延时只能保证何时会把代码添加到浏览器中的任务队列中去,不能保证添加到队列就会立即运行.简单的讲,这里的毫秒延时并不是说何时这些代码会执行,而是何时将回调添加任务对列中去,添加在队列中的,然后主线程还被其他的任务占用,比如正在处理用户操作,那么回调就不会马上执行.Canvas中的requestAnimationFrame方法接收一个参数,此参数是一个要在重绘屏幕前调用的函数,...原创 2021-06-17 10:21:09 · 91 阅读 · 0 评论 -
javaScript集合和引用
1:object创建的两种方式(1):通过new关键字创建var obj=new Object();obj.name="小明";(2)字面量创建 var obj={ name:'小明', age:14 }2:访问属性的方法(1)obj.name(2)obj[name]3:Array创建数组:(1)new关键字创建let color=new Array();创建一个数组对象let color=new Array(10);创建一个空间为10的数组大小let co原创 2021-06-01 19:50:24 · 106 阅读 · 2 评论 -
一些不好记但是佷常见的css的属性
1:input的外边框与"|"的颜色通过outline改变颜色,caret改变|的颜色<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script> </script> </head> <body> <input type="text" /> <原创 2021-05-20 19:48:49 · 66 阅读 · 0 评论 -
项目实战
1:划分目录2:全局样式的css的引入在base.css里面引入,normalize.css@import url("./normalize.css");body{ padding: 0; margin: 0;}app组件中使用css<template> <div id="app"> </div></template><script>export default { name: 'App',原创 2021-05-16 20:38:35 · 86 阅读 · 0 评论 -
vuex的学习
取别名:脚手架3脚手架2可以直接使用用别名2:promise如果在我们以后遇到某个请求需要依赖两次请求的结果的话我们可以promise中的all不用promise的解决方法使用后:vuex的学习vuex是一个状态的管理工具,就是多个组件中有的状态需要共享就使用vuex进行统一的管理,并且还是响应式的,只要一个组件改变vuex中的数据,其他的地方也会被改变。安装vuex:cnpm install vuex --save写vuex的配置import Vue原创 2021-05-11 15:25:07 · 83 阅读 · 0 评论 -
Tabbar案例
1:首先要进行组件的抽取外面的组件tabbar<template> <div class="tabbar"> <tabbariterm path="/home" activeColor="red"> <img src="../../assets/github.png" style="width: 20px; height: 20px;" slot="text_image_active"/> <img src="../../asse原创 2021-05-10 17:33:24 · 149 阅读 · 0 评论 -
es6的函数扩展
1:es6中允许给函数的参数设置默认值 function loge(x,y='hello') { console.log(x,y); } loge("小明"); loge("小明","我爱你"); loge('小明','');注意:函数中不能用let或者const声明和参数同名的变量名参数的变量名不能有同名的变量2:可以于解构赋值一起使用传参数的时候只有,...原创 2021-05-08 17:24:25 · 40 阅读 · 0 评论 -
vue的v-on指令的修饰符
vue的v-on指令的修饰符stop:阻止事件冒泡capture:设置捕获事件(在父级元素上设置一个capture)self:只有自己的事件被促发了,才会执行once:事件只执行一次prevent:阻止默认事件vue的键盘事件键盘事件的链接keyup:鼠标按下时keydown:鼠标抬起时keypress:按下抬起间促发...原创 2021-05-08 16:38:39 · 250 阅读 · 0 评论 -
javascirpt高级程序设计(笔记一)
1:语言基础(1):区分大小写(2):标识符:必须以数字,字母,下划线,$组成,开头不能是数字,采用驼峰命名(第一个单词首字母小写,其他的首字母大写)(3):注释:但行注释 //,多行注释 /* */(4):严格模式:在脚本的开头加上"use strict"开启了严格模式,也可以单独给一个函数开启严格模式,是在函数第一行写上"use strict".(5):分号和代码块:一般 不加分号不会报错,编译器会自己判断加上,可能会出现错误建议都加上,代码块建议一条语句也加上,可以让内容更清晰原创 2021-05-06 22:07:09 · 226 阅读 · 0 评论 -
vue的router第三篇
原创 2021-05-05 23:37:48 · 72 阅读 · 0 评论 -
vue-router第二篇
修改active-class文件打包默认打包成下面三个文件嵌套路由的案例//router配置import Vue from 'vue'import Router from 'vue-router'import home from '../components/home.vue'import about from '../components/about.vue'import hh from '../components/hh.vue'import ww from ...原创 2021-05-05 15:04:25 · 127 阅读 · 1 评论 -
我不知道的javascript(上卷笔记)
1:名词解释引擎:负责整个javascript的编译到执行的过程编译器:负责词法分析,代码生成等作用域:负责收集并维护声明的变量的查询,并且有严格的规则 ,当前的代码对变量的访问权限.2:编译器在生成代码的时候会进行变量的查询查询分为两种LHS和RHS,就是赋值语句的左侧和右侧.3:如何进行变量的查询如果查找的目的是对变量赋值(LHS),如果查找的目的是获取变量的值(RHS)4:作用域的嵌套在当前的作用域中无法找到某个变量是,引擎会在外层嵌套的作用域中继续查找,直到找到该变量或者抵达最外层原创 2021-05-05 02:34:03 · 46 阅读 · 0 评论