- 博客(20)
- 资源 (2)
- 收藏
- 关注
原创 JavaScript 实用工具函数
1. 数字操作(1)生成指定范围随机数export const randomNum = (min,max) => Math.floor(Math.random() * (max - min + 1)) + min (2)数字千分位分隔export const format = (n) => { let num = n.toString(); let len = num.length; if (len <= 3) { return num;
2022-01-14 14:00:17 256
原创 react、vue中的key有什么作用?(key的内部原理)
react、vue中的key有什么作用?(key的内部原理) <div id="root"> <h2>人员列表</h2> <button @click.once="add">添加一个小红(分别使用id和index测试下即可看出区别)</button> <ul> <li v-for="(item,index) in personList" :key="index"> {{item.name}}-{{
2021-10-18 17:56:54 108
原创 TypeScript-使用webpack打包ts代码
1. 使用webpack打包ts代码通常情况下,实际开发中我们都需要使用构建工具对代码进行打包,TS同样也可以结合构建工具一起使用,下边以webpack为例介绍一下如何结合构建工具使用TS。步骤:初始化项目- 进入项目根目录,执行命令 npm init -y- 主要作用:创建package.json文件下载构建工具npm i -D webpack webpack-cli webpack-dev-server typescript ts-loader clean-webpack-plugi
2021-08-05 16:53:16 189
原创 TypeScript-快速入门
0、TypeScript简介TypeScript是JavaScript的超集。它对JS进行了扩展,向JS中引入了类型的概念,并添加了许多新的特性。TS代码需要通过编译器编译为JS,然后再交由JS解析器执行。TS完全兼容JS,换言之,任何的JS代码都可以直接当成JS使用。相较于JS而言,TS拥有了静态类型,更加严格的语法,更强大的功能;TS可以在代码执行前就完成代码的检查,减小了运行时异常的出现的几率;TS代码可以编译为任意版本的JS代码,可有效解决不同JS运行环境的兼容问题;同样的功能,TS的代
2021-08-05 16:08:31 126
原创 事件 参考问题
学习教材为:https://wangdoc.com/javascript/events/index.html事件的本质是什么?事件的本质是程序各个组成部分之间的一种通信方式,也是异步编程的一种实现。EventTarget接口有哪几个实例方法?List item:addEventListener:绑定事件的监听函数;removeEventListener:移除事件的监听函数;dispatchEvent:触发事件。什么是浏览器的事件模型?浏览器的事件模型,就是通过监听函数(listener)
2021-06-15 01:09:11 259
原创 Vue装饰器写法-vue-class-component
Vue装饰器写法依赖库介绍vue-property-derocator (官方文档)在Vue中使用TypeScript时,非常好用的一个库,使用装饰器来简化书写,下列是它提供的一下装饰器。1.安装 npm i -S vue-property-decorator@Prop@PropSync@Emit@Model@Watch@Provide@Inject@Component(来自vue-class-component库的vue-class-component)Mixins方法(来自v
2021-06-02 15:42:51 2109
原创 react实现简易的todolist
1.受控元素实现todolist import {render} from 'react-dom' import React,{Component} from 'react' class ToDoList extends Component{ state = { title:"记录", name:'王', message:'哈哈哈哈', list:[], // {id:1,name:'王',message:'
2021-04-06 10:16:12 288
原创 react基础-列表渲染-条件渲染-refs-受控元素-非受控元素
1 列表渲染//对象 数组 string 数字this.props|state.属性名.map(function(val,index){return jsx}) import {render} from "react-dom"; import {Component} from 'react' class Demo extends Component{ state = { str: "bmw", num: 10,
2021-04-01 23:19:19 164
原创 react基础-组件-props-事件-组件状态
1. 组件react组件:函数式组件和api式组件(不常用)和类式组件// 1.函数式组件 import { render } from 'react-dom' function Header() { return( <div> <span>LOGO</span> <nav> <a href="/">a</a>
2021-03-31 23:52:36 300
原创 react介绍及使用脚手架搭建项目
介绍一款javascript前端框架,把用户界面抽象成一个个的组件,按需组合成页面,官网,与其他框架的共同点是,都采用虚拟dom,和数据驱动开始使用可以使用yarn或者npm创建 react项目(也可以使用WebStorm直接创建 )create-react-app 目录 | npx create-react-app 目录 (直接使用脚手架创建)yarn eject 解构出所有的配置文件 可选yarn start | npm start 开发yarn build | ..
2021-03-30 23:45:32 177
原创 MongoDB的基础使用及node中的使用
一、介绍MongoDB 是一个基于分布式文件存储的数据库。由 C++ 语言编写,是一个开源数据库系统。旨在为 WEB 应用提供可扩展的高性能数据存储解决方案。MongoDB 是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的。MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成。MongoDB 文档类似于 JSON 对象。字段值可以包含其他文档,数组及文档数组。在高负载的情况下,添加更多的节点,可以保证服务器性能。
2021-02-25 20:22:09 142
原创 node基础-使用node的内置模块
1.node的内置模块 - httphttp模块-----服务器模块(后端)功能: 搭建服务器 完成服务器功能 发起请求(类似ajax) --- 不会产生跨域 node中全面支持es6 const http = require("http");// console.log(http);// 创建一个服务器,返回一个服务对象const serverObj = http.createServer((req, res)=>{ // 所有的服务器逻辑 // req:req
2021-01-28 11:46:55 171 1
原创 Node基础
一 node的介绍node.js是服务端语言,是后端语言Node.js使用的是ECMAScript的语法后端语言如php,如java,如python特点对于前端工程师相对来说学习成本比较低性能相对比较高,node的服务器比php的服务器速度提升了86倍学习资源较少,缺口比较大,中小企业考虑成本问题需求较小单线程异步执行,事件的处理机制运行在v8引擎中node.js的源代码是由c语言构成,采用的是ECMAScript的语法进行编程,运行在v8引擎中下载node官网:ht
2021-01-27 20:36:49 79
原创 BFC介绍
BFC定义BFC(Block formatting context)直译为"块级格式化上下文"BFC是格式化上下文,独立的渲染区域,就是规定块元素的布局排版规则.BFC触发条件根元素html;overflow不为visible;float不为none;position为absolute或fixed;display为inline-block、table-cell、flex、table-caption或者inline-flexBFC的布局规则上下排列,垂直显示两个盒子上下的margi
2021-01-26 22:39:22 131
原创 js拖拽
拖拽<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .box{width:100p
2021-01-26 14:18:30 89
原创 ES6新增的Promise
回调地狱:在使用JavaScript时,为了实现某些逻辑经常会写出层层嵌套的回调函数,如果嵌套过多,会极大影响代码可读性和逻辑,这种情况也被成为回调地狱。代码阅读性非常差浪费性能不方便维护// 三十个不同请求,同时拿到所有的数据 ajax("",function(res1){ ajax("",function(res2){ ajax("",function(res3){ ajax("",function(re.
2021-01-21 23:55:57 139
原创 JavaScript中继承的方式
一 继承让一个不具有某些功能或属性的类或对象,通过某些方式使用另一个具有这些功能或属性的类或对象的功能或属性var obj1 = { name:"amdin", show:function(){ console.log(this.name) }}var obj2={ name:"root"}obj1.show();obj1.show.call(obj2);构造函数继承(改变this指向继承)简单方便多继承只能继承构造函数内部属性或方法,无法继承原型身上的属性或方法
2021-01-20 21:13:54 88
原创 本地存储(cookie\localStorage\sessionStorage)
cookie详解cookie是一种最原始也是最简单的一种存储方式,是用来记录每次http的连接产生的信息或数据,并在下次http连接时,一起发送给服务器.cookie的特点在浏览器缓存中只能存文本(字符)大小有限制:4k~条数限制:50条~时间限制:默认是会话级别(关闭浏览器自动删除),可以设置指定的时间不允许跨域:同源策略,浏览器,路径一般情况下,cookie需要在服务器环境下使用cookie值的要求必须是:名字和值必须是字符名字和值中不允许出现特殊字符一行代码只能设置一
2021-01-18 23:37:18 134
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人