#yyds干货盘点 前端小知识点扫盲笔记记录2

简介: #yyds干货盘点 前端小知识点扫盲笔记记录

constructor

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>constructor</title>
</head>
<body>
  <script>
    //属性的值是对函数本身的引用
    function father(name){
      this.name = name;
    }
    var gg=new father("father")
    console.log(gg.constructor,"gg")
    //ƒ father(name){
    //  this.name = name;
   // } 'gg'
  //创建自身属性的方法
   function Parent() {};
    function CreatedConstructor() {}
    CreatedConstructor.prototype = Object.create(Parent.prototype);
    //创建一个Parent的对象
    console.log( Object.create(Parent.prototype),"Parent")
    CreatedConstructor.prototype.constructor = CreatedConstructor; // 改变指向到父级
    CreatedConstructor.prototype.create = function create() {
      return new this.constructor();
    }
    new CreatedConstructor().create().create(); 
    //按照父亲级别的属性进行创造
    console.log(new CreatedConstructor().create().create(),"CreatedConstructor")
  </script>
</body>
</html>



cookie,session区别

// cookie 和 session 区别 // cookie数据存放在浏览器中, session数据存放在服务器上 // cookie是不安全的, 别人可以分析存放在本地的cookie并进行cookie诈骗, 考虑到安全性能, 应尽量使用session // session会在一定时间内保存在服务器上。 当访问增多时, 会比较占用服务器的性能。 考虑到服务性能, 应尽量使用cookie // 单个cookie保存的数据不能超过4k, 很多浏览器都限制一个站点最多保存20个cookie // cookie和session都用来存储用户信息, cookie存放于客户端有可能被窃取, 所以cookie一般用来存放不敏感的信息, 比如用户设置的网站主题, 敏感的信息用session存储, 比如用户的登录信息 // cookie, sessionStorage, localStorage 区别 // HTML5中提出了webStorage的概念, webStorage包括sessionStorage和localStorage, 只为了保存数据, 不会与服务器进行通信 // cookie, localStorage, sessionStorage都是在客户端保存数据, 存储数据的类型: 字符串 // webStorage不会随着HTTP header发送到服务器端, 所以安全性相对来说比cookie高, 不必担心截获 // 生命周期不同( 见后文), localStorage要手动清除, sessionStorage在浏览器关闭后清除 // 生命周期 // cookie: 可设置失效时间, 否则默认为关闭浏览器后消失 // localStorage: 除非被手动清除, 否则永久保存 // sessionStorage: 仅在当前网页会话下有效, 关闭页面或浏览器后就会被清除


diff算法

// 传统diff算法 // 虚拟DOM中的Diff算法 // 传统算法查找两颗树每一个节点的差异 // 会运行n1(dom1的节点数)*n2(dom2的节点数)次方去对比,找到差异的部分再去更新 // snabbdom的diff算法优化 // Snbbdom根据DOM的特点对传统的diff算法做了优化 // DOM操作时候很少会跨级别操作节点 // 只比较同级别的节点 // key的作用 // Diff操作可以更加快速 // Diff操作可以更加准确 // 避免渲染错误 // 不推荐使用索引作为key


eval使用

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>eval的使用</title>
</head>
<body>
  <script>
    //   eval() 函数会将传入的字符串当做 JavaScript 代码进行执行。
  var fangfang=eval(new String('2 + 2')) 
  console.log(fangfang,"fangfang") //String { "2 + 2" }
  var fangfangTest=new String('2 + 2')
  console.log(fangfangTest,"fangfangTest") //String { "2 + 2" }
  var geyao=eval('2 + 2') 
  console.log(geyao,"geyao") //4
  </script>
</body>
</html>



http1.0,2.0,3.0区别

HTTP1.0和HTTP1.1主要区别主要体现在:缓存处理,在HTTP1.0中主要使用header里的If-Modified-Since,Expires来做为缓存判断的标准,HTTP1.1则引入了更多的缓存控制策略例如Entity tag,If-Unmodified-Since, If-Match, If-None-Match等更多可供选择的缓存头来控制缓存策略。带宽优化及网络连接的使用,HTTP1.0中,存在一些浪费带宽的现象,例如客户端只是需要某个对象的一部分,而服务器却将整个对象送过来了,并且不支持断点续传功能,HTTP1.1则在请求头引入了range头域,它允许只请求资源的某个部分,即返回码是206(Partial Content)这样就方便了开发者自由的选择以便于充分利用带宽和连接。错误通知的管理,在HTTP1.1中新增了24个错误状态响应码,如409(Conflict)表示请求的资源与资源的当前状态发生冲突;410(Gone)表示服务器上的某个资源被永久性的删除。Host头处理,在HTTP1.0中认为每台服务器都绑定一个唯一的IP地址,因此,请求消息中的URL并没有传递主机名(hostname)。但随着虚拟主机技术的发展,在一台物理服务器上可以存在多个虚拟主机(Multi-homed Web Servers),并且它们共享一个IP地址。HTTP1.1的请求消息和响应消息都应支持Host头域,且请求消息中如果没有Host头域会报告一个错误(400 Bad Request)。长连接,HTTP 1.1支持长连接(PersistentConnection)和请求的流水线(Pipelining)处理,在一个TCP连接上可以传送多个HTTP请求和响应,减少了建立和关闭连接的消耗和延迟,在HTTP1.1中默认开启Connection: keep-alive,一定程度上弥补了HTTP1.0每次请求都要创建连接的缺点。HTTP2.0HTTP2.0是HTTP协议自1999年HTTP1.1发布后的首个更新,主要基于SPDY协议。HTTP2.0大幅度的提高了web性能,在HTTP1.1完全语义兼容的基础上,进一步减少了网络的延迟。实现低延迟高吞吐量。对于前端开发者而言,减少了优化工作。主要体现在以下几点特性:头部压缩多路复用二进制分帧请求优先级服务器推送


总结

我是歌谣 这些都是扫盲时候的笔记 微信公众号关注前端小歌谣 学习前端知识


相关文章
|
1月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
130 2
|
1月前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
38 0
|
1月前
|
人工智能 自然语言处理 运维
前端大模型应用笔记(一):两个指令反过来说大模型就理解不了啦?或许该让第三者插足啦 -通过引入中间LLM预处理用户输入以提高多任务处理能力
本文探讨了在多任务处理场景下,自然语言指令解析的困境及解决方案。通过增加一个LLM解析层,将复杂的指令拆解为多个明确的步骤,明确操作类型与对象识别,处理任务依赖关系,并将自然语言转化为具体的工具命令,从而提高指令解析的准确性和执行效率。
|
1月前
|
存储 弹性计算 算法
前端大模型应用笔记(四):如何在资源受限例如1核和1G内存的端侧或ECS上运行一个合适的向量存储库及如何优化
本文探讨了在资源受限的嵌入式设备(如1核处理器和1GB内存)上实现高效向量存储和检索的方法,旨在支持端侧大模型应用。文章分析了Annoy、HNSWLib、NMSLib、FLANN、VP-Trees和Lshbox等向量存储库的特点与适用场景,推荐Annoy作为多数情况下的首选方案,并提出了数据预处理、索引优化、查询优化等策略以提升性能。通过这些方法,即使在资源受限的环境中也能实现高效的向量检索。
|
1月前
|
机器学习/深度学习 弹性计算 自然语言处理
前端大模型应用笔记(二):最新llama3.2小参数版本1B的古董机测试 - 支持128K上下文,表现优异,和移动端更配
llama3.1支持128K上下文,6万字+输入,适用于多种场景。模型能力超出预期,但处理中文时需加中英翻译。测试显示,其英文支持较好,中文则需改进。llama3.2 1B参数量小,适合移动端和资源受限环境,可在阿里云2vCPU和4G ECS上运行。
|
1月前
|
前端开发 算法 测试技术
前端大模型应用笔记(五):大模型基础能力大比拼-计数篇-通义千文 vs 文心一言 vs 智谱 vs 讯飞vsGPT
本文对比测试了通义千文、文心一言、智谱和讯飞等多个国产大模型在处理基础计数问题上的表现,特别是通过链式推理(COT)提示的效果。结果显示,GPTo1-mini、文心一言3.5和讯飞4.0Ultra在首轮测试中表现优秀,而其他模型在COT提示后也能显著提升正确率,唯有讯飞4.0-Lite表现不佳。测试强调了COT在提升模型逻辑推理能力中的重要性,并指出免费版本中智谱GLM较为可靠。
前端大模型应用笔记(五):大模型基础能力大比拼-计数篇-通义千文 vs 文心一言 vs 智谱 vs 讯飞vsGPT
|
2月前
|
Web App开发 前端开发 Linux
「offer来了」浅谈前端面试中开发环境常考知识点
该文章归纳了前端开发环境中常见的面试知识点,特别是围绕Git的使用进行了详细介绍,包括Git的基本概念、常用命令以及在团队协作中的最佳实践,同时还涉及了Chrome调试工具和Linux命令行的基础操作。
「offer来了」浅谈前端面试中开发环境常考知识点
|
2月前
|
SpringCloudAlibaba JavaScript 前端开发
谷粒商城笔记+踩坑(2)——分布式组件、前端基础,nacos+feign+gateway+ES6+vue脚手架
分布式组件、nacos注册配置中心、openfegin远程调用、网关gateway、ES6脚本语言规范、vue、elementUI
谷粒商城笔记+踩坑(2)——分布式组件、前端基础,nacos+feign+gateway+ES6+vue脚手架
|
3月前
|
存储 前端开发 JavaScript
前端语言串讲 | 青训营笔记
前端语言串讲 | 青训营笔记
40 0
|
5月前
|
JSON 前端开发 JavaScript
前端Ajax、Axios和Fetch的用法和区别笔记
前端Ajax、Axios和Fetch的用法和区别笔记
94 2