自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(49)
  • 收藏
  • 关注

原创 JavaScript中call、apply、bind原理及手写相关代码

手写call、apply、bind函数首先声明对象,方便测试所写函数var name = "小王", age = 17;var obj = { name: "校长", objAge: this.age, fn: function (a,b) { console.log(this.name + "age" + this.age); console.log(a+b); },};let db = { name: "德玛"

2020-07-11 16:52:47 222

原创 Javascript中柯里化概念、封装及其应用

函数柯里化(Currying)在计算机科学中,柯里化是一种将接受多个参数的函数,转换为一个函数序列,函数序列中的每个函数接受单个参数。示例:function fn(a,b,c){ return a+b+c;}//正常执行fn(1,2,3);//柯里化之后:fn(1)(2)(3);函数柯里化的封装://传入一个函数作为参数function curry(func) { //形成闭包,将func函数传入到ruturn出去的函数中 return function

2020-07-11 15:36:14 649

原创 vue基础操作

vuevue 创建一个实例new vue({ el: "#app", //设置实例的挂载点 data: { //表示数据,当前实例中可以使用的数据 msg: "testing", color: "red", },});指令/操作/语法v-bind动态绑定数据在页面上,可以简写成 “:”。需要注意绑定的值为一个 js 表达式<div id="app"> <h1 :style="{color:'red'}"> 这里是一段文字

2020-07-07 21:46:47 198

原创 前端框架发展简史

前端框架发展史jQueryjQuery 插件,可以实现很多非常炫酷的效果。jQuery 最核心的操作叫元素选择。jQuery 解决了浏览器中的 js 兼容性问题,可以使用同意的一种写法解决相同的操作。Backbone是前端早期一个制作 spa 单页面应用程序的框架。Backbone+jQuery+Underscore,使用 require.js 是心啊模块化加载。是一个 mvc(model view controller)框架m model 存储数据v view

2020-07-07 21:46:05 402

原创 实时获取服务器数据的方法

实时获取服务器的最新数据方法轮询在客户端定义一个定时器,定时的向服务器发起请求获取最新的数据requestAnimationFrame 实现var index = 0; function count() { index++; //每5秒刷新一次 if (index % 300 == 0) { initHtml(); //此处initHtml函数为自定义渲染页面的函数,可以为任何你想实现具体功能的函数 } requestAnimationFr

2020-07-06 22:31:59 1839

原创 nodejs之简单的爬数据

nodejs 之简单爬数据准备cheerio 插件cheerio 是一个为服务器特别定制的,快速、灵活、实施的 jQuery 核心实现方案。axios 插件axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中代码const fs = require("fs");const cheerio = require("cheerio");const axios = require("axios").default; // 发起一个网络请求获取数

2020-06-29 19:44:35 10517

原创 nodejs-文件系统fs(file system)

npmnpm(node package manager)是 nodejs 的包管理工具。# npm 通过设置淘宝镜像解决下载慢的问题npm i nrm -g # 安装一个nrm模块,用来切换npm的仓库镜像地址nrm ls # 列出当前可以使用的镜像仓库地址nrm use taobao # 设置当前的安装仓库镜像地址为淘宝镜像npm 中常用的命令npm init # 初始化一个node项目npm i xx # 安装依赖项npm i xx -g # 安装全局依赖项npm i xx@v

2020-06-29 19:42:48 251

原创 Javascript 数组扁平化方法总结

封装函数,递归遍历实现function flat(arr){ let flatarr = []; function flatten(arr){ arr.forEach((val,index)=>{ if(Array.isArray(val)){ flatten(val); }else{ flatarr.push(val); } ..

2020-06-11 10:09:07 201

原创 javascript 深拷贝与浅拷贝的区别(深拷贝的实现方式)

浅拷贝拷贝的是栈中的地址而非堆中具体的值假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝et obj1 = { a: 1, b: 2 };let obj2 = obj1;obj2.a = 11;console.log(obj1); //{a:11,b:2}深拷贝拷贝堆中的值深拷贝实现方法用递归的思想封装深拷贝函数(deepCopy),实现深拷贝function deepCopy(obj) { if (obj i..

2020-06-11 09:39:33 157

原创 设计者模式 - 单例模式、观察者模式、适配器模式、组合模式

设计者模式:开发经验的总结,代码优化的方式常见的集中模式:单例模式:​ 保证一个类只有一个实例,并提供一个访问它的全局访问点let singleTon = (function () { let _instance = null; function Foo() { this.prop = ""; } return { getInstance: function () { ..

2020-06-11 09:37:09 390

原创 js - php操作mysql

一、php操作MySQL的语法登陆链接MySQL,选择数据库$link = mysqli_connect(数据库地址,数据库用户名,数据库密码,要操作的数据库);对指定表中的数据进行增删改查向MySQL发送sql命令的方法mysqli_query(sql命令);sql命令增INSESRT stu (name,age,cj) VALUES (‘王二’,‘男’, ‘67’)删DELETE FROM stu WHERE id = 6;改UPDATE stu

2020-05-26 22:59:05 339

原创 js - JSON构造函数

Day29真正的JSONjson数据,可以放在json文件中,也可以出现在编程语言中是一种文本数据,有专门的文件(.json)存储有固定的语法要求json作用:通用数据是一种文本语句,用来作为服务器端和客户端数据交互时,存储数据时一种编程语言中的通用数据,任何一门编程语言,都可以识别解析编程语言中的JSONjs中的json,类似于数组和对象,只不过还需要遵守json的要求,js中有提供json和数组的转换方法日常在js中,所谓的json数组,对象,其实只是参考了j

2020-05-19 23:04:46 706

原创 js - ES6的新增

ES6的新增新增的声明关键字:let和constlet和const没有提升不允许重复声明块级作用域暂时性死区全局变量,不会绑定windowconst不允许修改地址,可以改变值作为常量使用注意:复杂数据和一般数据的区别箭头函数基础语法var sayHello = (name)=>"hello"+name;sayHello("张三");特点类似于无名函数,只能作为值使用没有自己的this有且只有一个参数时,可以省略小括号有且

2020-05-19 00:17:38 222

原创 js -默认事件、事件委托

day24事件(下)默认事件系统默认的,可选可不选。如果不需要,可以阻止其发生阻止:通过事件对象身上的e.returnValue = false ; IE独有e.preventDefault() ; 正常浏览器兼容封装函数如下function stopDefault (e){ if(e.preventDefault){ e.preventDefault(); }else{ e.returnValue = false; }};

2020-05-14 23:00:27 201

原创 js - 事件、事件对象、事件流

Day23事件一、事件的介绍事件的组成obox.onclick = function(){console.log(1)};事件源:obox,绑定事件的元素。注意:事件目标,不是任何时候都等同于事件源,一般情况下时同一个绑定事件的方式:on,赋值式绑定事件类型:click,行为方式赋值: = , 赋值式绑定事件的标志之一事件处理函数:function(){console.log(1)};,触发指定行为时,要做的事情隐藏的部分:事件对象事件对象的介绍事件发生时产生的对象,

2020-05-13 22:55:57 198

原创 DOM下之样式与元素操作

Day22DOM下样式操作设置什么时候会通过js设置样式项目结束后,和用户产生交互之后js中设置的样式,都是行内样式方式可见的内置属性(html属性):style注意//1.不允许出现中划线,直接改成小驼峰obox.style.fontSize ="100px";//2.样式的值,一般都是字符,某些属性可以写成数值obox.style.opacity ="0.5";//3.样式中行高的设置,加不加单位,是不同的样式obox.style.lineH

2020-05-12 23:27:05 158

原创 DOM - 节点选择器和属性选择器

Day21一、DOM介绍概念:DOM(document of module)、DOM不属于BOMwindow对象身上有提供document对象DOM主要控制页面(html文件),所有的页面操作都需要通过DOMDOM的结构,html结构:属性结构,包含结构,家族结构(父子级,兄弟级)html根元素:head,bodyDOM树形结构的每个组成部分,都叫节点。所有节点,都是对象选择器元素节点选择器(只有元素节点)直接选择器id选择器:document.getELe

2020-05-12 00:17:15 1421

原创 javascript - BOM概念/方法/对象

Day19一、 BOM概念BOM(Browse of Module)浏览器对象模型,是个模型,这个模型由一个对象window来体现作用:提供了ES和页面的运行环境浏览器的一些规定,首先需要在ES的基础之上设置,但是最终生效时,一浏览器的标准为主浏览器的规范没有涉及到的范围,使用ES规范兼容:不是兼容的兼容问题 alert(); 每个浏览器的弹出窗口样式都不一样window的具体功能和作用window提供窗口或者窗口之间的操作因为所有内容都运行在浏览器中,所以window也是浏览器

2020-05-09 21:51:23 144

原创 Math对象,date对象

Day181、 对象js的对象的分类内置对象:ES提供的可以直接被使用的对象Math对象,数学对象本地对象是ES提供的一种类方法,需要被实例化后使用需要被new执行之后,才能使用String, Object, Array, Number, Boolean, RegExp, Date宿主对象由浏览器或w3c提供的运行ES的对象,所带的对象BOM:window DOM:document所有的自定义对象关键字 delete,用来删除自定义对象的属性delete 对象

2020-05-08 22:02:50 149

原创 ES5新增 - 严格模式、数组方法

Day171、 ES5的新增ES5:ECMAScript5严格模式严格模式:更严格的开发者模式意义:消除JavaScript语法的一些不合理、不严谨之处,减少一些怪异行为消除代码运行的一些不安全之处,保证代码运行的安全提高编译器效率,增加运行速度为未来新版本的JavaScript做好铺垫开启方式:在作用域开始的位置,加上一行字符串”use strict”局部严格:安全,...

2020-05-07 21:40:47 182

原创 js - 堆栈 window this

Day161、 栈堆内存用来运行数据的控件,内部又区分了不同的存储方式栈:一般用来存储变量名和地址,空间小,稳定,不可修改堆:一般用来存储数据,空间大,可以被修改关系:一一对应,多对一,不能一对多存取规则:栈:先进后出(杯子)堆:先进先出(无底杯子)数据类型的分类:基本类型:(值传递的数据)数据存储在栈中不存在深浅拷贝,默认就是深拷贝引用类型:(引用传递的数据)栈中...

2020-05-06 21:56:35 158

原创 js - 数组概念、方法、排序思想

Day101、 数组a. 数组的操作:索引(编号,序号,从0开始)数组的第一个[0];数组的最后一个:数组[数组.length - 1];根据数组的长度,得到数组到length-1结束。增增加数组的长度给你不存在的位置赋值arr [arr.length] = “哈哈哈”;删缩短数组的长度\原有长度为5;arr.length = 3;更改后数组的长度为3,相...

2020-04-29 22:07:57 161

原创 js -提升、对象、数组

Day91、 js的编译和执行js是一门解释性语言,会预先编译,再执行。(先通读全文,再解释含义)编译时,会有 提升变量和函数会提升变量var的提升会提前声明,=号的位置赋值console.log(a); //undefinedvar a = 10;console.log(a); //10↑↑↑↑等价于↓↓↓↓var a;console.log(a);a = 10;...

2020-04-28 21:53:49 131

原创 js - 函数返回值、作用域、变量的读写规则

1、 函数的返回值概念:函数自身的处理数据或执行结果,需要被二次使用或其他程序调用时,需要将数据返回出来关键字:’return 要返回的数据’return的功能可以让函数返回指定的值可以立即结束当前函数一个函数中可以写无数个return,但是只能执行一次return,一次只能返回一个数据,不允许返回多个数据返回的位置返回到函数的“执行语句”“注意:一个函数如果没有return,...

2020-04-27 20:41:35 332

原创 js-函数(上)

1、 函数的概念概念:由用户或者自身控制,可以实现某个功能的 代码段(很多代码)特点:忽略细节:在使用过程中,只需要关注其实现的功能即可,不需要关注其内部的原理重复使用选择使用2、 创建函数函数的创建类型:-内置(系统提供,或者公司给的)-‘parseInt()’-‘parseFloat’-‘alert’-…- 自定义(自己写)-声明式创建函数function n...

2020-04-26 22:01:11 125

原创 js - 小数显示问题 & 循环语句 & 三目运算符 & 逻辑运算符的高级用法

Day41、 小数问题现象:0.1 +0.7 = 0.799999999999999原因:计算机的执行机制为2进制,只识别0或1;计算机中有一套完善的转换机制,所有内容最终都会被解析成二进制;计算机对于小数的计算,会产生误差解决:主动保留n位小数,得到数据类型是字符num = num .toFixed(n);转成数值num= Number (num);(任何一种转成数值的...

2020-04-23 22:01:54 470

原创 Js-特殊数据&分支类型

Day31、 js中三大特殊数据:undefined/null/NaNa. NaN: 非法的数值运算得到的结果特殊之处:是一个数值型的数据,但不是一个数字NaN不等于任何值,和任何数据都不相等,NaN不等于NaN;检测方法:isNaN(要检测的数据)true:检测结果为NaN或能转成NaN;false:检测结果不是NaNcy或者不能转成NaN;b. undefined是未赋值,类...

2020-04-22 22:06:20 207 1

原创 js数据类型的转换&运算符

Day21、 数据类型的转换a. 为什么要转换?当用户、计算机或者其他程序给了一个数据,不是我们想要的数据类型,需要转换成当前程序所需的数据类型,再进行运算b. 数据类型的转换方法强制转换(显示转换、主动转换)字符转数值‘parseInt(要转换的数据或者变量)’从左向右一次检测,遇到非数字字符,立即停止忽略小数点后所有的内容第一位是非数字,直接显示NaN(Not a num...

2020-04-21 21:50:32 185

原创 js-历史、组成、变量、数据

Day11、 JavaScript书写位置JavaScript分类:a. 内联(行内):属性形式:通过事件触发<input type=”button” οnclick=”alert(“hello world”)”>不建议使用,原因:结构和行为分离,优化项目,便于管理为了测试方便b. 内部:script双标签,包裹js代码不太建议内部,结构和行为的分离,非公共行为部分,...

2020-04-20 20:33:28 145

原创 html移动端布局概念性准备以及相关单位

Day301、 媒体查询媒体查询:由设备类型、检测设备特性表达式构成。语法:@media 设备类型[all\screen] and (条件表达式){css样式}注:and两侧必须有空格Not放在设备类型的前面(反向选择,排除某个范围)媒体查询:做样式的微调例如:浮动显示隐藏文本大小宽高2、 移动端meta标签的设置Meta标签的设置:视口1:1、禁止用户缩放3、 ...

2020-04-15 21:06:51 180

原创 怪异盒子,弹性盒子,多栏布局

Day291、 怪异盒子模型Box-sizing:;属性值:Box-sizing:content-box; 常规盒模型Box-sizing:border-box; 怪异盒模型(IE盒模型)怪异盒模型:触发怪异盒模型:Box-sizing:border-box; 怪异盒模型特点:padding盒border都会在元素的宽高的内部,不会把盒子撑大。2、 弹性盒子弹性盒子:布局...

2020-04-14 22:37:38 300

原创 css3新增属性总结-01

Day281、 文本阴影属性Text-shadow: x轴位置 y轴位置 阴影大小 阴影颜色;注:如果想添加多个阴影,每一组阴影以后好分隔。2、 盒子阴影属性Box-shadow: x y 阴影的模糊度 阴影扩散的大小 阴影颜色 内阴影(inset可选);添加多阴影:以逗号分隔的形式添加多阴影。3、 文字换行英文或者数字默认显示:如果没有换行的情况下,浏览器会尝试把下一个长单词放在...

2020-04-13 21:56:47 167

原创 html5表单新增+css3各种选择器

Day251、 h5表单新增新增的html属性:a. minb. maxc. required 如果表单没有输入内容的情况下,禁止提交d. step 确定一个法定值 eg:3 -6 -3 0 3 6e. autocomplete 自动提示信息 属性值on/offf. placeholder 文本框的提示信息g. autofocus 自动聚焦h. pattern ...

2020-04-10 21:13:31 330

原创 html5新增

Day231、 html5语义化结构标签section 更偏于划分区域。(网页的外围结构,类似于div)article 更偏向于内容的展示aside 侧边栏hearer 网页头部或者是内容块儿的头部footer 网页底部或者是内容块儿的底部nav 导航区域figure 代表一个独立的区域figcaption figure区域的标题main 主体区域(IE不兼容)hgroup...

2020-04-09 20:44:37 130

原创 css之3d属性总结

Day231、 3D旋转Rotate3d(x,y,z,度数);注:x y z 是一个矢量值,0不旋转 1旋转2、 景深Perspective: 900px; 表示站在900像素外看元素。值越大,距离越远(给父元素添加)。通常的数值在900-1200之间,当足够远的时候,景深效果基本可以忽略不记。3、 3D缩放3d缩放,主要包括scaleZ()和scale3d()两个功能函数注:...

2020-04-08 21:01:43 606

原创 css变形-2的变形 transform属性

Day221、 变形属性Transform:;Transform的属性值为功能函数2、2d功能函数a. translate 2d的位移;transform:translate(x,y);transform:translateX (x轴移动的距离)transform:translate (y轴移动的距离)b. rotate 2d 的旋转transform:rotate...

2020-04-07 21:08:48 154

原创 css-渐变、过渡

Day191、 浏览器css3属性前缀很多css3属性,最初的预览版没有形成最终的正式版,但是浏览器为了对这些新属性形成支持,主流浏览器都提供了属于自己的语法规则“浏览器前缀“。 -webkit- 谷歌、苹果 浏览器前缀 -moz- 火狐浏览器前缀 -ms- IE浏览器前缀 -o- 欧鹏浏览器前缀 注: 添加浏览器前缀 -&g...

2020-04-03 21:11:53 313

原创 表单表格标签补充

Day171、 表格标签补充a. 表格的数据行分组 表头 表体 表尾 注:一个表格有一个表头和表尾,但是可以包含多个表体b. 列标题标签默认的样式:作用居中 文本加粗c. 表格标题标题的位置: Css属性:Caption-side:left/right/top/bottom 注:left/right 有兼容问题:火狐能识别,谷歌不能识别。d. 数据列...

2020-04-01 21:38:51 297

原创 css高度自适应-父元素随子元素变化

Day161、 min-height IE6不兼容问题正常项目中:最小高度直接用min-height即可。如果考虑兼容:min-height IE6不兼容。IE6默认把height解析成最小高度。若height 和min-height同时出现,IE6执行的事height固定高度。最小高度的兼容设置方法:(了解:体会解决问题的思路)1:min-height:300px;_height:30...

2020-03-31 20:51:16 6913

原创 css定位+锚点+pc端宽高自适应总结

Day151、 固定定位Position:fixed; 固定定位A:参照物:浏览器窗口;B:不占据空间,脱离布局流;让一个元素在浏览器窗口左右上下居中?第一种方法:Position:fixed;Left:50%;right:50%;Margin-left:-元素宽度的一半;Margin-top:-元素高度的一半;第二种方法:Position:fixed;Left:0;ri...

2020-03-30 21:30:55 785

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除