- 博客(88)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 深入理解JavaScript之作用域链与闭包
作用域作用域是指程序源代码中定义变量的区域。实际上描述的就是查找变量的范围，作用域必须有的两个功能就是存储变量以及查找变量，作用域就是发挥这两个作用以及更多作用的规则。作用域规定了如何查找变量，也就是确定当前执行代码对变量的访问权限。词法作用域和动态作用域词法作用域：（静态作用域）函数的作用域在函数定义的时候就决定了。动态作用域：函数的作用域是在函数调用的时候才决定的。JavaS...
2020-03-01 22:44:44
274
原创 深入理解JavaScript之 new 原理及模拟实现
1.定义new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例先看看 new 实现了哪些功能, 先来看一段代码：function Person(age) { this.age = age;}Person.prototype.getAge = function() { console.log("年龄为:" + this.age );}var pe...
2020-02-22 21:49:06
285
原创 深入理解JavaScript之原型与原型链
1.原型prototype原型是一个对象，把prototype称为原型对象，prototype可以让所有的对象实例共享它包含的属性和方法。JavaScript规定，每一个函数都有一个prototype对象属性，指向另一个对象。prototype对象属性的所有属性和方法都会被构造函数的实例继承。2.只有函数有prototype属性js分为函数对象和普通对象，每个对象都有__proto__属性...
2020-02-16 11:44:41
300
原创 ES6系列之一文彻底弄懂Iterator
前言本文主要来深入剖析ES6的Iterator（迭代器/遍历器），在了解它之前，我们首先要知道为什么需要Iterator? 它出现的原因是什么?从循环说起平时开发中，我们经常会用到循环，拿最基本的来说，比如循环一个数组:// for循环var arr = [1, 2, 3, 4];for(let i = 0; i < arr.length; i++) { console....
2020-01-11 09:47:51
228
原创 ES6系列之箭头函数全解析
引言ES6中允许使用箭头=>来定义箭头函数，是ES6中较受欢迎也较常使用的新增特性。本文将从箭头函数的基本语法，与普通函数对比，箭头函数不适用场景三个方面进行梳理。基本语法// 箭头函数let func = (name) => { // 函数体 return `Hello ${name}`;};// 等同于let func = function (nam...
2020-01-07 20:42:28
535
原创 ES6系列之模板字符串
模板字符串是ES6中非常重要的一个新特性，这个特性使得处理相关业务变得更加容易。基础用法let a = `hello world`;console.log(a); // hello world注意这里不是双引号，而是反撇号`在模板字符串中，还可以拼接html元素，同时空格、缩进、换行都会被保留，并且如果模板字符串中的变量没有声明，将报错。let str = ` <div...
2020-01-05 23:44:16
249
原创 ES6系列之变量的解构赋值
1.什么是解构？ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。它在语法上比ES5所提供的更加简洁、紧凑、清晰。它不仅能减少你的代码量，还能从根本上改变你的编码方式。2.数组解构以前，为变量赋值，我们只能直接指定值，比如let a = 1;let b = 2; let c = 3;现在可以用数组解构的方式来进行赋值let [a, b, c] = [1,...
2020-01-05 09:57:49
178
原创 Vue实现星级评价效果
我们把星级评价单独做成一个Star组件，抽离出来，其中父组件中引入(传入的是评分的值)<div class="score"> <Star :score="poiInfo.wm_poi_score"></Star></div>初始Star.vue<template> <div> <div ...
2019-12-29 21:33:22
969
原创 ES6系列之let和const与var的区别
ES6规范新增了let、const两种变量声明方式，项目中也经常要用到，今天借着温习ES6语法，来总结let 、const、var的区别。一、变量提升来看下面三段代码console.log(a); // undefinedvar a = 2;console.log(b); // Uncaught ReferenceError: b is not definedlet b = 2;...
2019-12-28 17:47:25
171
原创 swiper父级元素处于隐藏状态滚动效果失效问题
在使用vue-awesome-swiper的时候，实现这样一个功能, 点击页面的banner图（Banner.vue），进入一个图片画廊（Gallary.vue），可以查看更多相关的照片，但发现轮播图滚动效果失效原因是：一开始Gallay.vue的所有用swiper控制的图片处于隐藏状态，直到点击才进入图片画廊显示图片。swiper其父级元素处于隐藏状态(display:none), 会导致s...
2019-12-25 09:50:18
902
原创 vue-awesome-swiper修改轮播图pagination的颜色
在使用vue-awsome-swiper轮播图的时候，pagination处于当前选中状态默认是蓝色，但通过修改这个类并无法改变其背景颜色<div class="wrapper"> <swiper :options="swiperOption"> <swiper-slide v-for="(item, index) of swiperList...
2019-12-25 09:48:26
2220
1
原创 CSS查漏补缺（二）——自定义checkbox样式
由于原生的checkbox样式比较难看，所以我们经常需要改写它的样式，美化复选框，所以今天总结下自定义checkbox样式的方法，上代码：html部分<label class="checkbox-inline"> <input type="checkbox" class="checkbox" name="hobby"> <span class="h...
2019-12-25 09:47:13
257
原创 CSS查漏补缺（一）—页面内容不足铺满屏幕高度和有滚动条时，footer始终保持底部显示
记录一个项目中经常会用到的技巧，footer区（比如版权信息）要始终居于页面底部。如果用fixed定位显然不可取，因为要保证页面高度大于屏幕高度时，footer区要跟随着页面滚动保持在底部，如下图：tip：以下两个方法仅适用于footer区高度固定的情况方法一页面结构：<div class="wrapper"> <div class="main-conta...
2019-12-07 23:56:25
1803
原创 深入理解JavaScript之执行上下文和变量对象
继续接着上篇文章，上篇我们说到函数上下文的结构可表示为const ExecutionContextObj = { VO: window, // 变量对象 ScopeChain: {}, // 作用域链 this: window};即每个函数上下文，都要有这三个重要属性：变量对象(Variable object, VO)作用域链(Scope chain)...
2019-11-28 21:20:33
343
原创 深入理解JavaScript之执行上下文和执行栈
都说想成为出色的JavaScript 开发者，就要深入学习 JavaScript 程序内部的执行机制，最近学了一遍JS的执行上下文和执行栈，以此作总结。首先先来了解几个专业概念EC：函数执行环境（或执行上下文），Execution ContextECS：执行环境栈，Execution Context StackVO：变量对象，Variable ObjectAO：活动对象，...
2019-11-27 23:54:50
340
原创 深入理解JavaScript之实现继承的7种方式
1.原型链继承核心：将父类的实例作为子类的原型首先，要知道构造函数、原型和实例之间的关系：构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个原型对象的指针。function Father(){ this.name = '父类的名字';} Father.prototype.getFatherName = function(){ consol...
2019-11-23 17:52:28
230
原创 移动端之开启和禁止页面滚动
在做移动端页面是，有个操作需要禁止页面的滚动，故学习了原生js的操作function handler(ev){ ev.preventDefault();}// 禁止页面滚动document.body.addEventListener('touchmove', handler, { passive: false });passive：false。 设置该属性的目的主要是为了在阻...
2019-11-10 23:34:07
417
原创 sessionStorage、localStorage用法总结
在工作中使用sessionStorage存储数据时，发现sessionStorage无法直接存储数组和对象，如存入对象则显示为"[object Object]"，对此作下记录，重新温习sessionStorage和localStoragehtml5 中的 web Storage 包括了两种存储方式：sessionStorage 和 localStorage共同点存储大小为5MB，都保存在客户...
2019-11-03 23:07:21
214
原创 jquery源码分析（一）
最近开始阅读jquery的源码，首先先提炼出jquery的核心结构。自执行函数(function(window,undefined){ //...})(window);为什么传入window?1.代码压缩首先从代码压缩混淆的角度考虑，用线上工具来压缩混淆下面这段示例代码：function test(){ var name="hello"; window.descri...
2019-09-07 15:30:57
224
原创 深入理解JavaScript（三）：获取数组中的最大值方法（this,apply）
1.排序法思路：给数组先排序(由大到小排序),第一项就是最大值let arr = [1,5,6,7,9,20,40,2,3];let max1 = arr.sort(function(a,b){ return b-a;})[0];console.log(max1);2.假设法思路：假设第一个值是最大值,依次遍历数组中后面的每一项,和假设的值进行比较,如果比假设的值要大,把当...
2019-08-11 13:51:01
280
原创 深入理解JavaScript（二）：由一道题来思考闭包
概念闭包就是指有权访问另一个函数作用域中的变量的函数 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>点击li标签弹出对应数字</title> </head> &...
2019-08-05 16:58:58
124
原创 深入理解JavaScript（一）：变量提升
变量提升原理：JS引擎的工作方式是先解析代码，获取所有被声明的变量；然后在运行。JS代码自上而下执行之前，浏览器首先会把所有带 “VAR”/“FUNCTION” 关键词的进行提前 “声明” 或者 “定义” ，这种预先处理机制称之为 “变量提升”。console.log(a, b);//undefined undefinedvar a = 12, b = 12;function...
2019-08-04 22:13:54
166
原创 绝对定位的居中
绝对定位absolute，可以用left:50%加上margin-left:(宽度/2)，来实现绝对定位的居中.line{ position: absolute; width: 20px; left:50%; margin-left:-10px; }
2018-07-31 15:39:01
316
原创 [Vue warn]: Do not use built-in or reserved HTML elements as component id: header
这个报错直译中文是：不要使用内置或保留的HTML元素作为组件ID 说明有命名跟标签冲突了 打开项目其中一个Header.vue组件，里面name的值header与html5标签header冲突 解决办法：把“header”改为”Header”或者另想命名...
2018-07-27 20:41:05
8477
原创 ERROR in ./src/style.css Module build failed: Unknown word (2:1)
在使用webpack4打包css遇到一个错误ERROR in ./src/style.cssModule build failed: Unknown word (2:1)后来发现问题在于loader配置项中，css-loader和style-loader顺序写反了，必须写成必须先style-loader再css-loader module:{ rules:[ ...
2018-07-19 14:58:44
3296
原创 元素绝对定位在底部水平居中
在做移动端开发曾遇到的一个问题，要使元素在底部水平居中显示，于是找了解决方案： 页面代码：<div class="sea_result_con"> <span class="sea_result">共查询到2条记录</span> </div>css代码：.sea_result_con{ position: absol...
2018-07-14 22:24:58
2540
原创 提交form表单之前处理数据
适用情况：前端页面做好表单信息未填点提交或保存出现的问题当信息为空时，一般我们肯定不能让它提交到数据库，应该提示信息没填或为空，这一步可以由前端或后端来完成，不过为了减轻服务器的负担，建议是由前端来完成判断function check(){ var name = document.getElementById("name").value; if(name == null...
2018-07-14 12:24:28
5573
原创 Vue基础实战-在线翻译
知识点：vue-cli脚手架的基本使用 vue-resource的使用调用翻译API这次使用vue-cli脚手架来搭建工程项目,vue init webpack translate创建项目后，首先先搭建一个简单的页面，我们需要两个组件，一个是表单内容的，一个是输出结果，所以我们在components下创建TranslateFom.vue和TranslateOutput....
2018-07-12 22:28:00
608
原创 解决IE6下不支持position:fixed属性
先弱弱的问一句，市场上还有多少项目需要考虑兼容IE6的….. * 正常浏览器和IE7+浏览器显示如下： * IE6下显示结果： 发现position:fixed属性失效，因为IE6是不支持这个属性的 解决办法： 在css样式里面加上下面这段代码:* html #menu {/*解决position：fixed不兼容问题*/ position: absolu...
2018-07-12 09:37:24
850
原创 HTML5代码调用手机摄像头
做手机移动端的时候，有时需要调用手机摄像头，有一个简单的方法使用input:file标签，不需要复杂代码操作就能实现调用拍照、相册等功能。 capture – 设置选择需要调用的功能 camcorder – 摄像机 microphone – 录音 accept – 直接打开系统文件目录<input type="file" accept...
2018-07-11 17:57:16
8433
原创 实现点击加载更多与sessionStorage定位
之前在做移动端项目的时候，有个功能，叫点击加载更多：即页面一堆信息，刚点开只显示一部分，拖到底部，有个点击加载的框，点击之后通过ajax请求去后台把剩余的数据继续加载出来；而且，比如滚动到底部，点击某个链接进去新的页面，然后按手机返回键，屏幕的滚动条又必须在原来的位置在这里我们使用sessionStorage,HTML的web存储分为两种： localStorage和 sessionSt...
2018-07-11 16:42:33
495
原创 Vue基础实战-敲击瓶子
本次介绍的Demo是比较基础的，因为它涉及Vue的基础部分而已，它叫敲击瓶子（利用换图片假装敲到碎了）效果最基础的知识点 vue基本指令使用：如v-model、v-show 绑定css属性的方式 事件处理（按钮点击事件） 首先我们需要写好样式和引入vue.js，还需要有两张图片 先完成初始静态页面，这里直接是官网下载vue.js引入本地使用，还有自...
2018-07-11 16:18:31
1523
1
原创 JS之slice() 方法
定义和用法 slice() 方法可从已有的数组中返回选定的元素。语法 arrayObject.slice(start,end)参数描述 start 必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2指倒数第二个元素，以此类推。 end 可选。规定从何处结束选取。该参数是数组片断结束处的数组...
2018-06-08 15:37:41
18790
原创 JS之Object.defineProperty()方法
1.数据属性 修改属性默认的属性，必须使用ECMAScript的Object.defineProperty()方法。这个方法接收三个参数：属性所在的对象、属性的名字和一个描述性对象。其中，描述符对象的属性必须是：configurable、enumerable、writabel、和value。设置其中的一或多个值，可以修改对应的特性值。var person = {};Object.d...
2018-05-18 18:59:22
820
原创 初学Vue练手的简易todolist
此简易Demo就不写样式了，主要是熟悉Vue的指令功能：添加、删除待办事项 &amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt;&amp;lt;head lang=&quot;en&quot;&amp;gt; &amp;lt;meta charset=&quot;UTF-8&am
2018-05-15 20:51:16
558
原创 MongoDB——性能之逐条插入与批量插入
在mongoDB中，当我们要插入很多数据时，可以选择用循环依次逐条插入，或者可以先把所有数据装在一个数组再整个数组插入集合，但是，最好使用第二种方式，如下代码所示（已新建数据库log和集合test），在js写入如下代码逐条插入var startTime = (new Date()).getTime();//获得开始时间var db = connect('log');for(let ...
2018-05-12 09:28:02
17929
原创 KFC收银管理系统（收银模块）——小总结
近期在学Vue的各种知识，然后动手完成做了个收银管理系统（收银模块），加深了对Vue框架的认识，摸摸索索也大概了解了Vue的项目制作流程，在这里还要感谢一位老师：jspang。 这个项目使用的技术栈为： Vue+Webpack+Element+Axios+vueRouter首先，项目开始，先用Mockplus，这通常是产品经理表达想法的利器，Mockplus下载地址：https:...
2018-05-08 12:43:55
4295
原创 网页爬虫-用PHP的拓展库curl实现模拟登录慕课网
网络爬虫（又被称为网页蜘蛛，网络机器人，在FOAF社区中间，更经常的称为网页追逐者），是一种按照一定的规则，自动地抓取万维网信息的程序或者脚本。另外一些不常使用的名字还有蚂蚁、自动索引、模拟程序或者蠕虫。<?php //登录慕课网 $username = "账号"; $data='username=账号&password=密码&remember=1'; $curlob
2017-07-16 17:56:32
1105
原创 Linux详解之用三个文件实现复制文件内容功能
要求：写三个代码文件，main.c，mycp.c，mycp.h。要求在命令行输入两个文件名即可实现把第一个文件复制到第二个新文件中，其中mycp函数的要求是mycp(char *src, char *dest)，*src是源文件路径，*dest是目标文件路径。知识点：1.Linux系统编程之错误处理：perror , strerror 和 errno 首先是errno，在系统编程中错误通常
2017-03-19 16:40:01
4107
KFC收银管理系统（收银模块）
2018-05-08
链表实现学生信息管理系统完整版
2016-07-29
顺序表实现学生信息管理系统
2016-07-29
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人