开篇日常立个flag…… 前言 最近在做一些应用，类似于单页应用，想实现类似于 Vue 路由的效果。 但是个人 Vue 基础四舍五入约等于无，而且看着 Vue-router 吃力+用不起来（因为我的项目前后端不分离，而且使用的 js 语法基本上停留在远古时代：ES5甚至更久远以前……） 之前尝试过模拟，但是模拟太痛苦了，而且一堆问题，还不好维护。 于是想着自己用原生 js 写一个简单的单页应用路由吧。 效果 话不多说，先上效果图 源码 gi...
在过去的几年中，javaScript语言进行了多次更新。为了跟上技术更新的脚步，时刻保持一颗学习的心。趁着午休的时间学习熟悉一下数组的includes、reduce的使用。 Array.prototype.includesES7添加对此方法的支持，includes() 方法用来判断一个数组是否包含一个指定的值的元素，并返回布尔值true或false，如果包含则返回 true，否则返回 false。 语法arr.includes(valueToFind[, fromIndex]) 参数valueToFind（必须）：需要查找的元素...
1、输入一个值，返回其数据类型**function type(para) {return Object.prototype.toString.call(para) }2、数组去重function unique1(arr) {return [...new Set(arr)] }function unique2(arr) {var obj = {};return arr.filter(ele => {if (!obj[ele]) {obj[ele] = true;return true;}}) }function unique3(arr) {var result = [];arr.forEach(ele => {if (result.indexOf(ele) == -1) {result.push(ele)}})return result; }3、字符...
前端 JavaScript 焦點事件處理 何謂聚焦?focus/blur 事件focus/blur 方法允許在任何元素上聚焦 : tabindex 何謂聚焦? 所謂聚焦(focus)通常是在說聚焦到一個元素上，而聚焦到一個元素上通常意味著 “準備要此處接受輸入”，所以，這正是我們可以用代碼來初始化一些我們所需的功能的時刻。 失去焦點(blur)可能還更重要一些，這個事件可能發生在當用戶點擊頁面其他地方，或是跑去做別的事情等等。所以失去焦點通常意味著 “數據輸入都...
相关知识点 数据类型、运算、对象、function、继承、闭包、作用域、原型链、事件、RegExp、JSON、Ajax、DOM、BOM、内存泄漏、跨域、异步加载、模板引擎、前端MVC、前端MVVM、路由、模块化、Http、Canvas、jQuery、ECMAScript 2015（ES6）、Node.js、AngularJS、Vue、React… 题目&答案 介绍一下 JS 的基本数据类型。Undefined、Null、Boolean、Number、String 介绍一下 JS 有哪些内置对象。Object 是 JavaScript 中所有对象的父对象...
在我们进行前端开发的过程中，需要遵循一定的代码编写规则，这样才能够让我们写出更合理的、易于阅读和维护的代码，那么你知道在JavaScript中有哪些需要注意的地方吗？ 一.块级作用域let 取代 var - 语法上的编程风格 1.ES6 提出了两个新的声明变量的命令：let和const。 其中，let完全可以取代var，因为两者语义相同，而且let没有副作用。 上面代码如果用var替代let，实际上就声明了两个全局变量，这显然不是理...
前言 无论是什么程序设计语言，函数都是重要的一部分内容，在实际开发过程中有很多语法的表达和功能的实现都来源于函数。不过与其它语言不同的是，JavaScript是通过函数来实现面向对象的特性并非通过专门的面向对象语法去实现的，因为JavaScript没有属于自己的专门的面向对象语法，所以函数在JavaScript中更是重中之重。 一、函数的介绍 1.什么是函数？ 函数是执行特定任务的代码块，之后通过调用函数实现特定任务功能的实...
前端面试题Html 目录 前端面试题 Html CSS JavaScript Vue#块元素和空元素#html语义化html5新特性和移除标签渐进增强和优雅降级浏览器内核浏览器输入url到显示页面过程实现圆形可点击区域cookie,sessionStorage,localStorage网站性能优化 CSS 居中问题清除浮动外边距坍塌盒子模型em和remBFCposition定位css初始化自适应布局css优化 JavaScript typeof返回数据类型强制类型转换this创建对象数组去重判断是否为数组原型事件代理同步异...
1.JS几个重要的操作符与变量值 1.1 typeof 可以使用 typeof 操作符来检测变量的数据类型。<!DOCTYPE html> <html lang="en"><head><meta charset="utf-8" /><title>JS简单学习</title></head><body><p> typeof 操作符返回变量或表达式的类型。</p><p id="demo"></p><script>var x=666;var s="redis";var flag=true;var num=[1,2,3,4];var person={name: "zhangsan",age: 25};document.getElementById("demo").innerHTML=typeof x +...
编程式导航——通过js方法实现路由跳转 & 获取编程式导航传递的参数-props.location.state & 如果组件不是路由组件-必须使用withRouter包裹原始的组件通过js动态控制路由跳转 导入withRouter import { withRouter } from "react-router-dom";导出时使用withRouter包裹组件 export default withRouter(Login);被包裹的组件中可以通过props获取history对象 let { history } = this.props然后可以使用history对象调用push方法进行跳转...
1.JS事件HTML 事件是发生在 HTML 元素上的事情。当在 HTML 页面中使用 JavaScript 时， JavaScript 可以触发这些事件。HTML 事件可以是浏览器行为，也可以是用户行为。 以下是 HTML 事件的实例： HTML 页面完成加载HTML input 字段改变时HTML 按钮被点击 通常，当事件发生时，你可以做些事情。在事件触发时 JavaScript 可以执行一些代码。HTML 元素中可以添加事件属性，使用 JavaScript 代码来添加 HTML 元素。 单引号: <some-HTML...
实现的主要功能：判断按下了哪个按键，可以实现部分内容输入文本框不显示通过判断按下键来条件输出return false；所有的注释都在html中，解释的很详细，我就不再一一解释 注：这里我用的js是ES6 定义变量时采用let ES6以下替换为var即可判断键盘按下的是哪个键 <script>window.onload = function () {/*** 键盘事件不能绑定div，一般绑定给容易获取焦点的对象 eg：input* onkeydown* - 按下按键,如果一直按着会一直触发* ...
1.JS变量与代数一样，JavaScript 变量可用于存放值（比如 x=5）和表达式（比如 z=x+y）。变量是用于存储信息的"容器"。 变量可以使用短名称（比如 x 和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）。 变量必须以字母开头变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）变量名称对大小写敏感（y 和 Y 是不同的变量） JavaScript 语句和 JavaScript 变量都对大小写敏感。1.1 声明创建变量 在 JavaScript 中...
系列文章 前端学习 01 —— HTML5 前端学习 02 —— CSS01 前端学习 02 —— CSS 02 前端学习 02 —— CSS 03 前端学习 03 —— JavaScript 01 前端学习 03 —— JavaScript 02文章目录 系列文章五、内部对象5.1、Date5.2、JSON 六、面向对象编程6.1、原型继承6.2、class 七、操作BOM对象（重点）1、window2、navigator3、screen4、**location（重要）**5、document6、history 八、操作DOM对象（重点）8.1、获得DOM节点8.2、更新节...
实现一个简单的 JavaScript 状态机[每日前端夜话0xBF] 疯狂的技术宅 前端先锋 每日前端夜话0xBE每日前端夜话，陪你聊前端。每天晚上18:00准时推送。正文共：850 字预计阅读时间：7 分钟作者：Nalla Senthilnathan翻译：疯狂的技术宅来源：dzone使用简单的状态机创建干净且健壮的 UI 使用状态机可以构建健壮的 UI，其好处已有详细的描述—— 例如你可以参见Edward J. Pring 的文章和 David Khourshid 的视频。另外Krasimir Tsonev ...