- 博客(78)
- 收藏
- 关注
RSS订阅原创 JavaScript迭代器
迭代器的实现首先定义iterator对象function createIterator(items) { var i = 0; return { next: function () { var done = i >= items.length; var value = !done ? items[i++] : undefined; return { done:
2022-04-10 09:52:03
1060
原创 js 二进制中1的个数
由于js中没有整数型数据，所以取余计数个数很繁琐。方法1，利用toString（2）先把数字转换成二进制字符串/** * @param {number} n - a positive integer * @return {number} */var hammingWeight = function (n) { let string = n.toString(2) let count = 0; for (let i = 0; i < string.length; i+
2021-12-22 16:02:09
380
原创 表达数值的字符串(正则解析)
仅是对正则大佬代码的解析。 /** * @param {string} s * @return {boolean} */var isNumber = function (s) { var sd = /^([+-]?((\d*\.\d+)|\d+|(\d+\.\d*)))([eE][+-]?\d+)?$/ //console.log(sd.test(s)) return sd.test(s.trim())};/^表示从头开始。解析第一个括号([+-]?((\d*\.
2021-12-21 21:54:39
121
原创 webpack利用url-loader打包图片
rules: [ { test: /\.(jpg|png|gif)$/, use: { loader: 'url-loader', options:{ name:'[name].[ext]', outputPath:'images/',
2021-10-28 18:54:55
361
原创 webpack的正确安装方式
webpack在项目中安装，就不用纠结于npm安装的默认地址。进入项目目录直接用yarn add webpack webpack-cli -D项目中直接安装webpack不能直接用webpack查看需要利用node提供的npx webpack -v查看项目node-modules中就能直接看见webpack的一堆文件了...
2021-10-27 19:42:24
149
原创 根据对象数组中的属性进行分类
之前之后主要就是根据对象数组中的属性值，对数组进行分类，并且将相同属性值只保留一个。主要方法是根据 这位博主的代码由于该博主没有进行注解，我对它进行了注释。 const groupBy = (array, f) => { let groups = {}; array.forEach(function (o) { var group = JSON.stringify(f(o)); groups[group]
2021-09-25 17:22:07
1120
原创 umi+dva中关于connect的使用
connect就是链接UI组件和model的。有两种方式建议新手使用一，利用connect的参数（mapStateToProps）1.首先找到你要链接的model的命名空间。2.进入UI组件按照文档的说法，Dva（UI文件）成为了一个 被 state 包裹的组件，所以Dva有props的参数。3.state的赋值这是打印mapStateToProps的结果，我们找到我们需要的 dva赋值给我们命名的dva（这个名字是自己命名的）...
2021-09-18 19:32:16
3569
2
原创 umi命令无法将“umi”项识别为 cmdlet、函数。。。
利用yarn 配置的umi脚手架无法使用umi指令是一个什么样的体验？今儿我就带你看看怎么办1.进入此电脑，右击此电脑。2.点开高级系统设置3.点开环境变量。4.找到系统变量中的path变量，点击编辑。5.新建一个，将C:\Users\root\AppData\Local\Yarn\bin加入。6.ctrl+r 加enter...
2021-09-17 22:13:11
4090
2
原创 NavLink中的exact妙用（消除标签页的多渲染）
在使用NavLink对标签页渲染时发现，直接使用不修饰NavLink的话，会出现上图所显示的那样（将url=’/'或者url=其他标签的父路由的标签页一同渲染）。当不想改变其他标签的路由时，利用exact能消除这个副作业（我愿他称为副作用）目前还不知道原因，希望能有大佬指点一手。...
2021-09-17 19:54:54
204
原创 JS 方法和函数中this的指向
let Lesson = { site:'123', lists:[1,2,3], show:function(){ const This = this; console.log(this) return this.lists.map(function(value){ }) }
2021-04-16 17:11:28
225
原创 可选链操作符
function main(config){ const dbHost = config&&config.db&&config.db.host console.log(dbHost) } main({ db:{ host:'192.168.1.100', username:'root'
2021-04-15 21:11:37
245
原创 Async 、Await
Async1.Async函数的返回值为Promise对象2.Promise的结果由Async函数执行的返回值决定Await1.必须写在Async函数中2.Await后面的表达式一般为Promise对象3.Await返回的是Promise成功的值4.Await的Promise 失败了的话，需要通过try…catch捕获//先生成一个Promise。const p = new Promise((resolve,reject)=>{ resolve('成功的值')
2021-04-15 17:10:36
203
原创 ES6 Map函数
Map函数 类似一个升级版的对象，对象名字可以是一个对象。 let m = new Map() m.set('name','123') m.set('change',function(){ console.log('32323') }) let key ={ ab:'456' } m.set(key,['北京','伤害']) console.log
2021-04-15 16:18:01
491
原创 ES6 class静态属性
class Phone{ name = '手机' change(){ console.log('123') } } const p = new Phone() console.log(p.name)在不加static之前，p能获取刀Phone的属性， class Phone{ static name = '手机' ch
2021-04-15 13:33:48
138
原创 hooks useMemo
import React, { useState ,useMemo} from 'react';//useMemo解决反复执行问题useMemo从react引入。{ useMemo}的意思就是从react文件中寻找到与useMemo名字相同的函数。useMemo有两个参数。useMemo（fuc(name)，[name]）//第一个参数的name与第二个参数的name进行比较，当name不一样的时候才执行。实例function Example7(){ const [xiaohong,s
2021-04-10 15:51:29
179
原创 ReactHooks useReducer
计数器的增加功能import React, { useReducer } from 'react';function ReducerDemo(){ const [count , dispatch] = useReducer((state,action)=>{ switch(action){ case 'add': return state+1 case 'sub':
2021-04-09 19:48:26
91
原创 ReactHooks useContenxt 父子传值
import React, { useState, createContext ,useContext} from 'react';const CountContext = createContext();//创建上下文，利用provider提供值function Counter(){//子组件 let count = useContext(CountContext) return(<h2>{count}</h2>)}function Example4(
2021-04-08 17:12:24
376
原创 React Hooks useEffect绑定与解绑
import React, { useState , useEffect} from 'react';import {BrowserRouter as Router , Route,Link} from 'react-router-dom'function Index(){ useEffect(()=>{ console.log('userEffect=>老弟，你来了 Index') return ()=>{ conso
2021-04-08 16:44:01
699
原创 ReactHooks useEffect代替周期函数
非hooks写法import React, { Component } from 'react';class Example3 extends Component { constructor(props) { super(props); this.state = { count:0 } } componentDidMount(){ console.log(`componentDidMount
2021-04-08 16:16:44
117
原创 React Router 的 路由嵌套
文件目录index.jsimport React from 'react';import ReactDOM from 'react-dom';import AppRouter from './AppRouter'ReactDOM.render( <AppRouter />, document.getElementById('root'));引入AppRouterAppRouter.js引入目录import React from 'react'import{
2021-03-27 17:15:10
299
原创 简单的 React Router 例子
文件目录index.js(主)固定格式import React from 'react'import ReactDOM from 'react-dom'import AppRouter from './AppRouter'ReactDOM.render(<AppRouter />,document.getElementById('root'))AppRouterimport React from 'react'import{BrowserRouter as Route..
2021-03-27 15:28:20
211
原创 枯燥的Redux 完成todolist
文件目录Index.jsimport React from 'react';import ReactDOM from 'react-dom';import Todolist from './Todolist'//以上都是固定格式import {Provider} from 'react-redux'//被provider包裹的都可以获得store里面的值import store from './store'const App = (//提供器,包裹所有需要的组件 <Prov
2021-03-27 10:51:24
109
原创 枯燥的React 实现todolist（技术胖笔记）
Xiaojiejie.jsimport axios from 'axios'// npm install -save axios 安装import React,{Component,Fragment} from 'react'import './style.css'import XiaojiejieItem from './XiaojiejieItem'import Boss from './Boss'import{CSSTransition,Transition,TransitionGro.
2021-03-19 20:40:08
158
1
原创 利用reduce实现文字LOGO效果
<style> *{padding: 0;margin: 0;} body{ width: 100vw;//vw,vh会适配显示空间的大小，会跟随页面的增减而改变。 height: 100vh; display: flex; justify-content: center; align-items: center; background-color: #34495e; }
2021-03-18 15:02:17
68
原创 枯燥的js 数组
字符串转换为数组let str = "asdasdas"; console.log(str.split("")); console.log(Array.from(str));Array.from <div>hdcms</div> <div>houdsd</div> <script> let div = document.querySelectorAll('div'); co
2021-03-13 14:07:51
195
原创 枯燥的js 时间戳
转换时间戳const date = new Date("1997-7-12 08:22:12"); console.log(date); console.log(date*1); console.log(Number(date)); console.log(date.valueOf()); console.log(date.getTime());时间戳转换为时间const date = new Date(); co
2021-03-11 17:18:45
54
原创 枯燥的js Number
控制小数位数var temp =2.23123;console.log(temp.toFixed(2));满足四舍五入。字符串里面提取小数 let hd = "2323.223sdsd"; console.log(parseFloat(hd));let hd = "cmd2323.223sdsd"; console.log(parseFloat(hd));但当字符串最开始是以字符，就没法识别。数组转换为数字数组仅对数组只有一个元素成立，多个元素不知道取用那个。
2021-03-11 16:51:19
67
原创 枯燥的js Boolean
const boolean = new Boolean(false); console.log(typeof boolean); console.log(boolean.valueOf());注意boolean是一个对象console.log(Boolean([]));//空数组的布尔值为真 var array = []; console.log(Number(array)); console.log(array==fals
2021-03-11 15:42:04
48
原创 常用的标签模板
<script> let lessons = [ {title:"123",author:"321"}, {title:"zxc",author:"cxz"}, {title:"qwer",author:"rewq"} ] function template(){ return `<ul> ${lessons
2021-03-10 21:39:29
139
原创 枯燥的js 电话号码模糊处理
<script> function phone(mobile,len){ return String(mobile).slice(0,len*-1)+"*".repeat(len); } console.log(phone(12312312312,5)); </script>先把电话号码转换为字符串，再利用slice
2021-03-10 21:24:01
283
原创 枯燥的js 字符串函数
<script> let name = "zyqqwe" console.log(name.length); console.log(name.toUpperCase()); console.log(name.toLowerCase()); let site = " 23123 "; console.log(site.length); console.log(site.trim().length)
2021-03-10 21:15:37
67
原创 枯燥的js 字面量嵌套
function show(){ return '23123'; } let hd = `www.${show()}`; console.log(hd);<script> let lessons = [ {title:"123"}, {title:"234"}, {title:"456"} ]; /.
2021-03-10 10:36:03
74
原创 枯燥的js for of 小应用
<style> ul{ list-style: none; } li{ border: solid 1px #ddd; height: 50px; width: 200px; } </style> <ul> <li></li> <li&g
2021-03-09 21:10:05
49
原创 枯燥的js object 冻结变量
const HOST = { url:"23123122", port:443 }; Object.freeze(HOST); HOST.port = 69; console.log(HOST);
2021-03-09 11:04:37
109
原创 var 与let 的区别
<script> function test(){ for(var i =0 ;i<5;i++){ // let console.log(i); } console.log(i); } test(); </script>i是在for循环里面定义的一个局部变量，按理来说并不会出现第6个值这就是var
2021-03-09 10:34:04
74
原创 枯燥的js php
请求PHPGET<button id="button">获取PHP数据</button> <br><br> <h1>正常表单提取数据到PHP</h1> <form action="https://api.vvhan.com/api/saorao?tel=1365655656" method="GET"> <input type="text" n
2021-03-07 14:05:39
106
原创 枯燥的ajax纯文本
请求纯文本数据<h2>AJAX</h2> <button type="button" onclick="loadXMLDoc()">请求数据</button> <div id="myDiv"></div> <script> document.getElementsByTagName("button")[0]; function
2021-03-07 13:43:57
97
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人