前端
王shao
一直在学习
展开
-
重学前端- 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 · 1461 阅读 · 0 评论 -
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 · 292 阅读 · 0 评论 -
各手机适配方案
rem适配(淘宝、百度使用)注意:viewport设置width=device-width,设备独立像素 === 布局视口根字体 = document.documentElement.clientWidth * 100 / 设计稿宽度原创 2021-08-27 22:53:07 · 290 阅读 · 0 评论 -
地铁上看的笔记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 · 147 阅读 · 0 评论 -
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 · 396 阅读 · 0 评论 -
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 · 1064 阅读 · 0 评论 -
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 · 420 阅读 · 0 评论 -
Dart知识点汇总
一、dart语法1.开发工具 Vscode,安装插件:dart、Code Runner2.入口方法 main(){ print('你好,dart'); } // 表示main方法没有返回值 void main(){ print('你好,dart'); }3.Dart变量 dart是一个强大的脚本类语言,可...原创 2020-05-02 18:27:38 · 519 阅读 · 0 评论 -
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 · 206 阅读 · 1 评论 -
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 · 269 阅读 · 0 评论 -
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 · 216 阅读 · 0 评论 -
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 · 773 阅读 · 0 评论 -
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 · 248 阅读 · 0 评论 -
NodeJs基础知识点
1.nodejs的特点1)单线程在Java、PHP等服务器语言中,会为每一个客户端创建一个新的线程,而每个线程需要消耗大约2MB的内存。也就是说,一个8GB的内存可以满足4000人的访问连接,这样就增加了服务器的硬件成本。Nodejs不需要为每个用户的连接创建一个新的线程,而仅仅使用一个线程,一个8GB的内存可以满足40000人的连接。好处:操作系统不会再有创建线程、销毁线程的开销。坏...原创 2020-01-27 20:20:32 · 2459 阅读 · 0 评论 -
webpack配置总结
待更新。。。原创 2020-01-05 19:36:27 · 406 阅读 · 0 评论 -
回顾一下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 · 241 阅读 · 0 评论 -
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 · 143 阅读 · 0 评论 -
网格布局: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 · 542 阅读 · 0 评论 -
原型与原型链总结
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 · 215 阅读 · 0 评论 -
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 · 153 阅读 · 0 评论 -
React生命周期
原创 2019-07-04 17:58:18 · 108 阅读 · 0 评论 -
利用FileReader实现文件读取操作
1.基本知识(FileReader)(1)描述FileReader是HTML5中新增的一个类,用来对input中[文件上传操作]进行处理的类通过该类创建的对象中提供了一些方法,能够对上传的文件进行预先的读写,从而在某种情况下实现预览效果.(2)说明文件读写一般分为三种方式:①文本读取②图片URL读取③二进制流读取(3)语法var fileReader = new FileRead...原创 2019-04-23 21:06:51 · 2511 阅读 · 0 评论 -
js获取一个元素的所有距离值
虽然只是一个简单的方法,知道了可以解决很多问题document.getElementById().getBoundingClientRect()原创 2019-08-03 16:22:52 · 649 阅读 · 0 评论 -
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 · 262 阅读 · 0 评论 -
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 · 197 阅读 · 0 评论 -
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 · 593 阅读 · 0 评论 -
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 · 190 阅读 · 0 评论 -
HTML5拖拽效果
认真看例子,你会看得懂:<body> <ul> <li draggable="true">我</li> <li draggable="true">爱</li> <li draggable="true">你</li> </ul>...原创 2019-08-27 23:35:10 · 148 阅读 · 0 评论 -
总结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 · 3999 阅读 · 0 评论 -
总结:js正则表达式
1.定义正则表达式目的在于处理字符串的查找、验证、修改、替换var reg1 = new RegExp('s','g'); // 构造函数的写法var reg2 = /s\d?/g; // 字面量写法2.正则表达式方法test():判断字符串是否存在符合正则表达式的子字符串,存在返回true,反之返回falseexec():返回一个数组,包括符合正则表达式条件的子字符串的元素和位置...原创 2019-08-30 00:06:43 · 378 阅读 · 0 评论