功能: 可以来增强用户和html页面的交互过程,可以来控制html元素,让页面有一些动态的效果,增强用户的体验。
一、概述 1. 什么是javaScript * 客户端脚本语言,不能独立运行 2. JavaScript是干啥的 * HTML:控制网页内容 * CSS:控制网页样式 * JS:控制网页行为 二、ECMAScript 1. 与HTML结合方式 ① 内部 * <script> </script> ② 外部 * <script type="text/javascript" src="URL"></script> ③ 位置 * 可以出现在任何地方,一般位于 body 最后,便于资源加载
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
网上的帖子大多深浅不一,甚至有些前后矛盾,在下的文章都是学习过程中的总结,如果发现错误,欢迎留言指出~
不久前看过一篇不错的文章,作者用了15行代码就实现了一个简单的模板语法,我觉得很有趣,建议在阅读本文之前先看一下这个,本文不会讲解一些细节实现,这里是传送门:只有20行的Javascript模板引擎 这个模板语法实现的核心点是利用正则表达式来匹配到模板语法里面的变量和JS语句,遇到变量就将匹配到的字符串 push 到一个数组中,遇到 JS 语句就执行,最后再把数组中的字符串 join 起来,用 Function 来解析执行这串字符串,最终将执行后的结果放到指定 DOM 节点的innerHTML 里面。 但是这个模板语法还是有很多不足,比如不支持取余运算,不支持自定义模板语法,也不支持if、for、switch 之外的JS语句,缺少 HTML 实体编码。 恰好我这阵子也在看 underscore 源码,于是就参考了一下 underscore 中 template 方法的实现。 这个是我参考 template 后实现的模板,一共只有60行代码。
本文为 《JavaScript》 读书笔记,是利用中午休息时间、下班时间以及周末整理出来的,此书虽有点老旧,但谈论的性能优化话题是每位同学必须理解和掌握的,业务响应速度直接影响用户体验。
2. 特点:灵活、逻辑性非常强、以非常简单的方式对字符串进行复杂的控制 3. 创建正则表达式
周末阅读完了 koa 的源码,其中的关键在于 koa-compose 对中间件的处理,核心代码只有二十多行,但实现了如下的洋葱模型,赋予了中间件强大的能力,网上有许多相关的文章,强烈建议大家阅读一下。
前言 emmmm 没什么说的,想说的都在代码里 环境使用 Python 3.8 解释器 3.10 Pycharm 2021.2 专业版 selenium 3.141.0 本次要用到selenium模块,所以请记得提前下载好浏览器驱动,配置好环境 代码实现 先是安装、导入所需模块 from selenium import webdriver # 导入浏览器的功能 import re # 正则表达式模块, 内置 import time # 时间模块, 程序延迟 1. 创建一个浏览器对象 drive
模板解析 解决的问题: 将data和js+html片段解析成html片段,完成赋值和js逻辑,如下所示: 输入: var data = { name: 'hwm', articles: [{ title: 'the first one' }, { title: 'the last one' }] }; tpl = 'Hi my name is <%this.name%>.My articles are listed as followed:' + '<ul
Hi my name is <%this.name%>.
My articles are listed as followed:
“ 关注 前端开发社区 ,回复 '领取资源',免费领取Vue,小程序,Node Js,前端开发用的插件以及面试视频等学习资料,让我们一起学习,一起进步
至于react-router帮助我们实现了什么东西我就不过多阐述了, 这个直接移步官方文档, 我们下面直接聊实现
JavaScript不同于HTML、CSS,其是一种客户端脚本语言,运行在客户端浏览器中,每一个浏览器都有JavaScript的解析引擎。其是脚本语言,不需要编译,直接可以被浏览器解析执行。
尽管 ECMAScript 是一个重要的标准,但它并不是 JavaScript 唯一的部分,当然,也不是唯一被标准化的部分。实际上,一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:
一门客户端脚本语言(客户端指运行在客户端浏览器中,每一个浏览器都有JavaScript解析引擎。脚本语言指不需要通过编译,直接就可以被浏览器解析执行)
JS正则的创建有两种方式: new RegExp() 和 直接字面量。 //使用RegExp对象创建 var regObj = new RegExp("(^\s+)|(\s+$)","g"); //使用直接字面量创建 var regStr = /(^\s+)|(\s+$)/g; 其中 g 表示全文匹配,与之相关的还有 i 和m,i 表示匹配时忽略大小写,m 表示多行匹配,如果多个条件同时使用时,则写成:gmi 二、()、[]、{} 的区别 () 的作用是提取匹配的字符串。表达式中有几个()就会得到几个
React在Typescript里的路由跳转示例: 第一步,设置路由配置文件(示例在routeMap.ts文件中配置)。 第二步,在页面中根据不同情况对页面路由进行引用(见AuthHOC.tsx) 第三步,在APP中引用路由页面(见:APP.tsx) 1、APP.tsx import React from 'react'; import {BrowserRouter as Router, Switch} from 'react-router-dom' import {routerConfig} from '
本篇文章主要介绍了Nginx location 匹配规则,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
随着互联网科技的迅速发展,人们对于互联网的依赖性却来越强。各种账号密码出现在人们生活的方方面面。为了提高密码的安全性,很多人都会设置一些复杂的密码。有的网站、app在用户注册的时候也会显示密码的破译困难等级,以此来提醒客户设置更加复杂的密码。如下图所示,就是我们常见的提示密码强度的效果:
通过代码可以看到这个按钮的点击逻辑:根据不同活动状态做两件事情,发送日志埋点和跳转到对应页面,大家可以很轻易的提出这段代码的改写方案,switch出场:
作者:jolamjiang,腾讯 WXG 前端开发工程师 前言 最近工作中有一些同学在做一些效能工具的时候遇到需要写一门领域相关语言(DSL)及其解析器的场景,笔者恰好有相关的经验向大家指一下北。 首先请问一下大家有没有想过这个功能怎么做? 点击播放视频 本文将围绕如何实现类似于 Excel 中 =C1+C2+"123" 这样子的表达式的功能这一例子,在不需要编译原理的相关知识的前提下,用写正则表达式作为类比,借助一个工具库,讲述实现一个领域相关语言的解析器的一般步骤,让你能够快速实现一个解析器。
我们编写js代码时经常遇到复杂逻辑判断的情况,通常大家可以用if/else或者switch来实现多个条件判断,但这样会有个问题,随着逻辑复杂度的增加,代码中的if/else/switch会变得越来越臃肿,越来越看不懂,那么如何更优雅的写判断逻辑,本文带你试一下。
2.去除Switch中的<Redirect>,用react-router-dom中的Redirect 替代,或者用 <Navigate> 实现
Node.js有一些核心类型:number,boolean,string,object、undefined 和 function。
看一下结构,还是比较清晰的。jQuery的dom对象直接调用就行了,下面我拿jQuery官方上的一个例子来说明
不支持defer属性的浏览器:defer、script、load 支持defer属性的浏览器:script、defer、load 3.2 动态添加script标签,添加到head中比添加到body中安全 3.3 XHR动态脚本注入兼容性好,但不能跨域
ps:这里的let在ECM6中可用,可能在较低的版本中无法正常使用,pycharm在使用上述关键字的时候如果出现了报错说明js版本没有选择6 需要我们自定义设置
简介 JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型 1.注释 单行 // 多行 /* */ 2.引用方式 <head> <meta charset="UTF-8"> <title></title> <script src="commons.js"></script> </head> <body> <script> alert('derek') </script> </body> 3.JavaS
1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript提交给国际标准化组织ECMA,希望这门语言能够成为国际标准。次年,ECMA发布262号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为ECMAScript,这个版本就是1.0版。
当初笔者做这套题的时候不仅怀疑智商, 连人生都开始怀疑了…. 不过, 对于基础知识的理解是深入编程的前提. 让我们一起来看看这些变态题到底变态不变态吧! 第1题 ["1", "2", "3"].map(parseInt) 知识点: Array/map Number/parseInt JavaScript parseInt 首先, map接受两个参数, 一个回调函数 callback, 一个回调函数的this值 其中回调函数接受三个参数 currentValue, index, arrary; 而题目中, m
心急的直接看代码:GitHub – chenjiangtao/mybatis-pagehelper-datatables
angualr 要点温习 1、一些 ng 指令 ng-disabled true|false ,规定一个元素是否被禁止,但不会为隐藏 ng-keydown/ng-keypress/ng-keyup ng-mousedown/ng-seenter 鼠标穿过 2、一些 angular 内置方法/类比 jq angular.lowercase() angular.uppercase() angular.copy() 深克隆 angular.forEach() 类比 forEach var objs = [
这两天一直没有更新任何的文章,是因为我一直在想这个加密算法应该怎么写,这几天想了很多,终于写了一个自己觉得还比较完备的加密算法,我们没有写之前首先要明白,做一个加密的算法是一件逻辑性要相对强一点,也就是说考虑的要全面一点,这样才可以保证的是加密之后的密码不那么容易的被破解掉。
访问 http://localhost:3000/hello/world 页面会输出 /hello/world,也就是说上下文的请求request对象中url之就是当前访问的路径名称,可以根据ctx.request.url 通过一定的判断或者正则匹配就可以定制出所需要的路由。
JavaScript,弱类型脚本语言,增强交互和用户体验提高效率等。JavaScript=ECMAScript+JavaScript特有的内容(BOM对象+DOM对象) ECMAScript:与html结合:内部JS(script标签定义,在html文档内部,按位置先后执行),外部JS(script标签引入src元素), 注释:当行//,多行/**/,数据类型:原始数据类型(基本,number[整数,小数,NaN not a number],string,boolean,null,undefined),引用数据类型(对象) 变量,var定义,开辟空间不定义类型。赋值可改变类型。document.write输出,添加标签字符串换行。typeof(变量)关键字,打印数据类型(null是一个object的bug)。 运算符,一元运算符:++,--,+-(正号,负号[可以将其他类型转number,无法转换为NaN]),算数运算符:+-*/%,赋值运算符=,+=,-=,比较运算符:>,>=,<,<=,==,!=,类型不同则转换类型比较,===(不转换类型比较)。
找到.eslintrc.js的文件中,直接删除里边全部内容就可以了,但不要删除这个文件,否则会报错Error: No ESLint configuration found.
React Router 事实上是React官方的标准路由库。当你在一个多视图的React应用中来回切换,你需要一个路由来管理那些URL。React Router 专注于此,同步保持你应用的UI和URL。
1996年11月,JavaScript 的创造者 Netscape 公司,决定将 JavaScript 提交给国际标准化组织ECMA,希望这种语言能够成为国际标准。次年,ECMA 发布 262 号标准文件(ECMA-262)的第一版,规定了浏览器脚本语言的标准,并将这种语言称为 ECMAScript ,这个版本就是1.0版。
1、uppercase,lowercase 大小写转换 {{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRING {{ "TANK is GOOD" | lowercase }} // 结果:tank is good 2、date 格式化 {{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25 3、number 格式化(保留小数) {{149016.1945000 | number:2}}//保留两位 {{149016.1945000 | number}}//默认为保留3位 4、currency货币格式化 {{ 250 | currency }} // 结果:$250.00 {{ 250 | currency:"RMB ¥ " }} // 结果:RMB ¥ 250.00 5、filter查找 输入过滤器可以通过一个管道字符(|)和一个过滤器添加到指令中,该过滤器后跟一个冒号和一个模型名称。 filter 过滤器从数组中选择一个子集 // 查找name为iphone的行 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | filter:{'name':'iphone'} }} 同时filter可以自定义比较函数。 6、limitTo 截取 {{"1234567890" | limitTo :6}} // 从前面开始截取6位 {{"1234567890" | limitTo :6,6}} // 从第6位开始截取6位 {{"1234567890" | limitTo:-4}} // 从后面开始截取4位 7、orderBy 排序 // 根据id降序排 {{ [{"age": 20,"id": 10,"name": "iphone"}, {"age": 12,"id": 11,"name": "sunm xing"}, {"age": 44,"id": 12,"name": "test abc"} ] | orderBy:'id':true }}
最近在搭建一个开源的项目环境时,我需要打一个 ES 模块的包,以便开发者可以直接通过 npm 就能安装并使用,但是这个项目注定了会有样式,而且我希望打出的包的文件目录和我开发目录是一致的,似乎 Rollup 是一个不错的选择,但是我(自虐般地)选择了 Typescript 自带的编译器 tsc ,然后我就开始我的填坑之旅~
一、JavaScript概述 1、JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnv软件中),后将其改名ScriptEase(客户端执行的语言)。 Netscape(网景)接收Nombase的理念。(Brendan Eich)在其Netscape Navigator 2.0产品中开发出一套livescript的脚本语言。Sun和Netscape共同完成,后改名叫JavaScript。 微软随后模仿在其IE3.0的产品中搭载了一个J
本期精读文章是:TC39, ECMAScript, and the Future of JavaScript
JavaScript的基本组成 学习JavaScript的第一步,在于了解JavaScript的基本组成,了解JavaScript技术当中有哪些类型的知识。 JavaScript = ECMAScript + DOM + BOM 其中ECMAScript表示的是基本语法,包括我们实现JS的基本语法,如变量的声明、基本的语句(if、for、switch等)、函数、参数、作用域、this、原型继承、数组字符串正则等各类方法等。 DOM,表示文档对象模型,其实就是JavaScript语言中,能够操作标签以及标签属
JavaScript是一种基于对象的脚本编程语言,是浏览器上的程序语言。当web容器输出内容到浏览器时,这个内容是包含js源代码的,此时,JavaScript可以操作浏览器上的一切内容,在浏览器上提供用户交互,页面美化,增加页面的智能性。 JavaScript是一种基于对象的语言,通过 JavaScript代码来操作对象――访问或者设置对象的属性,编写对象的特定的事件(方法)代码。 JavaScript中的对象是由属性(properties)和方法(methods)两个基本的元素的构成的。前者是对象在实
JavaScript技术 1.DOM相关知识 什么是DOM:Document Object Model,文档对象模型 文档:指的是标记型文档(html,xml) 对象:可以使用dom里面的相关属性和方法来解析标记型文档。 Dom的组成:核心Dom,Html Dom,XML Dom。 Dom如何解析html文档:
ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。
领取专属 10元无门槛券
手把手带您无忧上云