当前位置: 首页 > news >正文

名词解析与经验分享(前端)

目录

1.什么是sass产品

2.下面我想说说事件循环

3. cmd窗口的一些快捷键

4. 组件与插件的区别

5. vue项目嵌入app后调用app方法

6.点击编辑按钮直接回到顶部,输入框光标闪动聚焦

7.短轮询与长轮询

短轮询

长轮询

8.前端moment库

9.移动端-触底刷新实现核心思想

10.jsx语法

11.子组件监听父组件的值实时更新值

12.git常用操作指令


1.什么是sass产品


像有道云笔记飞书等面向企业的,这些项目都是saas产品。软件及服务亦为负责售后负责产品升级,附带安装之类的服务器部署。一条龙服务。

创作助手说:

Sass产品指的是基于云端技术的软件即服务模式的产品。它们通常可以通过网络进行访问和使用,无需用户进行安装或拥有复杂的IT基础设施。此类产品通常由提供商负责管理和维护,以确保数据的安全性和可用性。用户只需要按照需要订阅相应的服务,然后可以使用相关的功能和工具来满足其业务需求。例如,有道云笔记、钉钉、腾讯会议等都是Sass产品。

2.下面我想说说事件循环

我们都知道js是一个单线程语言,当我们执行任务时会把他们从上到下放到任务队列,任务又分为同步任务和异步任务,执行过程中会优先执行同步任务,异步任务又分为宏任务和微任务,宏任务就是定时器、计时器这种,微任务就是promise,在执行异步任务时会按从上到下的顺序优先执行队列里的微任务,然后执行宏任务,优先宏任务里的同步任务,然后执行宏任务里的微任务,执行完毕再执行下一个宏任务

宏任务:script,异步请求Ajax,setTimeOut,setInterval,dom事件,其他宏任务

微任务 Promise(.then, .catch, .finally),process.nextTick,其他微任务、

3. cmd窗口的一些快捷键

快捷键

alt+f4关闭窗口

alt+shift+esc打开任务管理器

alt+空格唤起菜单

命令行输入exit退出

4. 组件与插件的区别

组件 (Component) 是用来构成你的 App 的业务模块,它的目标是 App.vue。 插件 (Plugin) 是用来增强你的技术栈的功能模块,它的目标是 Vue 本身。

插件直接提供服务,插件不需要开发,可以直接引入使用,组件只是个构成功能的轮子

组件可大可小,整个vue项目就是由一个个.vue组件组成的,每个组件都可以独立运行

5. vue项目嵌入app后调用app方法

首先判断环境,然后调用相应端提供的方法

 if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {window.webkit.messageHandlers.js_month_report_change_id.postMessage(id)} else if (navigator.userAgent.match(/(android|Android);?/i)) {window.Android.monthChange(id);}

6.点击编辑按钮直接回到顶部,输入框光标闪动聚焦

 <van-fieldref="input"v-model="text"rows="2"autosizetype="textarea"maxlength="800"placeholder="请输入内容"show-word-limit/>test(){window.scrollTo(0,0);this.$refs.input.focus();},

7.短轮询与长轮询

短轮询

短轮询很好理解,指定的时间间隔,由浏览器向服务器发出HTTP请求,服务器实时返回未读消息数据给客户端,浏览器再做渲染显示。

一个简单的JS定时器就可以搞定,每秒钟请求一次未读消息数接口

由于推送数据并不会频繁变更,无论后端此时是否有新的消息产生,客户端都会进行请求,势必会对服务端造成很大压力,浪费带宽和服务器资源。

长轮询

常见的是使用 WebSocket,tcp一次握手后客户端与服务端建立持久性连接,只要客户端不主动断开会一直通信,只要有新消息,客户端就会及时收到

8.前端moment库

很多人问moment库为什么之前那么多人用

如果只需要转换时间格式,确实可以去网上找个方法封装成公共方法就行了

原因是moment库不只是可以来回转换时间格式,还能对比当前时间与指定时间相隔几天,有相应的方法,所以在很多项目里都很实用。

  var at = this.$moment(time).format('YYYY-MM-DD')var to = this.$moment(new Date()).format('YYYY-MM-DD')if(this.$moment(to).diff(at, 'day')<7){//}

9.移动端-触底刷新实现核心思想


获取滚动条高度,页面可视区域高度,页面滚动高度
如果页面可视区域高度加页面滚动高度大于等于滚动条高度,执行刷新
如果页面可视区域只有一屏或小于一屏,获取手势滑动事件,上滑即刷新

10.jsx语法

结合了js的灵活性和xml的语义化等特点,通过vue实例的render方法进行渲染,跟template模版语法写法类似,但有些写法不太一样,比如{{}}变成了{},jsx语法内是可以直接使用es6循环语法,vue一般只有在封装公共组件才会使用,如页面右下角实时的消息弹窗,而react基本上都是用的jsx语法写的页面

11.子组件监听父组件的值实时更新值

  watch: {"$parent.childCompanyName": function () {console.log('1 :>> ', this.$parent.childCompanyName);this.$set(this.valueObj,"companyName", this.$parent.childCompanyName);},},

12.git常用操作指令

当我们使用git add .不小心添加了不想提交的文件或想更新后再一起提交,这时候就需要撤销

git reset HEAD

整体回到上次一次操作

git reset HEAD 文件名

某个文件回滚到上一次操作

1.未使用git add 缓存代码

  1) 放弃某一个本地文件命令: git checkout -- filename

  2) 放弃所有文件修改命令:  git checkout .

2. 已使用git add 缓存代码,未使用git commit

   1)放弃某一个本地文件命令回到git add .之前 :  git reset HEAD filename

   2)放弃所有文件修改命令回到git add .之前:    git reset HEAD

3. 已经用 git commit 提交了代码,注意此时使用回退不会保留我们的代码修改

    1)回退到上一次commit的状态: git reset --hard HEAD^

    2)或者回退到任意版本git reset --hard commit id ,使用git log命令查看git提交历史和commit id  :  git reset --hard commit id

http://www.lryc.cn/news/169198.html

相关文章:

  • 【前端】js下载url文件
  • 什么是 BSD 协议?
  • 【网络教程】揭秘Windows SSH服务端免密登录:告别繁琐,享受安全连接
  • 使用键盘控制Franka机械臂运动
  • 力扣第45天----第392题、第115题
  • 扔掉你的开发板,跟我玩Mcore-全志h616
  • 【Linux】网络篇:UDP、TCP 网络接口及使用
  • 卡尔曼滤波(Kalman Filter)原理浅析-数学理论推导-2
  • SQL 性能优化总结
  • MYSQL事务隔离级别分析
  • 学习javaEE初阶的第一堂课
  • 请问一下就是业务概念模型和业务逻辑模型有啥关系
  • 3.2 Android eBPF程序类型
  • 多目标优化算法:基于非支配排序的小龙虾优化算法(NSCOA)MATLAB
  • Linux学习第13天:嵌入式LinuxLED驱动开发:一字一符总见情
  • ModuleNotFoundError: No module named ‘omni‘
  • 题解:ABC320B - Longest Palindrome
  • 大模型从入门到应用——LangChain:代理(Agents)-[代理执行器(Agent Executor):结合使用Agent和VectorStore]
  • 【算法题】100040. 让所有学生保持开心的分组方法数
  • TrOCR – 基于 Transformer 的 OCR 入门
  • 单例模式优缺点
  • 【Java 基础篇】Java 字节流详解:从入门到精通
  • Vue记录(下篇)
  • 【测试开发】概念篇 · 测试相关基础概念 · 常见开发模型 · 常见测试模型
  • 1. 快速体验 VSCode 和 CMake 创建 C/C++项目
  • 【JAVA-Day18】用大白话讲解 Java 中的内存机制
  • [Hadoop] start-dfs.sh ssh报错
  • amlogic 多wifi 多bluetooh 兼容方案
  • Apache Hive概述,模拟实现Hive功能,Hive基础架构
  • postgresql|数据库|centos7下基于postgresql-12的主从复制的pgpool-4.4的部署和使用