JavaScript - 教程之家

182浏览

0评论

JavaScript对象字面量和构造函数原理与用法详解

本文实例讲述了JavaScript对象字面量和构造函数。分享给大家供大家参考，具体如下：对象中只有两种属性:（一种比较细的分法）属性(数据属性)比如：名字，年龄，性别，出版社，地址等信息；
方法...

2020-05-27

141浏览

0评论

基于js判断浏览器是否支持webGL

起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。在各种浏览器上运行都没问题，在IE上也做了兼容代码。但是今天接电话，老板说你这网页在xp上不显示啊。IE上...

2020-05-27

129浏览

0评论

vue2.x 对象劫持的原理实现

目标：手写迷你版Vue
一：使用rollup打包,打包后的代码体积更小，更适合写框架源码的打包npm i rollup -D二：安装babel相关的包，以及实现静态服务，设置环境变量的包npm i @babel/core...

2020-05-27

115浏览

0评论

vue2.x数组劫持原理的实现

接上篇Vue2.x 对象劫持，继续来写数组劫持
实现原理：
1 重新定义原生数组方法push unshift shift pop splice sort reverse 因为这些方法可以修改原数组。
2 拿到原生数组方法...

2020-05-27

153浏览

0评论

JS实现横向跑马灯效果代码

首先我们需要一个html代码的框架如下：<div style="position: absolute; top: 0px; left: 168px; width: 100%; margin-left: auto; margin-right: auto; height: 47px; borde...

2020-05-27

136浏览

0评论

javascript设计模式 – 命令模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 命令模式原理与用法。分享给大家供大家参考，具体如下：介绍：命令模式是一种数据驱动的设计模式，将请求以命令的形式包裹在对象中，并传递给调...

2020-05-27

128浏览

0评论

javascript设计模式 – 中介者模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 中介者模式原理与用法。分享给大家供大家参考，具体如下：介绍：在前端开发的过程中，组件与组件之间的通讯特别常见，一个组件的change需要引起...

2020-05-27

237浏览

0评论

Vue中el-form标签中的自定义el-select下拉框标签功能

页面写死el-select下拉框标签：通过v-for="item in stateArr"绑定，stateArr声明在Vue组件里面的data参数里面代码如下：...

2020-05-27

164浏览

0评论

详解微信小程序工程化探索之webpack实战

前言
微信小程序因为其便捷的使用方式，以极快的速度传播开来吸引了大量的使用者。市场需求急剧增加的情况下，每家互联网企业都想一尝甜头，因此掌握小程序开发这一技术无疑是一...

微信

2020-05-27

129浏览

0评论

vue实现购物车的监听

利用vue简单实现购物车的监听，供大家参考，具体内容如下主要运用的vue的监听，有兴趣的可以看看实现过程<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>利用vue实...

2020-05-27

114浏览

0评论

javascript利用键盘控制小方块的移动

本文实例为大家分享了利用键盘控制小方块的移动，供大家参考，具体内容如下原理1. 利用键盘控制移动，则需要了解onkeydown函数，表示某个按键被按下，可以以此绑定一个事件响应函数，当...

2020-05-27

155浏览

0评论

vue实现淘宝购物车功能

本文实例为大家分享了vue实现淘宝购物车的具体代码，供大家参考，具体内容如下淘宝购物车功能，效果如下图非常简单的逻辑，没有做代码的封装，代码如下<div class="list-container">...

2020-05-27

174浏览

0评论

vue实现购物车功能（商品分类）

本文实例为大家分享了vue实现购物车功能的具体代码，供大家参考，具体内容如下new Vue({ el: "#app", data: { cIndex: 0, lists: [ { title: "推荐商品", goods: [ { id...

2020-05-27

170浏览

0评论

深入浅析JavaScript中的in关键字和for-in循环

1.in关键字属性名 in 对象，用来判断某个属性在对象中是否存在与其严格相等的属性名，返回boolean值属性名必须是字符串或数字var obj = {　　a : 1,　　b : 2}console.log('a'...

2020-05-27

223浏览

0评论

Vue的全局过滤器和私有过滤器的实现

Vue允许自定义过滤器可被用作一些常见的文本格式化过滤器可以用在两个地方：mustache插值表达式和 v-bind表达式过滤器应被添加在JavaScript表达式的尾部由“管道”符指示(...

2020-05-27

202浏览

0评论

VUE+elementui组件在table-cell单元格中绘制微型echarts图

需求效果图示例
实际完成效果图
**代码实现注：table表格为二次封装的子组件
-在table表格中根据 scope.$index动态设置元素的id ，便于指定单元格的echarts初始化；-在单元格中...

2020-05-27

162浏览

0评论

javascript设计模式 – 备忘录模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 备忘录模式原理与用法。分享给大家供大家参考，具体如下：介绍：在我们的开发中偶尔会遇到这样一种情况，需要对用户的行为进行撤销。要想实现...

2020-05-27

141浏览

0评论

javascript设计模式 – 策略模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 策略模式原理与用法。分享给大家供大家参考，具体如下：介绍：策略模式中可以定义一些独立的类来封装不同的算法，每一个类封装一种具体的算法...

2020-05-27

185浏览

0评论

解决angular 使用原生拖拽页面卡顿及表单控件输入延迟问题

说明之前有一个angular项目,页面上表单不算多，也就一百来个（这个不固定，有的地方多，有的地方少），但是再输入的时候会造成输入延迟，反应不灵敏，对用户体验极其不好。还有一个功能就是...

2020-05-27

130浏览

0评论

react 原生实现头像滚动播放的示例

本文介绍了react 原生实现头像滚动播放的示例，分享给大家，具体如下：之前需要的是下面这个效果现在。。。憋说话，先看看效果。感觉很简单呀，直接渲染，transform就可以了，嗯嗯，是的没...

2020-05-27

126浏览

0评论

js 解析 JSON 数据简单示例

本文实例讲述了js 解析 JSON 数据。分享给大家供大家参考，具体如下：JSON 数据如下：{ "name": "mkyong", "age": 30, "address": { "streetAddress": "88 8nd Street",...

2020-05-27

126浏览

0评论

Vue computed 计算属性代码实例

什么是计算属性？？？1、在computed中，可以定义一些属性，这些属性叫做【计算属性】2、计算属性的本质是一个方法，不过一般是将他们的名称直接当做属性使用，不会当方法调用<!DOCTYPE ht...

2020-05-27

355浏览

0评论

javascript设计模式 – 状态模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 状态模式原理与用法。分享给大家供大家参考，具体如下：介绍：状态模式用于解决系统中复杂对象的状态转换以及不同状态下行为的封装问题。状...

2020-05-27

125浏览

0评论

javascript设计模式 – 观察者模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 观察者模式原理与用法。分享给大家供大家参考，具体如下：介绍：前面我们针对系统内一对多，多对多的情况做了解决方案，是使用中介者模式，将所有...

2020-05-27

153浏览

0评论

微信小程序实现手指拖动选项排序

本文实例为大家分享了微信小程序实现手指拖动选项排序的具体代码，供大家参考，具体内容如下效果：wxml：<view> <view class="dileititle">手指移动选项排序</view> <view style="w...

微信

2020-05-27

131浏览

0评论

JS脚本实现定时到网站上签到/签退功能

之前介绍过使用temperMonkey屏蔽CSDN广告的方法，主要就是要针对性地分析网站结构，然后用代码去改变或者操作DOM。今天也一样，我们需要观察网页结构，找到我们要操作的按钮，触发他...

2020-05-27

125浏览

0评论

nuxt+axios实现打包后动态修改请求地址的方法

需求：把请求地址等一些配置暴露出来以便打包后动态修改，而不需要重新打包编译。这样也是挺不错的，当一个项目需要部署到几个不同的服务器上时候，就不用说每次都要修改后再重新打...

2020-05-27

183浏览

0评论

如何修改Vue打包后文件的接口地址配置的方法

1、背景常规的vue项目分为本地环境和生产环境，我们只要对 config 文件夹下的 dev.env.js 和 prod.env.js 做相应的配置即可。但是最近在做的项目中，涉及到私有化部署，就是对应...

2020-05-27

144浏览

0评论

谈谈我在vue-cli3中用预渲染遇到的坑

前言
在开发自己的个人网站的时候后，选择了用vue来开发，不可避免的遇到要对seo做优化。鉴于目前页面也不多，因此首先采用的是预渲染的方式。
本来以为把插件一装，配置一配，咔咔咔...

2020-05-27

126浏览

0评论

javascript设计模式 – 模板方法模式原理与用法实例分析

本文实例讲述了javascript设计模式 – 模板方法模式原理与用法。分享给大家供大家参考，具体如下：介绍：模板方法模式是结构最简单的行为型设计模式，在其结构中只存在父类与子类之...

2020-05-27

154浏览

0评论

vue项目打包之开发环境和部署环境的实现

项目开发阶段和生产环境可能不一样如前端在开发阶段，接口可能是自己使用 node.js 搭建的服务器，API 返回的也都是假数据，等后台接口开发好后，再切换成后台提供的接口，等测试没有...

2020-05-27

376浏览

0评论

Vue Cli3 打包配置并自动忽略console.log语句的方法

下载插件npm i -D uglifyjs-webpack-plugin在 vue.config.js 引入使用const UglifyJsPlugin = require('uglifyjs-webpack-plugin')module.exports = { configureWebpack: {...

2020-05-27

159浏览

0评论

js实现简单的贪吃蛇游戏

本文实例为大家分享了js实现贪吃蛇游戏的具体代码，供大家参考，具体内容如下运行截图：源码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>贪吃蛇小游...

2020-05-27

202浏览

0评论

浅谈vue权限管理实现及流程

一、整体思路
后端返回用户权限，前端根据用户权限处理得到左侧菜单；所有路由在前端定义好，根据后端返回的用户权限筛选出需要挂载的路由，然后使用 addRoutes 动态挂载路由。二、...

2020-05-27

174浏览

0评论

JS eval代码快速解密实例解析

有一段js代码内容如下：eval(function(E,I,A,D,J,K,L,H){function C(A)后面内容省略。。。解密可以采用如下方法：方法一：打开谷歌浏览器，按F12，在Console窗口中把eval代码复制粘贴...

2020-05-27

176浏览

0评论

利用原生JS实现欢乐水果机小游戏

简介：玩家点击某个押注物品则在该物品上下注。点击开始则游戏开始，如果没有下注则不能开始游戏。
游戏中的物品有八中，分别为：苹果、西瓜、柠檬、橙子、铃铛、77、双星、BAR。...

2020-05-27

180浏览

0评论

Vue中通过vue-router实现命名视图的问题

在用vue-router路由处理一些需求的时候例如有时需要同时同级展示多个组件而不是嵌套展示
例如：创建一个布局有侧导航和主内容两个视图此时命名视图就派上用场了在路由对...

2020-05-27

336浏览

0评论

微信小程序图片右边加两行文字的代码

图片右边加两行文字先来一个效果图：下面来看代码wxml<view class="view_tupian_wenzi"> <image class="image_1" src="../images/main_yewu.png" /> <view class="view_wen...

微信

2020-05-27

162浏览

0评论

微信小程序实现滑动操作代码

前言本文使用动画组件wx.createAnimation来实现滑动操作：1. 左滑动显示操作项区域；2. 点击操作项触发相应方法；3. 右滑动和点击行收起操作项；4. 点击“删除”并确定则删除该条数...

微信

2020-05-27

164浏览

0评论

详解Vue3中对VDOM的改进

前言
vue-next 对virtual dom的patch更新做了一系列的优化，从编译时加入了 block 以减少 vdom 之间的对比次数，另外还有 hoisted 的操作减少了内存的开销。本文写给自己看，做个...

2020-05-27

161浏览

0评论

小程序开发之模态框组件封装

本文实例为大家分享了小程序模态框组件的封装具体代码，供大家参考，具体内容如下一、前言对于模态框肯定大家都知道，诸如：Bootstartp、element-ui、layui等等都有自己的弹出层，并...

2020-05-27

247浏览

0评论

Vue通过getAction的finally来最大程度避免影响主数据呈现问题

企业信息列表，查看某条记录时，弹窗页里要求展示企业的用户名，而用户名字段不在企业表里。为此，我们需要修改弹窗页的渲染方法。methods: { enterpriseInfo (record) { this.for...

2020-05-27

179浏览

0评论

基于Vue实现微前端的示例代码

   前端微服务化一直是前端社区的一个热门话题，早在2018年就有不少开发者提出过各种解决方案。或许是未得精髓，个人认为基于Web Components的实现脱离整体打包逻...

2020-05-27

199浏览

0评论

vue中使用带隐藏文本信息的图片、图片水印的方法

一.带隐藏文本信息的图片通过RGB 分量值的小量变动，不影响对图片的识别。因此，我们可以在图片加入文字信息。最终达到如下效果:首先，在该组件中加入img用于显示图片<canvas ref...

2020-05-27

271浏览

0评论

vue 路由懒加载中给 Webpack Chunks 命名的方法

最早的路由定义方式import Vue from 'vue'import VueRouter from 'vue-router'import Home from '../views/Home.vue'import About from '../views/About.vue'import Login...

2020-05-27

168浏览

0评论

Vue中函数防抖节流的理解及应用实现

防抖和节流的目的都是为了减少不必要的计算，不浪费资源，只在适合的时候再进行触发计算。一、函数防抖定义
在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时；典型...

2020-05-27

192浏览

0评论

详解ES6 CLASS在微信小程序中的应用实例

ES6 CLASS基本用法
class Point { constructor(x, y) { this.x = x; this.y = y; } toString() { return '(' + this.x + ', ' + this.y + ')'; }}1.1 constructor方法　...

微信