前端学习笔记
文章平均质量分 58
推开世界的门
掘金地址:https://juejin.cn/user/2963939081585479/posts
展开
-
javascript系列之null和undefined
null和undefined的区别先看一个判断题console.log( null == undefined ) // true console.log( null === undefined) // false观察可以发现:null和undefined 两者相等,但是当两者做全等比较时,两者又不等。原因:null: Null类型,代表“空值”,代表一个空对象指针,使用typeof运算得到 “object”,所以你可以认为它是一个特殊的对象值。 undefined: Undefine原创 2021-08-11 17:04:53 · 203 阅读 · 0 评论 -
2021前端查漏补缺和进阶实操
vuevue响应式原理原创 2021-08-11 16:46:55 · 134 阅读 · 0 评论 -
vue2.x响应式原理
vue2.x响应式原理前言响应式也就是我们平常说的MVVM架构具体体现的一种形式。通过数据驱动视图,告别jq时代的dom操作。vue直接操作数据,就可以更新视图,这就是响应式。vue2.x的响应式原理,主要是利用了Object.defineProperty的get和set来实现数据的修改和劫持。但是仅仅依赖这一个API是远远不够的,所以就有了VUE官网的这一张图。不懂也没关系,这毕竟是尤大大的思想精髓之处,我们慢慢理解今天让我们用对话的方式来一步一步实现这个响应式原理x: vue的响应式原理原创 2021-08-09 15:17:14 · 118 阅读 · 0 评论 -
Node+Gulp+webpack
Node传统js开发的弊端:文件依赖,命名冲突模块的导入导出方法能够使用基本的系统模块能够使用常用第三方包能够说出模块加载规则知道pack.json的作用:问一导出模块中module.exprous 和exprous的区别exports是modules的别名(简单使用,地址引用的关系),导出对象最终以module.expores为准:问二:node中的系统模块:文件模块(读写...原创 2019-11-25 23:27:50 · 319 阅读 · 0 评论 -
Ajax扩展
1:模板引擎2:案例3:FormData4:同源策略模板引擎在官网在在art-template在客户端的库文件引入当前模板准备art-template模板告诉模板引擎将那个数据和那个模板进行拼接<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...原创 2019-11-14 18:25:30 · 212 阅读 · 0 评论 -
Ajax基础
ajax基础传统网站中存在问题:网速慢的时候,加载页面非常慢,用户体验不好表单提交内容后,如果有一项不符合要求,就要重新填写所有表单页面跳转,重新加载资源,造成资源浪费,用户等待时间长ajax概述:是浏览器提供的一套方法,可以实现页面无数新跟新数据,提高用户体验运行环境:在网站环境中才生效(要会使用node的express创建网站服务器)前期准备:初始化项目 npm init -y...原创 2019-11-14 16:22:27 · 179 阅读 · 0 评论 -
gulp学习
gulp基本使用目录介绍: src存放项目源文件 dist存放压缩转化的文件针对html压缩抽取,css转换压缩,js转化压缩,普通文件的复制const gulp = require('gulp') // html压缩抽取const htmlmin = require('gulp-htmlmin')const fileinclude = require('gul...原创 2019-10-24 10:26:26 · 205 阅读 · 0 评论 -
前端全栈学习第十五天-js高级-第五天
1:拷贝2:遍历DOM树3:正则1:拷贝1.1浅拷贝:将一个对象的使用内容直接复制给另外一个对象(function () { var obj1 = { age: 12, name: "小敏", sex: "男" }; var obj2 = {};//首先要有这个对象,只不过他是空的需要赋值 fun...原创 2019-03-30 19:42:58 · 122 阅读 · 0 评论 -
前端全栈学习第十六天-jq-第一天
1:介绍jq的前世今生2:jq案例1.1学习jq要达到的目标掌握jq编程思想,利用jq做网页特效所谓的jq就是js语法写的一些函数类(现在也终于明白为什么说js高阶函数就是函数作为参数使用,函数作为返回值使用了!因为框架库就是对函数的高度封装!),但是有些功能jq没有封装,这时候就需要用原生的js来实现,这也就是为什么原生js的重要性。由于框架库都是拿来用的,只有原生js是自己写的...原创 2019-04-01 21:32:13 · 145 阅读 · 0 评论 -
前端全栈学习第十七天-jq-第二天
1:链式编程2:动画3:表单4:滚动1:链式编程1.1多行代码合并成一行代码,需要提前认清此行代码返回的是不是对象,是对象才能链式编程1.2案例<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></tit...原创 2019-04-02 21:18:06 · 397 阅读 · 0 评论 -
前端全栈学习第十八天-node-第一天
好吧中间跳过了好多,因为做了几个项目。所以博客直接到了node,写完node,vue.开始分享项目## node.js是什么##node.js中的javascript##系统模块##核心模块##http# Node.js 第1天## 上午总结- Node.js 是什么 + JavaScript 运行时 + 既不是语言,也不是框架,它是一个平台-Node....原创 2019-04-25 10:50:18 · 268 阅读 · 0 评论 -
vue第二天 ---案例+过滤器+自定义指令+生命周期+动画
1:品牌管理案例增加+删除+搜索页面布局:面板+列表用到了panel panel-primary ,panel-heading,panel-body(label(id+输入框,),button)列表 table,table-hover,table-striped table-bordered (thead(tr,th),tbody(tr,td))增加实现过程:1:获取i...原创 2019-05-13 20:22:10 · 351 阅读 · 0 评论 -
vue--第三天 组件
## 定义Vue组件什么是组件: 组件的出现,就是为了拆分Vue实例的代码量的,能够让我们以不同的组件,来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可;组件化和模块化的不同:+ 模块化: 是从代码逻辑的角度进行划分的;方便代码分层开发,保证每个功能模块的职能单一;+ 组件化: 是从UI界面的角度进行划分的;前端的组件化,方便UI组件的重用;### 全局组件...原创 2019-05-14 17:19:09 · 342 阅读 · 0 评论 -
解锁webpack-----4.x
## 在网页中会引用哪些常见的静态资源?+ JS- .js .jsx .coffee .ts(TypeScript 类 C# 语言)+ CSS- .css .less .sass .scss+ Images- .jpg .png .gif .bmp .svg+ 字体文件(Fonts)- .svg .ttf .eot .woff...原创 2019-05-16 10:45:38 · 363 阅读 · 0 评论 -
vue第一天 Vue指令
前言:Vue.js 是一套构建用户界面的框架,**只关注视图层**,它不仅易于上手,还便于与第三方库或既有项目整合。(Vue有配套的第三方类库,可以整合起来做大型项目的开发)+ 前端的主要工作?主要负责MVC中的V这一层;主要工作就是和界面打交道,来制作前端页面效果;## 为什么要学习流行框架+ 企业为了提高开发效率:在企业中,时间就是效率,效率就是金钱; - 企业中,使用框架,能...原创 2019-05-12 20:33:30 · 363 阅读 · 0 评论 -
vue-mint-ui简单使用
首先项目用到了mint-ui安装 cnpm i mint-ui -S然后按照官网的操作,将mint-ui导入main.js实操将所有准备工作准备就绪,下面就可以使用mint-ui在main.js 里面,render要渲染的是app 而app是从App.vue里面导入的,所以要想实现渲染,要在App.vue里面写先来看看官网的CSS不要慌,跟boo...原创 2019-05-16 23:43:54 · 6904 阅读 · 1 评论 -
本地代码怎么上传到码云?
针对之前操作过码云,但是一段时间之后忘记改怎么操作码云的小伙伴准备操作第一步打开官网:点击当前页的创建之后,跳转到这一页:里面有用的就是ssh,将ssh里面的地址复制然后打开项目所在目录:比如我的微信小程序在桌面,todos文件夹里面所以在终端来到桌面的todos文件夹:接下来正式操作,将本地代码提交到码云一:初始化项目 git init...原创 2019-05-17 11:55:43 · 2924 阅读 · 1 评论 -
前端面试之-----html+css(21-60)
21、什么是 Css Hack?ie6,7,8 的 hack 分别是什么? 答案:针对不同的浏览器写不同的 CSS code 的过程,就是 CSS hack。 示例如下: 1 2 3 4 5 6 7 8 9 10 11 12 #test { width:300px; height:300px; background-color...原创 2019-06-13 10:24:21 · 375 阅读 · 0 评论 -
前端面试之-----html+css(1-20)
一、HTML 和 CSS 1、你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? IE: trident 内核 -ms-Firefox:gecko 内核 -moz-Safari:webkit 内核 -webkit-Opera:以前是 presto 内核,Opera 现已改用 Google Chrome 的 Blink 内核 -o- Chrom...原创 2019-06-03 11:02:41 · 214 阅读 · 0 评论 -
js-----继承
1:创建的三种方式2:构造函数和实例对象之间的关系 实例对象和构造函数之间的关系 1:实例对象是通过构造函数来创建的 过程叫实例化 2:如何判断对象是不是这个数据类型 1)通过构造器的方式 实例对象.构造器 == 构造函数 2)instanceof 对象 instanceof 构造函数名称(推荐)一个对象的构造器指向的不一定是自己的构造函数,有可能是object...原创 2019-06-20 11:34:11 · 141 阅读 · 0 评论 -
js实现冒泡排序
冒泡排序原理:冒泡排序算法的原理如下: 比较相邻的元素。如果第一个比第二个大,就交换他们两个。 对每一对相邻元素做同样的工作,从开始第一对到结尾的最后一对。在这一点,最后的元素应该会是最大的数。 针对所有的元素重复以上的步骤,除了最后一个。 持续每次对越来越少的元素重复上面的步骤,直到没有任何一对数字需要比比较 白话就是:比如有6个数,你需要比较5趟,这......原创 2019-06-27 17:12:36 · 70796 阅读 · 16 评论 -
前端全栈学习笔记第七天 - CSS
1:元素的显示与隐藏(display有两个默认属性,inline,block),隐藏之后不保留位置为什么显示不用inline?因为一旦没文字,用inline就什么也不会显示。display(显示):block除了转化为块级元素,同时还有显示元素的意思visinility:可见性visible:显示hidden:影藏特点:隐藏之后,保留原来位置案例<!DO...原创 2019-01-23 20:04:50 · 208 阅读 · 0 评论 -
前端全栈学习第十五天-js高级-第四天天:call,apply,bind,高阶函数,闭包,沙箱,递归
1:call,apply,bind2:高阶函数--函数的使用方式3:作用域和作用域链,预解析4:闭包5:沙箱6:递归1.1:call和apply都是改变this指向对象.call(对象,值,值);对象.apply(对象,[值,值]);Call和apply并不在实例对象中,而是在Function的prototype里面<!DOCTYPE html>&l...原创 2019-03-29 23:11:02 · 186 阅读 · 0 评论 -
前端全栈学习第十五天-js高级-第三天:实例对象,原型对象,拷贝
1:原型2:继承3:函数1:原型1.1概念:每个实例对象都有一个属性__proto__,是原型,浏览器使用,不标准的属性每个构造函数都有一个属性prototype,是原型,程序员使用1.2:原型链:实例对象和原型对象之间的关系,通过__proto__,prototype来链接1.3原型指向是否可以改变(方法):通过改变构造函数的原型对象来改变构造函数创建的实例对象指向。(如果...原创 2019-03-29 20:03:59 · 144 阅读 · 0 评论 -
前端全栈学习第八天-H5
本来有一个京东项目需要些但是写了一部分,发现太多了,慢慢就学h5c3再单独写一个京东案例1:html5新标签与特性兼容性问题(ie9以上的版本)常用新标签header:定义文档的头部,页眉nav:定义导航链接部分footer:定义文档或节的底部,页脚section:定义文档中的节(session,时区)article:定义文章aside:定义其所处内容之外的内容...原创 2019-01-30 17:46:20 · 311 阅读 · 0 评论 -
前端全栈学习第十一天-CSS3
1:属性选择器<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body>属性选择器:属性是相对于原创 2019-02-06 22:16:07 · 143 阅读 · 0 评论 -
前端全栈学习第十天-H5
01-HTML-5网络监听接口<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body>&原创 2019-02-03 10:32:15 · 213 阅读 · 0 评论 -
前端全栈学习第九天-H5
1:什么是H5,h5是在原有的基础上有又新增的标签兼容性问题(ie9以下的版本)常用新标签header:定义文档的头部,页眉nav:定义导航链接部分footer:定义文档或节的底部,页脚section:定义文档中的节(session,时区)article:定义文章aside:定义其所处内容之外的内容,侧边ie9也是部分支持,那该怎么解决呢?由于默认的标签类型都是行...原创 2019-01-31 22:23:20 · 255 阅读 · 0 评论 -
前端全栈学习第六天-css
不是所有布局都需要清除浮动,谁影响布局,我们清除谁1:清除浮动的本质清除浮动主要为了解决父级元素因为子级浮动引起内部高度为0 的问题其实的本质叫闭合浮动会更好一些。清除浮动就是把浮动的盒子圈到里面,父盒子闭合出口和入口,不让他们出来影响其他元素。2:清除浮动的方法额外标签法父级添加overflow属性方法使用after伪元素清除浮动使用before和after双伪元...原创 2019-01-21 20:43:21 · 207 阅读 · 0 评论 -
前端全栈学习笔记第五天 - CSS
1:盒子居中对齐在写盒子居中对齐之前,先看一个文字居中对齐: text-align: center//可以让盒子内容(文字,行内元素,行内块元素)居中对齐;让盒子居中对齐 margin: auto auto;满足两个条件必须是快元素必须指定了宽度2:外边距合并利用margin定义同级块级元素的外边距的时候,可能会出现外边距合并的情况(也称外边距塌陷)...原创 2019-01-19 00:19:47 · 183 阅读 · 0 评论 -
前端全栈学习笔记第四天 - CSS
之前很杂的把前端几乎学了一遍,从html,css,h5,c3,js,jq,ajax,php,vue,微信小程序,微信小游戏,three.js,node,mongodb现在再系统的学一遍,为明年实习打下扎实的基础,简单的就不再赘述。先看一下第四天的学习路线第四天的学习第一个重头戏是标签的类型(显示模式)第二个是css三大特性第三个是css背景一 :标签的显示模式:display...原创 2019-01-10 23:06:29 · 224 阅读 · 0 评论 -
前端全栈学习笔记第三天 - CSS
之前很杂的把前端几乎学了一遍,从html,css,h5,c3,js,jq,ajax,php,vue,微信小程序,微信小游戏,three.js,node,mongodb现在再系统的学一遍,为明年实习打下扎实的基础,简单的就不再赘述。先看一下第三天的学习路线第三天的第一个重头戏是css选择器,其次是字体样式,文本样式还有一个小的导航栏案例一:css选择器css选择器里面分为基本选择器,符合...原创 2019-01-07 23:20:20 · 200 阅读 · 0 评论 -
前端全栈学习笔记第二天 - HTML
之前很杂的把前端几乎学了一遍,从html,css,h5,c3,js,jq,ajax,php,vue,微信小程序,微信小游戏,three.js,node,mongodb现在再系统的学一遍,为明年实习打下扎实的基础,简单的就不再赘述。先看一下第二天的学习路线第一天介绍到了标签,第二天也是继续介绍标签。1:表格标签tr,td,thtr:行td:单元格th:标题标签(自动居中,加粗...原创 2019-01-04 11:19:45 · 354 阅读 · 0 评论 -
前端面试题总汇(html+css)
最近学完html,css是时候后来一波面试题来巩固一下知识了,上面是题目,下面是答案一、HTML 和 CSS...............................................................................................................................191、你做的页面在哪些流览器测...原创 2019-01-30 17:55:55 · 861 阅读 · 0 评论 -
前端全栈学习第十二天-js第二天-基础
1:一元运算符 ++,--2:顺序控制3:分支结构 if,if-else ,if-else if-else if-else,switch-case ,三元表达式4:循环结构:while,do-while,for,for-in(后期)5:案例(每个三遍)1:一元运算符1)正常的单个++在前,++在后,都是在自增var a = 1;var b=++a;console.lo...原创 2019-02-17 14:21:04 · 145 阅读 · 0 评论 -
前端全栈学习第十五天-js高级-第二天-贪吃蛇项目
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> #map { width: 400px; heigh...原创 2019-03-29 14:48:58 · 161 阅读 · 0 评论 -
前端全栈学习第十四天-js-WebAPI-第二天
1:元素的样式操作案例2:innerText和innerContent兼容代码3:自定义属性1:元素的样式操作案例案例1:小图大图的切换思路:大图放在a链接里面,是看不到的,里面再包一个img小图当你点击小图的时候,其实就是在点大图的链接,然后把大图的href赋值给指定的图片,如果不想丢掉当前页面,可以组织超链接默认跳转,return false<!DOCTYPE h...原创 2019-03-13 15:05:05 · 144 阅读 · 0 评论 -
前端全栈学习第十五天-js高级-第一天
1:三种创建对象的方式2:原型引入3:如何把局部变量变成全局变量4:随机产生小方块1:三种方式创建的字面量的方式var per1 = { name: "哈哈", age: 12, eat: function () { console.log("大家好"); }};per1.eat();自定义构造函数注意点:自定义构造函...原创 2019-03-20 16:51:57 · 173 阅读 · 0 评论 -
前端全栈学习第十三天-js-WebAPI-DOM 第一天
1:js的三部分2:dom操作页面元素(一件事有触发,有响应,有事件源):基本元素操作,表单元素操作3:元素的样式操作1:js三部分a:ECMAscript:js基本语法b:DOM文档对象模型 -- 操作页面的元素--dom树由文档和文档中所有的元素组成的树状结构图c:BOM 浏览器对象模型 --操作浏览器2:dom操作页面元素A:基本元素操作操作元素的时候,一般都是通过...原创 2019-03-11 20:25:54 · 197 阅读 · 0 评论 -
前端全栈学习第十二天-js第五天-基础
1:面向对象的思想2::创建对象的三种方式及工厂模式3:json格式的数据及遍历4:数据类型深入5:内置对象1:面向对象的思想1)根据需求找对象,所有的事由对象做,注重结果2)面向对象的三大特性:继承,封装,多态3)Js不是面向对象语言,但是可以模拟面向对象的思想4)Js是一门基于对象的语言5)有特征和行为的具体某个事物称为对象6)对象的特征--属性 行...原创 2019-02-26 12:43:47 · 159 阅读 · 0 评论