- 博客(42)
- 收藏
- 关注
原创 数据类型
基本数据类型 :Number 、String 、Boolean 、 Undefined 、 Null引用数据类型: Object判断数据类型方法:num = 123;str = 'abc';boo = true;nu = Null;un = undefined;obj = { name:'w',}arr = [1,2,3];1、typeofconsole.log(typeof num); //numberconsole.log(typeof str);.
2022-03-25 16:32:33 287
原创 箭头函数与普通函数区别
箭头函数let fn = ()=> {}如果只有一个参数,可以省()let fn = e => {}如果只有一条表达式,可以省略{}和returnlet fn = e => e*e;普通函数function fn(){}1、箭头函数是匿名函数,不能作为构造函数,不能使用new。let Fn = ()=> {}fn = new Fn();2、箭头函数不绑定实参 anguments ,rest 参数(...)解决let fn = (......
2022-03-25 00:00:29 492
原创 原型 & 原型链
原型:对象都有原型对象 (__proto__),函数原型对象(prototype)注意:对象没有 prototype 属性,只有方法才有。任何对象都有 constructor 属性,执行创建此对象的构造函数。function Person() {}var p = new Person();// 构造函数原型 Person.prototype// 实例对象原型 p.__proto__Person.prototype === p.__proto__原型链:因为所有对象都有原型,所以
2022-03-01 23:45:09 218
原创 js 继承
function Person(name?) { //Person 构造函数 this.name = name ? name: 'wq'; this.sayHi = function() { console.log('您好'); }}Person.prototype.age = 30; //构造函数原型上加 age 属性var person = new Person();//实例化对象person.sex = '男'; // 实例...
2022-02-25 23:24:43 175
原创 作用域 & 作用域链
作用域概念作用域针对变量,变量和函数只能在一定范围内使用。区分全局作用域、函数(局部)作用域 var a = '11'; function scope() { var b = '22'; function scopeChild() { var c = '33'; d = '44'; } }全局作用域 window ,变量 a 属于全局变量,可以在任何地方访问 函数作用域 b、c ,例如 c 只
2022-02-22 00:12:58 254
原创 闭包的理解
1、理解简单就是定义在一个函数内部的函数,可以使用其他函数的变量。 闭包是一种保护私有变量的机制,函数执行时形成私有作用域,保护私有变量不受外界影响。 内部函数可以使用外部函数的参数和变量,函数和变量不会被垃圾回收机制回收。2、变量变量:全局变量,任何地方可以访问;局部变量,作用域内访问。 函数内部声明的变量必须var声明,否则为全局变量。 全局变量 var count = 0; function counter() { return count += 1; } coun
2022-02-20 22:35:21 4454
原创 回流~重绘
网页渲染显示过程:解析 Html ,生成 DOM 树(包含display:none) 以 DOM 树为基础,根据节点的集合属性(解析 CSS)生成 render 树 在 render 树基础上再渲染颜色、背景等属性及其进行布局 绘制显示CSS 控制元素隐藏display:none 不占原来位置 valibility:hidden 占原来位置回流(reflow):render 树部分或者全部因大小或边距发生改变需要重新构建的过程重绘(repaint):颜色、背景色变化但布局不会变化而重
2022-02-18 23:51:18 184
原创 Node 基础总结4
express增删改查操作知识点:静态资源文件使用,使用模板 art-template post、get接口值获取 文件读取、写入 模块化,主页、路由、逻辑处理说明:使用 art-template ,默认开放读取 views 目录下的文件app.engine('html',require('express-art-template')); 渲染:res.ren...
2020-04-25 22:08:12 134
原创 NODE 基础总结3
EXpress 创建服务1.安装下载 express npm init -y (package.json文件,项目说明文件) npm install --save express (下载 express 并在 package.json 记录)2.创建服务 Hellow world // 1.安装引用var expres...
2020-04-13 23:31:40 103
原创 回调函数获取异步操作结果
function ansy(callBack) { setTimeout(function(){ var data='异步值'; callBack(data); })}ansy(function(data){ console.log(data);});目的:通过 ansy 方法获取 setTimeout 内的 data 值。解析:传参,传函数;callBack 相当于...
2020-04-08 21:32:14 265
原创 node 基础总结 2(require 和 exports)
require执行被加载模块中的代码console.log('a1');var b=require('./b');console.log('a2');console.log('b');a 文件加载 b文件,获取b内容结果得到被加载模块中的exports对象exportsexports 是 module.exports 的简写引用;实际导出的是 module.e...
2020-04-07 22:27:49 169
原创 node 基础知识总结1
1.概念NodeJS 是javascript 运行时环境,不是一门语言、不是框架、不是库;可解析和执行javascript,可脱离浏览器2.特点无DOM和BOM,为JavaScript 提供服务器级别的API事件驱动、非阻塞的IO模型、轻量高效、构建于 chrome 的 V8 引擎上3.创建服务器注:特殊,浏览器默认80端口;所有url都是以 ‘/’ 开头;响应内...
2020-03-30 22:23:14 159
原创 npm 命令
npm help 查看使用帮助 (npm 命令 --help 查看指定命令的使用帮助) npm init 初始化 (npm init -y 跳过向导,快速生成) npm install (npm i 简写) 一次性将dependencies选项中依赖项全部安装 npm install+包名 (npm i +...
2020-03-30 21:59:02 210
原创 ES6
JavaScript 是JavaScript 的扩展,于2015年6月正式发布。ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前者的一种实现。不同之处:1.变量:var:可以重复声明、无限制修改、无块级作用域let:不可重复声明、变量可修改,有块级作用域const:不可重复声明、常量不可修改、有块级作用域2.箭头函数简写:如果只有...
2020-03-22 18:54:59 96
转载 npm 和 cnpm
原因:npm 受网络限制(国外), cnpm (淘宝镜像)替代npm error code Z_BUF_ERROR error errno -5 网络原因导致(来源:https://www.jianshu.com/p/9859d486b90d)npm (交流平台)允许用户从NPM服务器下载别人编写的第三方包到本地使用。 允许用...
2020-03-22 12:46:24 120
原创 jquery实现开关切换
描述:开关是同一个事物控制两种不同的状态,开关是唯一的,但是内容是改变的例如:开和关的切换,本来为开的状态,点击切换为关的状态,开关随意切换。具体实现如下定义一个开关onOff=1,当第一次点击时,判断当前状态,重新赋值,每次取相反值即可。 var onOff=1; $("button").on('click',function(){ if(onOff==1){ ...
2018-10-11 22:58:57 5625
原创 数组赋值
描述:一个总的数组和包含的一个分的数组,现在数组内需要定义一个唯一的值id,而分数组内的id也要同步。例如:一个大数组内有10条数据,而包含的小数组只有两条数据(为大数组内的任意两条),在小数组根据id找到大数组对应的id。目的:关联两个数组,实现定位实现: // 总数据,根据name查找,不存在相同name假设 var all = [{ "name": "q",...
2018-09-07 23:57:20 237
原创 使用window自带的画图工具取色
需求:有时需要某种颜色在只有图片的情况下获取此色调使用工具:window自带的画图软件 在线搜索rgb转16进制步骤一:将图片使用画图工具打开,取标记的颜色步骤二:在画图工具的工具栏有个颜色选择器,吸管吸取标记处的颜色步骤三:吸取的颜色会在颜色处显示,编辑颜色查看rgb色调步骤四:在线搜索rgb转16进制进行转行步骤五:...
2018-08-29 23:16:45 33741
原创 命令行操作整理
由于有些前端框架需要配置环境,下载文件,都使用命令行操作,所以简单温习一下命令行操作。工具:window系统第一步:打开DOS命令行操作,window+R快捷键进入第二步:进入指定的硬盘路径,如e盘,使用e:第三步:在此硬盘创建一个学生文件夹,在创建子文件a和b,使用md+文件夹名和mkdir+文件夹名第四步:查看创建的文件,文件路径+dir/s,包含所有文件,子文件的子文件都显示第五步:删除文件...
2018-07-13 09:45:25 2179
原创 Dom节点的增加与删除
实现目的:一个按钮,如增加按钮,每点击一次,增加一行;删除就是点击增加的行标签,移除点击的此标签jquery实现方法:DOM节点操作,当点击增加按钮,在下方创建一个新的行标签;当点击创建的标签时自动移除。具体实现方法如下所示: <div id="app"> <!--<button class="btn" onclick="btn()">增加标签</but..
2018-07-12 19:50:55 3727
原创 github操作流程
github是一个面向开源及其私有软件项目的托管平台,只支持git作为唯一的版本库格式进行托管。写这篇文章的目的,将自己做的小练习小demo可以存储在github上,方便以后使用。需要用到的工具,一个github账号及其本地下载一个github使其实现同步上传功能。主要为图形化界面操作流程。第一步:登录github账号,新建一个仓库,存储本地文件。在账户下选择Your profile,点击进入。第...
2018-07-09 13:06:56 812
原创 tab切换及其对比总结
描述:tab切换一个简单的小功能,在pc端还是在移动端总是可以预见使用的情况,下面总结一下tab切换的实现。tab切换简单来讲就是某一个标题下对应某一块内容。jquery实现最简单的tab切换,主要使用的就是display:none 和 display:inline-block 属性,控制显示和隐藏。主要代码如下: <div class="content"> <ul>...
2018-07-08 21:49:54 1011
原创 排序
问题描述:一个json数组中有许多对象,每个对象中有许多属性,如下:按照age的大小排序。说明白就是数组排序问题。注意效率问题。 obj=[ {name:'w',age:20,sex:'男'}, {name:'w1',age:10,sex:'男'}, {name:'w0',age:40,sex:'男'}, {name:'wli',age:15,sex:'男'}, {...
2018-06-27 20:39:31 116
原创 手风琴布局
使用div+span+css样式可以做出任何样式,但是为了规范符合标准代码,网页布局应该斟酌考虑使用什么标签才会完美。下面完成一个下拉列表布局。 说明:使用有序列表或者无序列表完成,样式骨架如下: <ul class="nav"> <li class="nav-li"> <!--包含大标题和大标题下的内容--> &...
2018-06-25 09:52:35 1155
原创 九宫格布局
九宫格布局在移动端使用较多,总结一下自己的方法。微信小程序实现三行三列的九宫格方法1:使用百分比 一个父容器设置宽度为100%,父容器中包含九个小格子,宽度为父容器的33.3%(此处需要自己调试),然后使其横向排列,三格结束自动挤到下一行排列。方法二:使用wx:for创建一个三行三列的九宫格。此处就是js中的双层for循环原理,在小程序中显示两个对象的嵌套。第一次循环第一个对象(ob...
2018-06-21 22:13:13 922
原创 css的上下左右居中显示
css的基础知识,基于子元素宽高不确定的情况方法1:利用定位实现和margin实现 父级元素:position:relative 子元素:position:absolute;top:0px;bottom:0px;left:0px;right:0px; margin:auto;方法二:基于flex弹性盒子布局 父元素:display:flex;...
2018-06-14 23:51:27 221
原创 浮动及其弹性盒子
一:浮动 问题:浮动是什么? 浮动元素会脱离文档流并且向左或向右浮动,直到碰到父集元素或另外浮动元素; 浮动会影响父级元素,支撑影响父级元素的高度 <div class="container"> <div class="left">左浮动</div> <div class="right"
2018-05-07 22:59:46 2288
原创 transform的3D效果实现
一:立方体及其旋转效果原理:构建一个立方体,四方体共有六个面,采用定位及其位移旋转实现。<div class="rect-wrap"> <div class="container"> <div class="top slide"><img src="images/17.jpg" title="
2018-05-04 22:41:12 5114 1
原创 无缝滚动 和 轮播图的实现
公共部分HTML部分: <div class="window"> <div class="container"> <!--承载轮播的容器--> <div class="scroll"> <div class="box1 box">第一张图</div&a
2018-05-02 10:31:45 729
原创 瀑布流
理解:瀑布流的实现方法为定位,使用绝对定位的相对定位,改变列的高度及其左边距。首先根据所有的盒模型计算一行可以放得个数,即为最终的列数,比较第一行的每个的高度,则下一行的第一个在最小高度下排列,依次循环排列至结束。(PC端)知识点:名称说明document.body.clientWidth网页可见区域的宽度 document.body.clientHeight网页可见区域的高度document.b...
2018-04-11 20:38:27 238
原创 css的样式类
温习css样式类一:横轴设置1.display:box 父元素设置此属性,使其子元素排列在一行,水平排列,类似 display:inline-block浏览器支持:-webkit-box, -ms-box 或 -moz-box none:此元素不会被显示 block:块级元素,此元素前后带有换行符 inline:此元素为内联元素,前后无换行符 ...
2018-04-08 22:46:08 968
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人