- 博客(40)
- 收藏
- 关注
RSS订阅原创 重学前端- typescript
一、Typescript开发环境搭建1.下载安装nodejs2.全局安装typescript 「npm i -g typescript」3.创建一个test.ts文件，使用tsc test.ts命令进行编译二、TS类型申明let a: number;let b: string;// 如果变量的申明和赋值是同时进行的，TS可以自动对变量进行类型检测let c: boolean = true;function sum(a: number, b: number): number {
2022-04-24 00:11:03
1351
原创 css实现简单选项卡功能
<!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"> <style>
2021-09-08 22:11:31
258
原创 各手机适配方案
rem适配(淘宝、百度使用)注意：viewport设置width=device-width，设备独立像素 === 布局视口根字体 = document.documentElement.clientWidth * 100 / 设计稿宽度
2021-08-27 22:53:07
253
原创 React脚手架移动端适配方案
1.初始化脚手架create-react-app hello_react2.安装依赖yarn add postcss-px2rem customize-cra react-app-rewired3.根目录下建立config-overrides.jsconst { override, addPostcssPlugins } = require('customize-cra')module.exports = { // 375 是设计稿宽度 addPostcssPlugins([require(
2021-08-13 23:43:27
346
1
原创 地铁上看的笔记1
一/** * JS数据类型精讲和typeof底层机制 * 原始值类型 * number, NaN Infinity * string * boolean * null * undefined * symbol * Symbol.iterator: for of 循环的底层处理方法 * Symbol.toStringTag: Object.prototype.toString.call()
2021-04-11 20:17:43
130
原创 typescript
导读：ts笔记 https://juejin.cn/post/69274527472182886541.ts的优势(1)类型化思维方式，使得开发更加谨慎，提前发现bug，减少改bug的时间(2)类型系统提高了代码的可读性，并使得维护和重构代码更加容易(3)补充了接口、枚举等大型应用时JS缺失的功能2.安装解析TS安装包(1)为什么要安装这个工具包Nodejs/浏览器，只认识js代码，不认识ts代码(2)安装解析ts工具包步骤第一步：npm install -g typescript ts
2021-03-18 22:33:55
120
原创 react-hooks
1.useStateimport React, { useState } from 'react'const ClickCount = () => { const [count, setCount] = useState(0) const [info, setInfo] = useState({ name: 'wq', age: 0 }) const handleClick = () => { setCount(count+1) set
2021-02-27 21:54:22
141
原创 从0实现React(利用parcel)
1.准备工作 1)全局安装parcel npm i -g parcel-bundler 2)新建项目 mkdir react-simple 在文件夹下新建 index.html index.js index.html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" con
2020-09-06 19:20:50
141
原创 flutter扩展功能
1. Android中实现消息推送、指定设备推送 第三方包： jpush_flutter 实例： import 'package:flutter/material.dart'; import 'package:jpush_flutter/jpush_flutter.dart'; class ExamplePage extends StatefulWidget { Map arguments; Exam
2020-06-05 11:46:19
372
原创 flutter 高级
1.下拉刷新、上拉加载 在flutter官方sdk中给我们提供了下拉刷新组件RefreshIndicator，但是没有提供上拉分页加载。 但是在Flutter ListView中有一个ScrollController属性，来判断是否滚动到底部来做加载更多 下拉刷新： import 'package:flutter/material.dart'; import 'package:dio/dio.dart'; import 'dart:c
2020-05-18 22:58:12
994
原创 flutter知识点总结
1.Windows搭建Flutter Android运行环境 (1)电脑上安装配置java JDK (2)电脑上安装Android Studio (3)电脑上安装配置Flutter SDK (4)电脑上配置Flutter国内镜像 FLUTTER_STORAGE_BASE_URL：https://storage.flutter-io.cn ...
2020-05-05 19:27:05
381
原创 Dart知识点汇总
一、dart语法1.开发工具 Vscode，安装插件：dart、Code Runner2.入口方法 main(){ print('你好，dart'); } // 表示main方法没有返回值 void main(){ print('你好，dart'); }3.Dart变量 dart是一个强大的脚本类语言，可...
2020-05-02 18:27:38
485
原创 CSS3新特性总结
一、新增的选择器1. :first-of-type()：选择该类型元素的第一个子元素 p:first-of-type{ color: yellow; }2. :last-of-type()：选择该类型元素的最后一个元素 P:last-of-type{ color: blue; }3...
2020-04-19 16:04:34
156
1
原创 HTML5 音频 视频
1.video元素的使用<video id='video' src='https://rocketsystem.oss-cn-shanghai.aliyuncs.com/TraingProgram/Medias/2310f8364bc3413ca5f86e36622b3fa1_%E5%B0%8F%E7%8B%97%E6%95%A3%E6%AD%A5.mp4' cont...
2020-04-10 12:51:22
206
原创 Electron基础总结
1. 写hello world 1) git clone https://github.com/electron/electron-quick-start 2) cnpm install 3) npm start 注意：在生成好的main.js中添加 webPreferences: { preload: pa...
2020-04-05 11:23:43
231
原创 TypeScript基础总结
1.typescript下载 编译npm install -g typescript新建 index.ts编译：tsc index.ts ; 会生成一个index.js文件2.vsvode 配置自动编译ts文件 (1)tsc --init 生成一个tsconfig.json文件 (2)修改tsconfig.json中outDir为'./js' (3)Termin...
2020-03-29 22:40:37
187
原创 Less与Scss基础总结
一、LESS1.变量// 变量作为属性@color : red;.setting{ color:@color}// 变量作为选择器和属性名@width:width;.@{width}{ @{width}:200px; height: 100px; background-color: @color;}2.混合(mixins)// 1)一般混合...
2020-02-28 15:40:28
742
原创 React查缺补漏
1.React.createElement：根据指定的第一个参数创建一个React元素第一个参数是必填，传入的是似HTML标签名称，eg: ul, li第二个参数是选填，表示的是属性，eg: className第三个参数是选填, 子节点，eg: 要显示的文本内容class App extends React.Component{ render(){ return (...
2020-02-18 11:10:04
235
原创 NodeJs基础知识点
1.nodejs的特点1)单线程在Java、PHP等服务器语言中，会为每一个客户端创建一个新的线程，而每个线程需要消耗大约2MB的内存。也就是说，一个8GB的内存可以满足4000人的访问连接，这样就增加了服务器的硬件成本。Nodejs不需要为每个用户的连接创建一个新的线程，而仅仅使用一个线程，一个8GB的内存可以满足40000人的连接。好处：操作系统不会再有创建线程、销毁线程的开销。坏...
2020-01-27 20:20:32
2436
原创 回顾一下ajax并且node连接前后端
1.短连接与长连接短连接：通过客户端与服务器握手，并且发送数据，服务器处理完数据返回客户端之后断开连接长连接：通过客户端和服务器握手后，两方不再断开连接，数据可以相互发送2.前端与node通信(1)get请求let xhr = new XMLHttpRequest();xhr.open('GET','http://192.168.124.15:3003?user=wq&age=...
2020-01-01 17:08:59
225
原创 Proxy与Reflect
1.每个代理陷阱对应一个命名和参数都相同的Reflect方法代码： let obj = { time: '2019-03-11', name: 'net', _r:123 } let monitor = new Proxy(obj,{ // 拦截对象属性的读取 ...
2019-12-14 12:42:01
130
原创 网格布局：display:grid
1.grid-template-columns ： 列属性grid-template-rows：行属性 #site{ color: white; display: grid; /* 把列分为3列，每列占1等分，可以使用repeat减少代码的重复 */ // grid-template-colum...
2019-12-08 16:16:14
482
原创 原型与原型链总结
1.函数的prototype属性(1)每个函数都有一个prototype属性，它默认指向一个Object空对象(原型对象)console.log(Date.prototype,typeof Date.prototype);(2)原型对象中有一个属性constructor，它指向函数对象console.log(Date.prototype.constructor === Date); ...
2019-10-13 22:51:28
198
原创 总结：Git常用命令
1.简介Git是目前世界上最先进的分布式版本控制系统(没有之一)工作区----git add---->缓存区----git commit---->版本库2.命令(1)配置 配置用户名：git config --global user.name '用户名' 配置邮箱：git config --global user.email '邮箱账号'(2)将文件添加到仓库 git ...
2019-09-01 15:30:28
74
原创 ES6: Symbol/解构赋值/set和map/Generators函数/Promise/异步等待/字符串扩展方法
1.Symbol说明：ES5的对象属性名都是字符串，这容易造成属性名的冲突。比如你使用了一个他人提供的方法，但又想为这个对象添加新的方法，新方法的名字就有可能与现有方法产生冲突，如果有一种机制，保证每个属性的名字都是独一无二的，这样就从根本上防止属性名的冲突，这就是ES6引入Symbol的原因， 主要被用于定义常量消除魔法字符串： const EVENT_ID = Symbol(); ...
2019-08-31 22:12:14
267
原创 总结：js正则表达式
1.定义正则表达式目的在于处理字符串的查找、验证、修改、替换var reg1 = new RegExp('s','g'); // 构造函数的写法var reg2 = /s\d?/g; // 字面量写法2.正则表达式方法test():判断字符串是否存在符合正则表达式的子字符串，存在返回true，反之返回falseexec():返回一个数组，包括符合正则表达式条件的子字符串的元素和位置...
2019-08-30 00:06:43
340
原创 总结momentjs中最为常用的时间操作方法
1.获取时间moment().get('year'):获取当前的年份 2019moment().get('month'):获取当前的月份 (0-11)moment().get('date'):获取当前的号数 29moment().get('hour'):获取当前的小时 15 (0-24)moment().get('minute'):获取当前的分钟数 54moment().get('s...
2019-08-29 16:57:05
3932
原创 HTML5拖拽效果
认真看例子，你会看得懂：<body> <ul> <li draggable="true">我</li> <li draggable="true">爱</li> <li draggable="true">你</li> </ul>...
2019-08-27 23:35:10
128
原创 MySQL命令总结(一天搞定MySQL操作)
1.启动/关闭MySQL服务net start mysql / net stop mysql2.连接MySQL(root表示用户名)mysql -u root -p3.查看版本select version();4.显示当前时间select now();5.远程连接mysql -h IP地址 -u 用户名 -p6.创建数据库create database 数据库名 c...
2019-08-25 16:07:54
207
原创 HTML5地理位置定位功能、HTML5桌面提醒功能、HTML5本地存储之数据库、HTML5离线存储
1.HTML5地理位置定位功能if(navigator.geolocation){ navigator.geolocation.getCurrentPosition( function success(position){ console.log('经度：',position.coords.longitude); c...
2019-08-24 16:33:05
183
原创 js中apply、call、bind三者的用法与区别
1.call，apply，bind的定义apply：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.apply(A, arguments);即A对象应用B对象的方法。call：调用一个对象的一个方法，用另一个对象替换当前对象。例如：B.call(A, args1,args2);即A对象调用B对象的方法。bind：创建一个新的函数（称为绑定函数）, 当被调用时，将其this关键字设...
2019-08-18 11:40:12
200
原创 js 总结object常用方法
1.Object.assgin(target,source1,source2)该方法主要用于对象的合并，将源对象source的所有可枚举属性合并到目标对象target上,此方法只拷贝源对象的自身属性，不拷贝继承的属性 let obj1={ name:'wq', age:21 } let obj2={ name:'zy', age:21,love:['play','drink']}...
2019-08-18 00:19:01
156
原创 js 判断数据类型Object.prototype.toString.call()
在JS中，可以通过Object.prototype.toString方法，判断某个对象之属于哪种内置类型。分为null、string、boolean、number、undefined、array、function、object、date、math。1.判断基本数据类型 Object.prototype.toString.call(null); // "[object Null]" Obje...
2019-08-17 15:31:50
576
原创 js webworkers与websocket
1.webworkers<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <me...
2019-08-04 12:28:30
687
原创 js自定义事件与nodejs事件
// 最简单创建事件的方法，使用Event构造器let myEvent = new Event(‘show’);// 创建带参数的自定义事件let parmEvent = new CustomEvent('showParm',{ detail:{ parm:'王清最帅' }})window.addEventListener('showParm',(eve...
2019-08-03 17:26:53
242
原创 js获取一个元素的所有距离值
虽然只是一个简单的方法，知道了可以解决很多问题document.getElementById().getBoundingClientRect()
2019-08-03 16:22:52
636
原创 js 设置cookie
#1.代码实例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...
2019-08-03 16:16:10
121
原创 利用FileReader实现文件读取操作
1.基本知识(FileReader)(1)描述FileReader是HTML5中新增的一个类，用来对input中[文件上传操作]进行处理的类通过该类创建的对象中提供了一些方法，能够对上传的文件进行预先的读写，从而在某种情况下实现预览效果.(2)说明文件读写一般分为三种方式:①文本读取②图片URL读取③二进制流读取(3)语法var fileReader = new FileRead...
2019-04-23 21:06:51
2465
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人