js代码

关于web前端的几个小知识点

笑着哭i 提交于 2019-12-23 17:58:12
关于js 1、js代码是单线程执行的,这肯定是毋庸置疑的,但是异步的代码又是怎么回事呢? 首先理解,js先是顺序的执行代码,遇到异步的则将他放进一个队列当中,等到主线程的代码执行完成过后再去队列里取出来,执行这个模块,若这个模块再次遇到异步,则再次放进队列,依次执行; 举个例子: for (var i = 1; i <= 3; i++) { setTimeout(function () { console.log(i); }, 0) } 你可以先猜猜这段代码会打印什么?答案是4,4,4!这是因为for循环在执行时,遇到异步的,则继续执行for,而不执行打印,等for执行完成之后,这时候i的值变成了4,3次打印则变成了4,4,4。你可以选择用let来实现。 而关于js的执行顺序有更多的东西我就不说了,如果你碰巧看到了建议去了解一下!这个在头条的面试题里曾经提到过。 2,document.body.contentEditable=true,这是个有趣的东西,你可以去自己试试。 关于html 1、对于input的onchange属性,这个很多人都知道,他是用来监听当值改变时,则会触发一个函数。但是这也是有东西的,当这个值是手动输入的时候可以触发,但是如果是你的js脚本触发时,这个方法则不会被触发,还有更多的像vue的v-change,angular的ng-change属性都是这样! 2

JS异步编程怎么回事 如何能学好Web前端开发

谁都会走 提交于 2019-12-23 15:55:59
【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> JS异步编程怎么回事?如何能学好Web前端开发?JavaScript是Web前端开发三要素之一。JavaScript涵盖的内容比较多,需要一个较为系统的学习过程才能逐渐掌握,下面就给大家讲解一下JavaScript异步编程的知识。 什么是异步? 所谓"异步",简单说就是一个任务分成两段,先执行第一段,然后转而执行其他任务,等做好了准备,再回过头执行第二段。这种不连续的执行就叫做异步,程序异步运行,可以提高程序运行的效率,相应地,连续的执行就叫做同步。 JavaScript异步编程方法 1、回调函数。回调函数在Javascript中非常常见,一般是需要在一个耗时操作之后执行某个操作时可以使用回调函数。在回调函数嵌套层数不深的情况下,代码还算容易理解和维护,一旦嵌套层数加深,就会出现“回调金字塔”的问题,还有一个问题就是我们在回调函数之外无法捕获到回调函数中的异常。 2、事件监听(事件发布/订阅)。事件监听是一种非常常见的异步编程模式,它是一种典型的逻辑分离方式,很适合一些需要高度解耦的场景。通常情况下,我们需要考虑哪些部分是不变的,哪些是容易变化的,把不变的部分封装在组件内部,供外部调用,需要自定义的部分暴露在外部处理。从某种意义上说,事件的设计就是组件的接口设计。 3、Promise对象。ES

js 监控浏览器关闭事件

China☆狼群 提交于 2019-12-23 14:20:18
代码如下: <!DOCTYPE html> <html> <head> <title>监控浏览器关闭事件</title> </head> <style type="text/css"> </style> <body> <div id="create_order"> </div> </body> </html> <script type="text/javascript"> var widowClose = {}; widowClose.tip = "浏览器即将关闭,是否确定??"; widowClose.set = function(a) { window.onbeforeunload = function(b) { b = b || window.event; b.returnValue = a; return a } }; widowClose.clear = function() { fckDraft.delDraftById(); window.onbeforeunload = function() { } }; widowClose.set(widowClose.tip); </script> 来源: https://www.cnblogs.com/shizhouyu/p/5663136.html

js基础稍微复习下

天大地大妈咪最大 提交于 2019-12-23 08:32:08
这个我是真心不想从头再学一遍了,所以我还是看看笔记,看看代码算了,真心不想在从头,一点点看视频,太累! 函数提升也就这些,下面是变量声明提升! 行,两个提升,就复习了, 还有说下,就是js 的变量作用域,很简单, 函数内的叫做局部作用域, 函数外的叫做全局作用域! 若函数内使用变量,没有的,就去它的外层去找,就这样! 大概模拟下代码: window.onload = function(){\ var a ; if(false){ a = 100; } console.log(a); } 行,我这个呆子,这次一定要将js 学会! 来源: CSDN 作者: 爱生活,爱编程 链接: https://blog.csdn.net/qq_15009739/article/details/103644605

js语法基础

为君一笑 提交于 2019-12-23 05:14:12
1. 引入方式   <script type=”text/javascript”>具体代码</script>   <script type=”text/javascript” src=”apple.js”></script> 2. 区分大小写   JavaScript语言严格区分大小写 name Name 3. 注释方式   // 注释单行   /*     注释多行   */ 4. 结束处分号可省略(多表达式写在一行不能省略)   var name=”tom”;   var age = 23; 5. 变量命名规则 名字组成:字母、数字、下划线、$ 开始的第一个字符不能是数字的。 var $ = “china”; //可以的,jquery框架 var 9 = “hello”; //不可以 6. 全局变量和局部变量   ① 在js里边定义“全局变量”,在系统任何角落直接定义(不使用var关键字)   ② 特殊情况,在函数外边通过var定义的变量也是“全局的”   ③ 函数中嵌套的函数外面通过var定义的的变量相对此函数来说是可以使用的 7. 连接符号+    当两个参数都是数值型,做算术运算;当两个参数其中一个或两个是字符串类型,做链接运算 8. break和continue 跳出一层循环直接使用即可,如果需要跳出多重循环需要使用以下方法: waibian: for(var i=0;

4001—JS/Jquery随笔

大憨熊 提交于 2019-12-23 04:14:45
1、【AJAX】返回数据到<table> C#代码如下 public class TestController : Controller { List<userModel> userList = new List<userModel>(); // GET: Test public ActionResult Index() { return View(); } public ActionResult List() { userList.Add(new userModel() { Name="贾志国", Age=41, Address="北京市东城区", Sex="男" }); userList.Add(new userModel() { Name="和平", Age=39, Address="北京市东城区和平里街道", Sex="女", }); userList.Add(new userModel() { Name="贾志新", Address="北京市东城区和平里街道", Age=32, Sex="男" }); AjaxEntity<List<userModel>> myResult = new AjaxEntity<List<userModel>>() { Success=true, Message="成功啦", Data=userList }; //—9— 返回JSON

nginx缓存配置及开启gzip压缩

a 夏天 提交于 2019-12-23 02:14:05
一:nginx缓存配置 二:nginx开启gzip 一:nginx缓存配置 在前一篇文章,我们理解过http缓存相关的知识点, 请看 这篇文章 . 今天我们来学习下使用nginx服务来配置缓存的相关的知识。 nginx配置缓存的优点:可以在一定程度上,减少服务器的处理请求压力。比如对一些图片,css或js做一些缓存,那么在每次刷新浏览器的时候,就不会重新请求了,而是从缓存里面读取。这样就可以减轻服务器的压力。 nginx可配置的缓存又有2种: 1)客户端的缓存(一般指浏览器的缓存)。 2)服务端的缓存(使用proxy-cache实现的)。 客户端的缓存一般有如下两种方式实现: 协商缓存和强缓存。具体理解什么是协商缓存或强缓存,可以看 这篇文章 . 在配置之前,我们来看下我们的项目基本架构如下: |----项目demo | |--- .babelrc # 解决es6语法问题 | |--- node_modules # 所有依赖的包 | |--- static | | |--- index.html # html页面 | | |--- css # 存放css文件夹 | | | |--- base.css # css文件,是从网上随便复制过来的很多css的 | | |--- js # 存放js的文件夹 | | | |--- jquery-1.11.3.js # jquery 文件 | |

浏览器页面加载解析渲染机制(一)

拟墨画扇 提交于 2019-12-23 00:38:53
一:为什么要了解浏览器渲染页面和加载页面机制,主要还是性能的优化。 了解浏览器如何进行 加载 ,我们可以在引用外部样式文件,外部js时,将他们放到合适的位置,使浏览器以最快的速度将文件加载完毕。 了解浏览器如何进行 解析 ,我们可以在构建DOM结构,组织css选择器时,选择最优的写法,提高浏览器的解析速率。 了解浏览器如何进行 渲染 ,明白渲染的过程,我们在设置元素属性,编写js文件时,可以减少”重绘“”重新布局“的消耗。   这三个过程在实际进行的时候又不是完全独立,而是会有交叉。会造成一边加载,一边解析,一边渲染的工作现象。 二:用户访问网页都发生了什么。 用户访问网页,DNS服务器(域名解析系统)会根据用户提供的域名查找对应的IP地址,找到后,系统会向对应IP地址的网络服务器发送一个http请求。 网络服务器解析请求,并发送请求给数据库服务器。 数据库服务器将请求的资源返回给网络服务器,网络服务器解析数据,并生成html文件,放入http response中,返回给浏览器。 浏览器解析 http response。 浏览器解析 http response后,需要下载html文件,以及html文件内包含的外部引用文件,及文件内涉及的图片或者多媒体文件。(这里进入主题了也就是下面的第三大点)   1~4步骤HTTP协议的一些内容,访问服务器端可能遭遇的问题

2017年-Web前端面试题(HTML至Nodejs)

筅森魡賤 提交于 2019-12-23 00:06:47
【原】2017年-Web前端面试题(HTML → Nodejs) 出自作者小矮人Web前端,博文地址: http://www.cnblogs.com/itlkNote/ 文中有少许重复问题! 第一阶段 HTML、CSS、HTML5、CSS3 1、XHTML与HTML的有何异同? 2、介绍一下CSS的盒子模型?弹性盒子模型是什么? 3、Doctype的作用?标准模式与兼容模式各有什么区别? 4、HTML5 为什么只需要写 <!DOCTYPE HTML>? 5、行内元素有哪些?块级元素有哪些? 空(void)元素有那些? 6、页面导入样式时,使用link和@import有什么区别? 7、介绍一下你对浏览器内核的理解? 8、常见的浏览器内核有哪些? 9、HTML5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5? 10、简述一下你对HTML语义化的理解? 11、iframe有那些缺点? 12、列出display的值,说明他们的作用?position的值, relative和absolute定位原点是? 13、一个满屏 品 字布局 如何设计? 14、常见兼容性问题? 15、如果需要手动写动画,你认为最小时间间隔是多久,为什么?(阿里面试题) 16、列举IE 与其他浏览器不一样的特性? 17、99%的网站都需要被重构是哪本书上写的?

js常见面试题

和自甴很熟 提交于 2019-12-23 00:05:14
1. javascript的typeof返回哪些数据类型. 答案:string,boolean,number,undefined,function,object 2. 例举3种强制类型转换和2种隐式类型转换? 答案:强制(parseInt,parseFloat,number) 隐式(== ===) 3. split() join() 的区别 答案:前者是将字符串切割成数组的形式,后者是将数组转换成字符串 4. 数组方法pop() push() unshift() shift() 答案:push()尾部添加 pop()尾部删除 unshift()头部添加 shift()头部删除 5. IE和标准下有哪些兼容性的写法 答案: var ev = ev || window.event document.documentElement.clientWidth || document.body.clientWidth Var target = ev.srcElement||ev.target 6. ajax请求的时候get 和post方式的区别 答案: 一个在url后面 ,一个放在虚拟载体里面 get有大小限制(只能提交少量参数) 安全问题 应用不同 ,请求数据和提交数据 7. call和apply的区别 答案: Object.call(this,obj1,obj2,obj3) Object