js代码

JS 执行上下文

怎甘沉沦 提交于 2020-02-06 06:53:28
先看个小例子 function fn(){ console.log(a);//undefined; var a = 1; } fn(); 为什么打印出来的是 undefined 呢? 执行上下文概念   当代码运行时,会产生一个对应的执行环境,在这个环境中,所有变量会被事先提出来(变量提升),有的直接赋值,有的为默认值 undefined,代码从上往下开始执行,就叫做执行上下文。   在 JavaScript 的世界里,运行环境有三种,分别是:     1.全局环境:代码首先进入的环境     2.函数环境:函数被调用时执行的环境     3.eval函数: https://www.cnblogs.com/chaoguo1234/p/5384745.html (不常用) 执行上下文特点   1.单线程,在主进程上运行   2.同步执行,从上往下按顺序执行   3.全局上下文只有一个,浏览器关闭时会被弹出栈   4.函数的执行上下文没有数目限制   5.函数每被调用一次,都会产生一个新的执行上下文环境 执行上下文栈   执行全局代码时,会产生一个执行上下文环境,每次调用函数都又会产生执行上下文环境。当函数调用完成时,这个上下文环境以及其中的数据都会被消除,再重新回到全局上下文环境。处于活动状态的执行上下文环境只有一个。   其实这是一个压栈出栈的过程——执行上下文栈。        

PageHelper分页插件及通用分页js

我的未来我决定 提交于 2020-02-06 06:53:01
分页概述 1.物理分页 物理分页依赖的是某一物理实体,这个物理实体就是数据库,比如MySQL数据库提供了limit关键字,程序员只需要编写带有limit关键字的SQL语句,数据库返回的就是分页结果。建议使用。 2.逻辑分页 逻辑分页依赖的是程序员编写的代码。数据库返回的不是分页结果,而是全部数据,然后再由程序员通过代码获取分页数据,常用的操作是一次性从数据库中查询出全部数据并存储到List集合中,因为List集合有序,再根据索引获取指定范围的数据。 MyBatis 分页插件 - PageHelper 该插件目前支持以下数据库的 物理分页 : Oracle Mysql MariaDB SQLite Hsqldb PostgreSQL DB2 SqlServer(2005,2008) Informix H2 SqlServer2012 Derby Phoenix 分页插件 5.0 由于分页插件 5.0 版本和 4.2.x 实现完全不同,所以 master 分支为 5.x 版本,4.2 作为一个分支存在,如果有针对 4.2 的 PR,请注意提交到分支版本。 集成 使用 PageHelper 你只需要在 classpath 中包含 pagehelper-x.x.x.jar 和 jsqlparser-0.9.5.jar 。 如果你使用 Maven,你只需要在 pom.xml 中添加下面的依赖

js实现数组去重

痴心易碎 提交于 2020-02-06 05:21:23
数组去重是笔试及面试时的重要考题,现对已有方法进行如下总结: (1)思路:新建一个空的数组newArr,将需要去重的数组中的第一个元素传入,依次与原数组中剩余的元素进行比较,不重复则把元素传入到新数组newArr中。 这种方法实现思路简单,由于使用‘===’,可以实现对类似2和‘2’这种数字与字符串的比较。但是该算法创建了新的数组,并且使用双层循环,对时间和空间均存在一定的浪费。 1 Array.prototype.unique1 = function(){ 2 var newArr = [this[0]]; 3 //flag用来比较数组是否重复,不重复为true,重复为false 4 var flag = true; 5 for(var i = 1;i < this.length;i++){ 6 for(var j = 0; j < newArr.length; j++){ 7 if(newArr[j] === this[i]){ 8 flag = false; 9 break; 10 }else{ 11 flag = true; 12 } 13 } 14 if(flag){ 15 newArr.push(this[i]); 16 } 17 } 18 } 19 20 var arr=[1,2,2,'2',3,4,4,'a','a','b']; 21 console.log(arr

JavaWeb(4)-JS对象

牧云@^-^@ 提交于 2020-02-06 03:38:49
JS对象 js的string对象 创建string对象 string对象常用属性、方法 js的array对象 创建array对象 array对象常用属性、方法 js的Date对象 获取当前时间 常用方法 转换时间格式 获取当前的年、月、日、星期、时间 js的Math对象 js的全局函数 js函数的重载 js的bom对象 1.bom 2.对象: (1)navigator (2)screen (3)location (4)history (5)window js的dom对象 解析过程 node接口的特性和方法 DHTML js的document对象 常用方法 getElementById() getElementsByName() getElementsByTagName() write() js的string对象 创建string对象 var str = "abc" ; string对象常用属性、方法 1.属性 length表示字符串的长度 2.方法 (1)与html相关的方法 bold()方法:使用粗体显示字符串 str.bold() fontcolor():设置字符串颜色 str.fontcolor("red"); fontsize():设置字符串尺寸 str.fontsize(5) link():将字符串显示为超链接 str.link(url) sub(),sup()

JS实现简单时钟效果

寵の児 提交于 2020-02-06 02:53:51
老师上课需要我们做一个时钟的小作业 ,我把它放在上面记录一下啦 表盘和时针我都是用的背景图的形式,然后绝对定位,通过调整left和top确定时针、分针、秒针的位置,transform-origin设置它们的旋转中心 具体效果: HTML代码: <div class="box" id="box"> <span></span> <span></span> <span></span> </div> css代码: div.box{ width: 620px; height: 620px; background: url("images/time.jpg") no-repeat; background-size: 100%; margin: 20px auto; position: relative; } div.box span{ position: absolute; } div.box span:nth-child(3){ width: 58px; height: 208px; background: url("images/time_1.png") no-repeat -8px -44px; left: calc(50% - 29px); top: 130px; transform-origin: center 174px; } div.box span:nth-child(2){

JS条件语句优化

强颜欢笑 提交于 2020-02-06 02:47:19
1.对多个条件使用Array.includes eg: function test(fruit){ function test(fruit){ if(fruit=='apple' || fruit=='cherry' ){ 可改写为 console.log('red') =================================>> const redFruits=['apple','cherry','strawberry']; } if(redFruits.includes(fruit)){ console.log('red') } } } 2.更少的嵌套,尽早的返回 eg: 如果没有水果名称,抛出错误 如果红色水果数量超过10个,接受并打印 function test(fruit, quantity){ const redFruits=['apple','cherry','strawberry']; if(!fruit) throw new Error('No fruit!'); if(!redFruits.includes(fruit)) return; console.log('red''); if(quantity >10){ console.log('big quantity') } } 3.使用默认的函数参数和结构 4.选择Map或对象字面量

js图片放大缩小

余生长醉 提交于 2020-02-05 20:18:30
最近经常看见有人问怎样放大和缩小图片,我之前也做过一次,下面就把我的方法共享出来。我有2个种方法实现:第一种方法可以兼容IE和火狐( 其他的浏览器我没有测试 );第二种方法只能兼容IE。 第一种方法很简单,代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Image.aspx.cs" Inherits="ImageZoom.Image" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <style type="text/css"> img { border:#000000 1px solid; } </style> <script language="javascript" type="text/javascript"> //兼容IE和火狐 function ImageChange(args) { var oImg = document

js中的循环语句

无人久伴 提交于 2020-02-05 20:08:18
js中的循环语句可分为三种:1.while;2.do……while;3.for。 while的语法为 while (exp) { //statements; } var a=1,b=0; while(a<=1000){ if(a%2==0){ if(b%20==0) { document.write("<br>第"+parseInt(b/20+1)+"行偶数"); } document.write(a+"&nbsp"+"&nbsp"); b++; } a++; } 其中,exp为一条件判断语句,最终的结果都可以用一个布尔值表示,若其结果为true则进行下面{}里的语句,然后继续判断exp,直到exp的结果为false为止,若exp的结果为false,则跳过这条循环语句,执行接下来的代码。需要注意的是在{}里的语句必须存在对exp的结果产生影响的代码,否则循环会一直重复下去,形成死循环。 do……while语句与while语句大体上相同,唯一的不同之处是do……while语句会先执行语句,然后对条件进行判断。其语法为 do { //statements; }while (condition); 同样是上面的例子,其结果变为 var a=1,b=0; do{ if(a%2==0){ if(b%20==0) { document.write("<br>第"+parseInt(b/20+1

js基础知识点总结

房东的猫 提交于 2020-02-05 17:31:12
如何在一个网站或者一个页面,去书写你的js代码: 1.js的分层(功能):jquery(tool) 组件(ui) 应用(app),mvc(backboneJs) 2.js的规划():避免全局变量和方法(命名空间,闭包,面向对象),模块化(seaJs,requireJs) 常用内部类:Data Array Math String HTML属性,CSS属性 HTML:属性.HTML属性="值"; CSS:对象.style.CSS属性="值"; class和float 1.class:className 2.float:cssFloat 获取对象 id:document.getElementById("id 名") 事件:用户的动作 鼠标事件: onclick:点击 onmouseover: 鼠标放上 onmouseout:鼠标离开 ondbclick:双击事件 onmousedown:鼠标按下 onmouseup:鼠标抬起 onmousemove鼠标移动 表单事件: onfocus:获取焦点 onblur:失去焦点 onsubmit:提交事件 onchange:当发生改变的时候 onreset:重置事件 键盘事件: onkeyup:键盘抬起 onkeydown:键盘按下 onkeypress:键盘按键一次 窗口时间:onload事件 页面加载完成之后立刻执行的事件 两种方式: 1.

JavaScript----章节二

随声附和 提交于 2020-02-05 17:07:05
5、内部对象 标椎对象 typeof 123 "number" typeof '123' "string" typeof true "boolean" typeof NaN "number" typeof [ ] "object" typeof { } "object" typeof Math . abs "function" typeof undefined "undefined" 5.1、Date 基本使用 var now = new Date ( ) ; //Sat Jan 04 2020 10:47:06 GMT+0800 (中国标准时间) now . getFullYear ( ) ; //年 now . getMonth ( ) ; // 月 0~11 代表月 now . getDate ( ) ; // 日 now . getDay ( ) ; // 星期几 now . getHours ( ) ; // 时 now . getMinutes ( ) ; // 分 now . getSeconds ( ) ; // 秒 now . getTime ( ) ; // 时间戳 全世界统一 1970 1.1 0:00:00 毫秒数 console . log ( new Date ( 1578106175991 ) ) //时间戳转为时间 转换 now = new Date