一些精品的前端学习网站
网站名称
跳转链接
状态
web全栈体系
点击跳转
正在学习中
前端技能图谱
点击跳转
未学习
JavaScript MDN doc
点击跳转
正在学习中
卡颂 React React技术揭秘
点击跳转
正在学习中
VSCODE setting 文件内容被封
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184// setting.json{ "workbench.colorTheme&quo ...
Golang学习 - 项目中,不同package的包内容引入
在刚开始学习golang语言的时候,我们肯定会学习到如何创建一个go程序,并且使用使它能够成功运行,但是项目内容多一点涉及到多个包的时候,这个时候我们在 packge main 中引入其他 package 的内容时,可能会感到疑惑而不知该如何引入,在此记录一下需要如何引入
框架前提 使用go mod 进行项目管理,因此初始的时候通过 go mod init <project-name> 创建一个基础的 mod,在项目中定义的package都可以用这个来引入
1go mod init gin-web
项目架构
main.go
1234567891011121314151617package mainimport ( "gin-web/routes" "github.com/gin-gonic/gin")func main() { r := gin.Default() // 导入路由定义 routes.ImportRoutes(r) r.Run(":8080")}
...
Svelte - 前端框架学习
svelte 中文文档
什么是 SvelteSvelte 是一个构建 web 应用程序的工具。传统框架如 React 和 Vue 在浏览器中需要做大量的工作,而 Svelte 将这些工作放到构建应用程序的编译阶段来处理。
需要注意,Svelte 是一款编译器。它可以将按照规定语法编写的代码打包成浏览器能运行的项目。和其他前端框架一样,同样也是使用 HTML 、CSS 和 JavaScript 进行开发。
使用创建项目1234npm create svelte@latest myapp // 在这一步,我们可以选择创建的项目类型,例如 是否默认使用 TypeScript,是否默认添加 eslint,pre-commit 等cd myappnpm installnpm run dev
创建一个 Svelte 组件Svelte 组件需要我们创建 .svelte 文件,类似于 Vue,一个 .svelte 文件 可以看做是一个单独的组件
.svelte 文件 包含三个部分
script
类似于 Vue 的 Script 标签,可以指定语言 lang="ts",主要用来定 ...
Graphql - 前端知识学习
个人的一些疑问前提:我一直没搞懂后端是如何根据传入的内容去查询的,后端数据库的表是如何设计的,如何根据传入的字段查找出对应的表中的数据,前端的参数传入还可以理解,后端的这一块是真的无法理解
补充说明
经过一段时间的仔细观看后发现,好像每个字段或者说字段所属的对象好像需要自己写查询方法,graphql提供了一些属性方便操作和查询(具体是否如此尚不清楚)
1234567Query: { human(obj, args, context, info) { return context.db.loadHumanByID(args.id).then( userData => new Human(userData) ) }}
obj 上一级对象,如果字段属于根节点查询类型通常不会被使用。
args 可以提供在 GraphQL 查询中传入的参数。
context 会被提供给所有解析器,并且持有重要的上下文信息比如当前登入的用户或者数据库访问对象。
info 一个保存与当前查询相关的字段特定信息以及 schema 详细信息的值, ...
React TypeScript 项目中一些常用的类型定义
一些常用的typescript 类型定义
文件名 [name].d.tssvg 文件123456declare module '*.svg' { import React = require('react') export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>> const src: string export default src}
这样定义完成后,svg 可以作为路径使用,也可以直接作为一个React Component 组件使用
常用的设计模式
工厂模式通过工厂模式,可以让我们使用同一个类时,根据不同传参,创建不同类型的实例以满足我们的需求
123456789101112class Factory { constructor(type, data) { switch(type) { case "type1": return new Type1(data) case "type2": return new Type2(data) default: return new TypeDefault(data) } }}
抽象工厂模式抽象模式主要在与对于类的一些结构进行抽象化处理,如果继承于该类的类直接调用,会抛出错误,需要继承类重新实现这个方法
主要用于对方法的处理,针对我们传入的类添加其他类的抽象方法,并且实现对象方法
1234567891 ...
数组部分方法原理重写
map1234567891011Array.prototye.map = function (cb) { if(typeof cb !== "function") { throw new Error("callback is not function") return } let arr = [] for(let i = 0; i < this.length; i++) { arr.push(cb(this[i])) } return arr}
filter1234567891011121314Array.prototye.filter = function (cb) { if(typeof cb !== "function") { throw new Error("callback is not function") return } let arr = [] ...
个人整理的比较全的知识 - 方便自己回顾
更全的面试题vue 生态面试题
HTML新增的 h5 属性
标签类 header,footer,aside,nav,article
媒体播放标签 audio,video
canvas svg 等
存储属性 localStorage,sessionStorage
input 标签新增type 属性 email,password,file,tel,date,url 等
CSSem/rem/px/vw/vh
em 相对长度单位 是根据当前对象文本的字体尺寸,如果没有设置,则取默认尺寸
rem 相对单位,只根据 HTML 根元素的 font-size的值
px 指的是像素,为绝对单位,不会受到其他单位的影响
vw 屏幕宽度,最大为100,最小为0
vh 屏幕高度,最大为100,最小为0
BFC 块级格式化上下文是块级盒子的布局过程发生的区域,也是浮动元素与其他元素交互的区域。
特性:
块级元素会在垂直方向一个接一个排列
避免子元素的margin 属性影响父元素
保证子元素的属性只在BFC盒内起作用,不会影响盒外的其他元素
触发方式:
float: left/right
positio ...
JavaScript - 手写一个 Promise 方法
手动实现 promise, 下面hi全部的代码,写了差不多有两个小时,并且附上示例
之前也有一版,不过我觉得这一版更好理解一些12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118 ...