- 博客(68)
- 收藏
- 关注
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 用c语言编写前端开发中比例计算px转vw/vh的计算器
用c语言编写前端开发中比例计算px转vw/vh的计算器 在写移动端页面的时候为了适配手机型号尺寸的变化,需要多次用到vw和vh相对单位。所以就自己用C语言写了一个简易版计算器。 实现功能有:wpx/hpx转vw/vh (wpx元素的宽度,hpx元素的高度。本文中都以简称替代)vw/vh转wpx/hpxvw转vhvh转vw 首先我们需要知道进入哪种功能,定义一个判断进入功能的函数。输入V进入wpx/hpx转vw
2020-11-28 17:05:37
542
![](https://csdnimg.cn/release/blogv2/dist/pc/img/listFixedTop.png)
原创 纯html+css实现点击显示再次点击隐藏并且不联动的多个下拉菜单
纯html+css实现点击显示再次点击隐藏不联动的多个下拉菜单实现不联动的下拉菜单核心思想:input<type=“checkbox”>(复选框)label和input的绑定溢出隐藏和高度的转换checked选择器 使用复选框的特性:只有非选中和选中两种状态。再将label和input进行绑定。label的for和input的id进行绑定,可以实现点击label的时候input获取焦点。label和input可以不是紧挨的。<input type="ch
2020-11-27 23:30:30
4095
原创 proxy的特性
proxy的特性proxy作用:拦截对象中某一个所有属性的调用和变换基础格式:new Proxy(obj, {get(){},set(){}});参数一:拦截的对象参数二:方法中get调用时触发 set赋值时触发代码:let obj = { name: 'TZOF', age: 23, msg: 'you think'}obj = new Proxy(obj, { get() { console.log('调用时进入get');
2022-02-11 15:56:31
454
原创 defineProperty的特性
defineProperty的特性defineProperty作用:拦截对象中某一个指定属性的调用和变换基础格式:Object,defineProperty(obj, key, {get(){},set(){}});参数一:拦截的对象参数二:指定对象的属性名参数三:方法中get调用时触发 set赋值时触发代码:let obj = { name: 'TZOF', age: 23, msg: 'you think'}Object.definePropert
2022-02-11 15:17:13
332
原创 javascript数据类型
javascript数据类型基本类型(原始类型)数值(number)字符串(string)布尔值(boolean)nullundefined符号(symbol)引用类型(对象类型)除了基本类型之外的所有值都是引用类型数组(array)对象(object)函数(function)以上三种为常见的引用类型还有:Set、Map、RegExp、Date、Error...
2021-12-23 14:51:54
600
原创 for of和for in的区别
for of和for in的区别for ofof遍历的是元素itemfor inin遍历的是索引index示例代码let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];console.log('of遍历元素item------------------------------------------');for (let i of arr) { console.log(i)}console.log('in遍历索引index------------
2021-12-23 14:19:34
218
原创 前端面试题HTML篇
前端面试题HTML篇doctype的作⽤是什么声明位于文档中的最前面,处于标签之前。告知浏览器的解析器,用什么文档类型规范来解析这个文档。严格模式的排版和JS 运作模式是 以该浏览器支持的最高标准运行。在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。HTML、XML 和 XHTML 有什么区别html(超文本标记语言)——xhtml(可扩展性超文本标记语言)——xml(可扩展性标记语言)h
2021-05-21 09:14:04
127
原创 前端面试题Vue篇
前端面试题Vue篇核心问题概述:vue生命周期生命周期是什么?有什么内容?你是怎么用的?vue生命周期是组件从创建到销毁的全部过程,在整个过程中会触发11个生命周期函数。new Vue()初始化创建vue实例,指定vue的模板,通过判断template属性或者render函数方式默认模板。初始化数据,触发将数据与模板结合,触发beforeCreate与created生命周期函数。beforeCreate我用于处理页面过度效果如加载,created用于页面所有的初始化内容。将模板数据
2021-05-21 09:13:55
303
转载 JavaScript深入之从ECMAScript规范解读this
JavaScript深入之从ECMAScript规范解读thisJavaScript深入系列第六篇,本篇我们追根溯源,从ECMAScript5规范解读this在函数调用时到底是如何确定的。前言在《JavaScript深入之执行上下文栈》中讲到,当JavaScript代码执行一段可执行代码(executable code)时,会创建对应的执行上下文(execution context)。对于每个执行上下文,都有三个重要属性变量对象(Variable object,VO)作用域链(Scope
2021-05-21 09:13:20
169
转载 JavaScript深入之词法作用域和动态作用域
JavaScript深入之词法作用域和动态作用域JavaScript深入系列的第二篇,JavaScript采用词法作用域,什么语言采用了动态作用域?两者的区别又是什么?还有一个略难的思考题,快来看看吧。作用域作用域是指程序源代码中定义变量的区域。作用域规定了如何查找变量,也就是确定当前执行代码对变量的访问权限。JavaScript 采用词法作用域(lexical scoping),也就是静态作用域。静态作用域与动态作用域因为 JavaScript 采用的是词法作用域,函数的作用域在函数定义
2021-05-21 09:13:15
120
转载 JavaScript深入之执行上下文栈
执行上下文栈js代码执行顺序是什么,大部分人都知道同步执行var foo = function(){ console.log('foo1'); } foo(); // foo1 var foo = function(){ console.log('foo2'); } foo() // foo2然后看以下下面代码 function foo(){
2021-05-21 09:13:09
119
转载 JavaScript深入之闭包
JavaScript深入之闭包JavaScript深入系列第八篇,介绍理论上的闭包和实践上的闭包,以及从作用域链的角度解析经典的闭包题。定义MDN 对闭包的定义为:闭包是指那些能够访问自由变量的函数。那什么是自由变量呢?自由变量是指在函数中使用的,但既不是函数参数也不是函数的局部变量的变量。由此,我们可以看出闭包共有两部分组成:闭包 = 函数 + 函数能够访问的自由变量举个例子:var a = 1;function foo() { console.log(a)
2021-05-21 09:12:53
120
转载 JavaScript深入之变量对象
JavaScript深入之变量对象JavaScript深入系列第四篇,具体讲解执行上下文中的变量对象与活动对象。全局上下文下的变量对象是什么?函数上下文下的活动对象是如何分析和执行的?还有两个思考题帮你加深印象,快来看看吧!前言在上篇《JavaScript深入之执行上下文栈》中讲到,当 JavaScript 代码执行一段可执行代码(executable code)时,会创建对应的执行上下文(execution context)。对于每个执行上下文,都有三个重要属性:变量对象(Variable
2021-05-21 09:12:43
121
转载 JavaScript深入之从原型到原型链
JavaScript深入之从原型到原型链JavaScript深入系列的第一篇,从原型与原型链开始讲起,如果你想知道构造函数的实例的原型,原型的原型,原型的原型的原型是什么,就来看看这篇文章吧。构造函数创建对象我们先使用构造函数创建一个对象:function Person() {}var person = new Person();person.name = 'Kevin';console.log(person.name) // Kevin在这个例子中,Person 就是一个构造函数
2021-05-20 09:13:14
116
转载 jsonwebtoken&&koa-jswt
jsonwebtoken&&koa-jswtjwt作用:鉴权。 代替了 cookies sessionjwt特点(1)JWT 默认是不加密,但也是可以加密的。生成原始 Token 以后,可以用密钥再加密一次。(2)JWT 不加密的情况下,不能将秘密数据写入 JWT。(3)JWT 不仅可以用于认证,也可以用于交换信息。有效使用 JWT,可以降低服务器查询数据库的次数。(4)JWT 的最大缺点是,由于服务器不保存 session 状态,因此无法在使用过程中废止某个 token,或者
2021-05-20 09:13:07
316
转载 node后端代理接口
node后端代理接口方式一var http = require('http')var app = http.createServer(function (req, res) { // 访问服务时候执行 if (req.url === '/') { // 服务器向服务发送请求;叫做后端代理服务器;是不存在跨域问题 // http.get() 向另一个服务器发送气请求 // 参一请求地址;请求参数在请求地址上进行拼接的 // 请求完毕
2021-05-20 09:13:02
353
转载 centos上用docker部署环境
centos上用docker部署环境下载docker参考链接相关命令systemctl start docker 或者 service docker start //启动dokcersystemctl stop docker 或者 service docker stop //关闭dockerdocker images //看镜像docker ps -a //看启动的容器docker rmi dsad324(镜像id) //删除镜像docker logs name(容器名称) //查
2021-05-20 09:12:57
100
转载 ssh操作
ssh操作mac本地免密登录远程服务器① mac命令行ssh-keygen -t rsa 或者 ssh-keygen -t rsa -P ''然后一路回车即可,会在~/.ssh目录下生成 id_rsa和id_rsa.pub两个文件,id_rsa为私钥,id_rsa.pub为公钥② 登录远程服务器将mac公钥id_rsa.pub拷贝,并将该文件追加到~/.ssh/authorized_keys文件中,:wq保存③ 设置文件权限chmod 600 ~/.ssh/authorized_keys
2021-05-20 09:12:52
108
转载 前端性能优化常用代码
前端性能优化常用代码为什么要做性能优化?性能优化到底有多重要? 网站的性能优化对于用户的留存率、转化率有很大的影响,所以对于前端开发来说性能优化能力也是重要的考察点。性能优化的点非常的多,有的小伙伴觉得记起来非常的麻烦,所以这里主要梳理出一条线来帮助记忆。可以将性能优化分为两个大的分类:加载时优化运行时优加载时性能顾名思义加载时优化 主要解决的就是让一个网站加载过程更快,比如压缩文件大小、使用CDN加速等方式可以优化加载性能。检查加载性能的指标一般看:白屏时间和首屏时间:白屏时间:指
2021-05-20 09:12:44
448
转载 centox7系统目录介绍
centox7系统目录介绍## /这就是根目录。对你的电脑来说,有且只有一个根目录。所有的东西,我是说所有的东西都是从这里开始。举个例子:当你在终端里输入“/home”,你其实是在告诉电脑,先从/(根目录)开始,再进入到home目录。/root是系统管理员(root user)的目录。对于系统来说,系统管理员就好比是上帝,它能对系统做任何事情,甚至包括删除你的文件。因此,请小心使用root帐号。/bin这里存放了标准的(或者说是缺省的)linux的工具,比如像“ls”、“vi”还有“m
2021-05-20 09:12:37
151
转载 使用pm2+nginx部署koa2(https)
使用pm2+nginx部署koa2(https)今天先来写一下关于 koa2 网站运行部署以及 https 配置。目前网站的大致结构是: koa2 的应用跑在 1113 端口,然后 nginx 反向代理到 443 (https) 端口, 同时 nginx 将 80 (http) 端口转发到 443 (https) 端口。pm2 配置pm2 是开源的基于Nodejs的进程管理器,包括守护进程,监控,日志的一整套完整的功能,基本是Nodejs应用程序不二的守护进程选择,事实上它并不仅仅可以启动No
2021-05-20 09:12:31
990
转载 node 常见10个错误
node 常见10个错误错误 #1:阻塞事件循环JavaScript在 Node.js (就像在浏览器一样) 提供单线程执行环境。这意味着你的程序不能同时执行两部分代码,但能通过 I/O 绑定异步回调函数实现并发。例如:一个来自Node.js 的请求是到数据库引擎获取一些文档,在这同时允许 Node.js 专注于应用程序其它部分:// Trying to fetch an user object from the database. Node.js is free to run other parts
2021-05-20 09:12:25
915
转载 详解 Node.Js 中实现端口重启原理
详解 Node.Js 中实现端口重启原理起源,从官方实例中看多进程共用端口// app.js 自定义我们服务文件const http = require('http') // http模块const server = http.createServer((request, response) => { Math.random() > 0.5 ? aa() : '2' response.end('Hello ')})if (!module.parent) { server.l
2021-05-20 09:12:16
234
转载 小程序access_token服务器存储处理
小程序access_token服务器存储处理适合小程序云开发 也适合h5开发const rp = require("request-promise"); // 发送请求的const APPID = 'wxf6a3e4dfd65f066b'; // appidconst APPSECRET = 'f27efff51cc46b83ca5eb8f66cbd6903' // 小程序的秘钥const URL = `https://api.weixin.qq.com/cgi-bin/token?g
2021-05-19 21:41:28
498
转载 node 爬虫
node 爬虫1:安装 request cheerio2:cheerio 与jquery 使用基本上一样// 爬虫// 1:先有结构 ---> 获取html 解耦股 request // 2: 获取结构中内容 ---> cheeio ---> 与jq 一致// 3:将内容进行数据重组 var request = require('request');var cheeio = require('cheerio');request('https://www.jian
2021-05-19 21:40:40
123
转载 node代理服务器
node代理服务器1.下载http-proxynpm install http-proxy --save-dev2.在项目下面新建一个app.js文件,内容如下:var http = require('http'), httpProxy = require('http-proxy'); // 新建一个代理 Proxy Server 对象 var proxy = httpProxy.createProxyServer({}); // 捕获异常 pr
2021-05-19 21:39:50
825
转载 vue.js的运行机制
vue.js的运行机制引入vue.js,new Vue()干了什么呢?初始化调用Vue原型上的_init()进行初始化,会初始化vue的生命周期,props,data,methods,computed,watch等,最重要的是利用Object.definedPropty()对data对象里面的属性设置setter和getter函数,实现响应式和依赖收集。挂载组件初始化之后调用$mount挂载组件,如果是运行时编译,即不存在render function但是存在template的情况,需要进行【编
2021-05-19 21:38:27
157
转载 VUE的路由模式
VUE的路由模式hash: 使用 URL hash 值来作路由。默认模式。history: 依赖 HTML5 History API 和服务器配置。abstract: 支持所有 JavaScript 运行环境,如 Node.js 服务器端abstract模式是使用一个不依赖于浏览器的浏览历史虚拟管理后端。根据平台差异可以看出,在 Weex 环境中只支持使用 abstract 模式。 不过,vue-router 自身会对环境做校验,如果发现没有浏览器的 API,vue-router 会自动强制进
2021-05-19 21:31:31
189
转载 webpack配置基础篇
webpack配置基础篇这是一个基础篇;后期会出一个高级篇。系统的webpack教程入门中文官网作为项目依赖安装npm install --save-dev webpack@3.5.5最新版本bug太多,这里我们指定3.5.5版本window下若出现问题(Cannot find module 'webpack/lib/node/NodeTemplatePlugin”),则在命令行窗口输入npm config get prefix,会得到输出路径,添加至环境变量即可键:NODE-PAT
2021-05-19 21:25:59
164
转载 babel &es6垫片 polyfill
babel &es6垫片 polyfillBabel 作用编译es678语法。也可以配合其他工具使用例如:gulp webpac也有Babel 不能编译的 可以使用垫片 pollyfill 解决;垫片采用是 es3 进行编写的es6/polyfillPolyfill 可以为旧浏览器提供和标准 API 一样的功能。比如你想要 IE 浏览器实现 Promise 和 fetch 功能,你需要手动引入 es6-promise、whatwg-fetch。而通过 Polyfill.io,你只需要
2021-05-19 21:12:16
565
转载 用Yeoman&generator自定义脚手架
Yeoman&generator自定义脚手架制作属于自己 的脚手架gennerator 的脚手架方式yo命令官网地址:https://yeoman.io/yoyeoman 制作脚手架命令安装npm install -g yoyo 命令的作用是制作脚手架命令yo --version 查看版本号制作脚手架generater-generator 可以制作脚手架工具npm install -g generator-generator生成脚手架工具yo gennerator-脚手
2021-05-19 11:50:49
131
转载 nodeJs中stream流基本概念与常见api
本节主要介绍 stream 的基本概念,以及常见的使用方式 。本节以介绍基本概念为主,其中也会演示部分代码,和 stream 相关的 API 可不必深究,能通过代码看懂语义即可。后续章节会详细介绍这些 API 的原理和使用。开始本节主要内容有:什么是 stream为何要使用 streamstream 流转的过程stream 的常见使用场景什么是 stream在编写代码时,我们应该有一些方法将程序像连接水管一样连接起来 – 当我们需要获取一些数据时,可以去通过"拧"其他的部分来达到目的。这也
2021-05-19 10:44:22
331
1
转载 nodeJs中的stream流
什么是 stream在编写代码时,我们应该有一些方法将程序像连接水管一样连接起来 – 当我们需要获取一些数据时,可以去通过"拧"其他的部分来达到目的。这也应该是 I/O 应有的方式。 – Doug McIlroy. October 11, 1964stream 并不是 node.js 特有的。从早先的 unix 开始,stream 便开始进入了人们的视野,在过去的几十年的时间里,它被证明是一种可依赖的编程方式,它可以将一个大型的系统拆成一些很小的部分,并且让这些部分之间完美地进行合作。因此,只要有 I/
2021-05-19 10:41:14
189
原创 前端面试(上海技术面)(一)
前端面试(上海)(一)(一)基础类型有哪些:基本类型:Number(数值),String(字符串),Boolean(布尔值),Null(空),Undefined(未赋值)引用类型:Array(数组),Object(对象),Function(函数)(二)数组API:toString():将数组返回为字符串join():将数组返回为字符串,参数可替换,逗号。如果不加参数则和toSting一样push():在数组尾部增加一个元素,返回数组长度unshift():在数组头部增加一个元素,返回数组长
2021-05-12 22:28:38
701
原创 Vue中v-if v-else-if v-else(Vue笔记:二)
Vue中v-if v-else-if v-else(Vue笔记:二)v-if控制元素是否被创建:用法:v-if="boolean"参数:可以为任意js数据,隐式转化布尔类型后为false或truefalse:不创建元素,用html注释代替true:创建元素<div id="app"> <!-- v-if="true"才添加h1标签 v-if="flase"就没有h1标签用注释代替 --> <!-- if -->
2021-03-19 00:18:06
254
原创 Vue模版基础语法(Vue笔记:一)
Vue模版基础语法(Vue笔记:一)Vue模版的作用:结合模版中的变量和Vue实例的data实现改变数据改变视图(单向绑定)Vue模版的基础语法:#app元素内部才能使用Vue语法{{数据}} 在Vue模版中数据写在{{}}内,可以与Vue实例data中的数据实现单向绑定,数据改变视图改变el: Vue实例下的对象,value填要挂载的DOM对象如#appdata: Vue实例下的对象,value是Vue中要使用的数据,可以与模版中的{{数据}}实现单向绑定(即数据改变视图也随着改变
2021-03-18 23:45:36
101
原创 HTML属性
HTML属性的特点:HTML元素可以添加属性。 属性可以在元素内添加附加信息。 HTML属性一般放置在开始标签内。 属性总是以名称/值对的形式出现。html属性:使用于大部分标签元素的属性:class:为html元素定义一个或多个类名(classname)。class="element" id:定义元素唯一的id。id="only" style:规定元素的行内样式(inline style)。style="color: red;" title:标题,描述了元素的额外信息(作为.
2021-01-23 10:53:47
206
原创 HTML标签(元素)
常用标签:html标题:<h1>-<h6>标题(Heading)是通过<h1>-<h6>标签进行定义 <h1>为最大标题,<h6>为最小标题 默认样式:标题标签带有上下外边距,撑出元素之间的间距。 块级标签<h1>标题1</h1><h2>标题2</h2><h3>标题3</h3><h4>标题4</h4><h
2021-01-23 10:49:48
952
原创 HTML标签和元素的含义
html标签:html标记标签通常被称为html标签(html tag)。 html标签是由尖括号包围的关键词,列如<html> html标签一般是成对出现的<html>内容</html>,但也有单标签<meat>(没有结束标签)。 双标签的第一个标签是开始标签(开发标签),第二个标签是结束标签(闭合标签)。html元素:“html标签”和“html元素”通常描述的是同一个意思。 每个标签都是一种元素,不同的元素相对应页面的默认布局排列就会不
2021-01-23 10:48:17
415
原创 HTML文档字符编码&语言设置
html文档字符编码&语言设置:编码的重要性:编码可以导致游览器通过ie时候网页乱码,也可以导致css的兼容性Hack。 编码的位置:(一般这段网页编码放在html文件的head标签内的第一行)。 编码的样式:通过charset="UTF-8"中UTF-8就可以改变网页编码。 编码的种类:国内常用的流行编码格式有:gb2312,utf-8这两种,一般这两种类型就可以满足国内所有的网页编码需求。程序和数据 库也会用到这两种编码类型处理网页和储存数据类型。...
2021-01-23 10:47:36
375
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人