- 博客(59)
- 收藏
- 关注
RSS订阅原创 react之redux
一.redux1.redux是什么？2.什么情况下使用3.redux核心applyMiddleware:applyMiddelware(thunk)使可以发送异步actioncombineReducers:合并多个reducercreateStore():创建包含指定reducer的store对象使用：createStore( reducer ,applyMiddelware(thunk))store对象内部会第一次调用reducer函数得到初始化多个reduc
2020-10-21 22:31:32
200
原创 react之基础篇3
一.组件间通信的两种方式1.props方式2.使用消息订阅–发布机制订阅：绑定监听发布：触发事件（发布事件）3.redux二.react-router1.SPA2.路由npm i react-router-dom --save(使用的是web版本的)router:路由器（用来注册路由的）route:路由（是一个映射关系）NavLink:类似a标签（存在一个属性：activeClassName用来设置样式类名）Switch:表示匹配其中的一个路由3.嵌套路由
2020-10-21 22:23:15
145
原创 react之基础篇2
一.受控组件与非受控组件[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WDcrvvRO-1603202913026)(C:\Users\Administrator\AppData\Roaming\Typora\typora-user-images\1602753554188.png)]受控组件：标签值改变直接改变组件的状态非受控组件：类似用户名所对应标签二。组件的生命周期 父组件render()[外链图片转存失败,源站可
2020-10-21 22:14:26
131
原创 react之基础篇1
一.虚拟dom创建方式：1.<script type='text/javascript'> const getNew=react.createElement('name',{id},'content') ReactDom.render(getNew,document.getElementById('id'));//渲染</script> 2.<script type='text/babel'>//浏览器不能直接解析JSX代码，需
2020-10-21 22:07:42
140
原创 响应式布局之基础篇
index.js<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <link rel="stylesheet" href="css/index.css"> &
2020-09-15 17:34:34
135
原创 项目中管理console.log
一：1.线上项目中下载依赖npm install babel-plugin-transform-remove-console --save-dev2.在babel.config.js中plugins 'transform-remove-console' 二：关闭所有的console.log，保证console.log只在测试环境下方案一：使用text编辑器将所有的console.log()替换成//console.log()方案二：覆盖console.logconsole.lo
2020-07-05 10:18:01
3510
原创 Js封装extend方法
<script type="text/javascript"> //$.extend //eg:var obj1={};var obj2={name:'张三'};var obj3={gender:'男'} //eg: $.extend(obj1,obj2,obj3);将obj2与obj3一一遍历添加到obj1 (function(global){ function jquery(selectors){ return new jquery.fn.init(se
2020-06-16 22:43:18
724
原创 JS库封装改进的简化
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div>1</div> <div>2</div> <p>3</p> <span id="spa">4</span> &
2020-06-16 16:52:41
151
原创 JS库封装的改进
改进的地方：//jquery内部封装了一个Sizzle引擎来获取DOM元素document.querySelectorAll(selectors);//jquery为了后续操作DOM元素方便，将dom元素放在了实例对象身上//类似数组，可以用for遍历，称为伪数组for(var i=0;i<elements.length;i++){this[i]=elements[i];//给this创建属性从0开始的i}<!DOCTYPE html><html> <
2020-06-16 16:50:56
141
原创 Js库的封装
<body> <div>1</div> <div>2</div> </body> <script type="text/javascript"> //定义一个自调函数 (function(global){ //global保留了window对象的引用 //1.定义 jquery()方法,返回元素 function jquery(selectors){ //方法一： var e
2020-06-16 16:38:56
356
原创 JS中的同步及异步
JavaScript是单线程，因此同个时间只能处理同个任务所有任务都需要排队，前一个任务执行完，才能继续执行下一个任务。但是，如果前一个任务的执行时间很长，比如文件的读取操作或ajax操作，后一个任务就不得不等着，用户只能在那里干等着，严重影响用户体验。 因此，JavaScript在设计的时候，就已经考虑到这个问题， 主线程可以完全不用等待文件的读取完毕或ajax的加载成功，可以先挂起处于等待中的任务，先运行排在后面的任务，等到文件的读取或ajax有了结果后，再回过头执行挂起的任务
2020-06-15 22:58:51
236
原创 JS中的this指向
首先我们应该明白js中的this是在代码运行期进行绑定的，这也是js中的this具备多重含义的原因。window中的方法就是全局函数，window中的属性就是全局变量。在es6之前，this的指向取决于函数的调用方式，有以下几种调用方式：1.函数调用2.方法调用3.构造函数的调用4.上下文的调用方式//函数调用方式<script> //eg1: var obj={ a:23, say:function(){ console.log(this.a);
2020-06-15 16:01:58
163
原创 jquery常用方法的原生
/*jQuery封装*///$window.$ = HTMLElement.prototype.$ = function(selector) { var elems = (this == window ? document : this).querySelectorAll(selector); return elems.length == 0 ? null : elems.length ...
2020-03-22 10:19:17
208
原创 Angular
介绍Angular.js是google开发者设计和开发的一套前端开发框架，帮助你简化前端开发的负担。AngularJS 通过新的属性和表达式扩展了 HTML。AngularJS 可以构建一个单一页面应用程序AngularJS的优点：1.良好的应用程序结构：通常情况下，我们编写 JavaScript 没有明确的结构。虽然在编写小应用程序的时候没有问题，但这显然是不适合于大规模的应用程序。...
2019-12-31 21:56:49
333
1
原创 nodeJS+express实现Web的增删改查
项目需要创建的文件 index.js（创建的入口函数） router.js（存放路由相关模块） service.js（存放业务逻辑模块） data.json（用来存放数据的文件，存放的格式：[ obj1,obj2,.....]） views（存放模板文件 后缀为.art） public（存储静态文件） package,json(输入指令：npm init -y...
2019-08-22 10:30:28
651
原创 art-template及express框架
一. 使用art-template模板时 创建入口文件（index.js 注：所有的模板写在views目录中） 需要搭建模板引擎：package.json(在控制台输入指令：npm init -y) 引入模板：art-template(指令：npm install art-template --save) 在入口文件中添加模板引擎的代码段// 模板引擎var template =...
2019-08-21 18:20:32
335
原创 Web项目的搭建
补充上一篇内容：重点: post参数处理 以及get参数处理get参数处理===> url模块 url.parse()====>将url字符串转换为 json类型的对象 属性: query ===>存放传输的数据 true值 用来设置 query的格式 为 json格式 url.format(); ====>将json转换为字符串pos...
2019-08-21 17:15:22
266
原创 post,get参数传递与获取
/*登录验证功能*/const http=require('http');const url=require('url');const querystring=require('querystring');const ss=require('./06.js');const path=require('path');const fs=require('fs');let readFil...
2019-08-21 17:03:13
249
原创 Buffer基本操作和路径API
一。1.nsole.log(process.argv);参数一：nodejs环境的路径；参数二表示：当前执行的js文件全 路径//console.log(process.arch);打印当前系统的架构x642…nodejs是模块化开发； 如何定义一个模块：一个JS文件即一个模块（当模块名相同时，只加载最前面的文件） 模块内部成员相互独立 模块成员的导出和导入 导入：var...
2019-08-16 00:20:25
368
原创 ES6字符串相关拓展及文件操作案例
1.字符串相关扩展 */ let str="hello world"; console.log(str.includes('world',6));//返回true console.log(str.startsWith('he')); console.log(str.endsWith('d'));2.模板字符串// let obj={username:'哈哈',age:18};// ...
2019-08-14 23:54:30
159
原创 ES6的类与继承，箭头函数
class Person{ //类的构造函数，在new Person的时候自动进行调用； //构造函数的作用：用于对实例进行初始化； constructor(name,age){ this.name=name; this.age=age; } say(){ console.log(this.name); }}var person=new Person('张三',23);...
2019-08-14 23:45:17
662
原创 H5新增API
一. 全屏显示<script> //判断浏览器是否正常兼容// var img=document.querySelector("#imgs"); var img=document.querySelector("div"); var btn=document.querySelector(".big"); btn.onclick=function(){ if(img.req...
2019-08-05 23:54:03
407
原创 ajax初识
一. 什么是ajax？异步的Javascript和xml(asynchronous javascript and xml)二，ajax的作用负责与后端交互异步：同时进行的(前端进行的同时后端也在进行)同步：不同时进行（完成一件事后在做另一件事，是有顺序的）三.ajax的核心对象核心对象是:XMLHttpRequest步骤：a)创建对象 var xhr=new XMLHttp...
2019-07-30 09:31:39
100
原创 JQuery的事件委托方法
1.blind定义和用法：主要用于给选择到的元素进行事件绑定语法：blind(“事件类型”，function(){ });特点;适用于静态页面，只能给调用它时已存在的元素绑定，不能给未来新增的元素绑定当页面加载完时，才进行blind；2.live定义：主要用于给选择到的元素进行事件绑定语法：live(“事件类型”,函数名);特点：live并没有将事件绑定到自身（this）上，而是绑...
2019-07-28 18:00:44
4856
原创 PHP初识
一.PHP是什么？ php即超文本预处理器，是一种通用开源脚本语言，在服务器端执行； php是在服务器端执行，但将结果以html的形式返回给浏览器二. PhP能做什么？1.可以生成动态页面内容2.可以创建，打开，读取，写入，关闭服务器上的文件3.PHP 可以收集表单数据4.PHP 可以发送和接收 cookies5.PHP 可以添加、删除、修改您的数据库中的数据通过php将不再仅...
2019-07-26 23:58:05
125
原创 JS中的伪数组
一.维数组和数组的区别a). 真数组的长度是可变的，是内置的属性 伪数组的长度不可变，是自定义的一个属性b).真数组可以使用数组中的方法 伪数组不可以实用数组中的方法c).真数组可以访问数组的方法 伪数组不能直接访问数组的方法1.数组对象 具备自己本身的原型意外，还具备Object里的原型数据由于Array.prototype属性继承自Object.protot...
2019-07-25 23:41:37
1082
原创 正则表达式
一.正则表达也叫规则表达式,按照一定的规则组成的一个表达式,这个表达式主要匹配字符串的二.正则表达式的组成由元字符和限定符组成1，元字符：.:表示除了/n以外的[]:表示的是一个范围eg；[ 2-8]表示2-8之间的数[a-zA-Z]表示的所有字母的任意一个|表示的是或，[0-9][a-z]():表示的是分组：提升优先级2.限定符 *：表示出现0或者多次 eg: [1-...
2019-07-25 23:11:23
109
原创 DOM树的遍历
一，遍历DOM树的分析思路 1.先获取整个页面的Dom节点：foot=document.documentElement; 2.后创建一个函数用于遍历Dom树 ： 此函数需要传进一个参数，此参数是html文档中的根节点 然后在调用一个用于求节点的子节点的函数 3.创建节点的子节点的函数： 此函数需要一个参数，用...
2019-07-23 10:39:00
937
原创 JS中的作用域及闭包，沙箱
js中的递归1.什么是递归 是指在函数中调用函数本身，递归需要具备结束条件2.作用域，作用域链及预编译 a .作用域：指变量的应用范围 js中没有块级作用域....一对括号中定义的变量,这个变量可以在大括号外使用eg: { var sum=0;}Console.log(sum);b.作用域链：变量的使用,从里向外,层层的搜索...
2019-07-18 22:09:46
283
原创 JS中的构造函数及继承
一 js中的构造函数1. 面向对象对象的创建方式：a.通过new object（）；var stu=newStudent();b.字面量创建对象var p={Name:”张三”;Age:23;Run:function(){ }};c.先定义对象，后添加数据Varperson={ };Person.name=”张三“；Person.sge=23;构造函数...
2019-07-17 18:35:53
874
原创 对象及构造函数
1、什么是面向对象？面向对象是对过程的封装，是一种编程思想JS对象是：键值对的集合对象的创建有三种：a.通过new 一个构造函数var stu=new Student( );b.字面量的创建{}c.先定义对象，后添加数据var stu={};//即new object( );stu.name="";2、面向对象好处简化冗余代码3、面向对象的三大特征封装，继承，多态4、...
2019-07-16 23:04:52
217
原创 JS贪吃蛇
//var food;var map;//设为全局变量便于在其他方法中的调用；var snack;var food;var snackEyeR=null;var snackEyeL=null;var time;var n=true;function starts(){ time=setTimeout('snack.move()',500);// audio.play();}...
2019-07-15 22:26:27
161
原创 js中in，delete及定时器的小结
in的用法a). 返回 对象中的所有属性b).判断 对象的属性是否存在<script type="text/javascript"> // 定义一个对象: 作为了解 var Person={ name:'尼古拉斯*赵四', age:23, job:'亚洲舞王'...
2019-07-09 23:19:14
214
原创 JS中的三级联动
<script> var arr=[ [1,'陕西省',0], [2,'四川省',0], [3,'甘肃省',0], [4,'山西省',0], &nb...
2019-07-09 22:29:03
426
原创 元素的居中问题
一. 屏幕窗口居中1.已知大小的元素在屏幕窗口水平垂直都居中 解决方案： 元素{ width:数值+单位; height:数值+单位; position:fixed; left:50%; top:50%; margin-left:-wi...
2019-06-28 21:43:20
134
原创 CSS布局模型
一．常见的三种布局模型流动模型（flow）：元素没有转换类型，没有设置float的默认显示状态浮动模型（float）：通过给元素设置float进行页面布局层模型：语法：position:static|absolute | relative |fixed二．定位1绝对定位：position:absolute; 参照物：必须满足以下2个条件：a. 参照...
2019-06-28 21:38:30
118
原创 HTML元素类型
一．Html元素类型Html元素分为：块元素，内联块，可变元素也可分为;块元素，内联元素，内联块元素1， 块元素Div pul ol li dl dt dd table tr td formh1~h6fieldsethr块元素的特点：以块的形式显示为一个矩形区域 默认情况下独占一行，自上而下排列 块元素...
2019-06-27 20:35:56
125
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人