2018年某大学生程序员实习报告(JS部分).docx

上传人:wei****016 文档编号:853490 上传时间:2018-11-03 格式:DOCX 页数:10 大小:15.05KB
下载 相关 举报
2018年某大学生程序员实习报告(JS部分).docx_第1页
第1页 / 共10页
2018年某大学生程序员实习报告(JS部分).docx_第2页
第2页 / 共10页
2018年某大学生程序员实习报告(JS部分).docx_第3页
第3页 / 共10页
2018年某大学生程序员实习报告(JS部分).docx_第4页
第4页 / 共10页
2018年某大学生程序员实习报告(JS部分).docx_第5页
第5页 / 共10页
点击查看更多>>
资源描述

1、2018 年某大学生程序员实习报告(JS 部分)JS 部分:一、正则表达式正则表达式由两个正斜杠/表达式/ 包裹起来;:匹配字符串的开头;$:匹配字符串的结尾;+:匹配+前面一个或多个的子表达式;*:匹配*前面零个或多个的子表达式;n:限定 n 字符;n,:限定 n 个以上的字符;n,m:限定 n 个至 m 个的字符;?:匹配前面的子表达式零次或一次d:匹配数字;0-9:匹配数字;a-z:匹配小写字母;A-Z:匹配大写字母;a-zA-Z:匹配所有英文字母;w:匹配字母、数字、下划线。等价于A-Za-z0-9_;W:匹配非字母、数字、下划线。等价于 A-Za-z0-9_。更多请看:二、适配方案:

2、在移动端上,每个手机的分辨率都不同,以前都是使用 css 媒体查询 media,但现在再使用媒体查询已经太老旧了,不仅代码冗余还消耗性能;而用 js 进行移动端的适配,是个很好的选择。现在较流行的适配方案有网易的 rem.js 和淘宝的 flexible.js。其实对于不同的适配方案,rem 与 px 的换算也是不同的。1) rem.js详情请看:E:/文档/common/index.html 。2) flexible.jsFlexible.js 是阿里巴巴团队写的终端适配解决方案。flexible.js 的用法非常的简单,在页面的中引入 flexible_css.js,flexible.js

3、 文件:目前 Flexible 会将视觉稿分成 *100 份*(主要为了以后能更好的兼容 vh 和 vw) ,而每一份被称为一个单位 a。同时 1rem 单位被认定为 10a。针对我们这份视觉稿可以计算出:换算1a = 7.5px1rem = 75px详情请看:。3) ViewPort我们在代码中通常能见到在头部引入这么一个标签:这是一个使页面自适应设备的标签,详情请看:。这两篇博文对 viewPort 的讲解很详细,值得一看。三、框架:1.Vue:Vue-cli 打包有一个坑,里面的 css 压缩打包会把 css 前缀给去掉,导致打包后的文件跟开发环境不同,且会把公共部分重复打包,使得打包过

4、后的 css 文件非常大。1)组件化:当项目页面中出现多处相同的样式和功能的时候,应把这个重复的部分封装成一个组件出来,并暴露一些属性给外部使得组件可以被定制,方便后续的使用。2)Ajax 和 axios:ajax 是 jq 的一个异步请求的方法,基本用法为:$.ajax(type: POST, /请求类型url: serverUrlurl, /请求接口地址dataType: “json“, /参数类型data: data, /参数async: true, /是否为异步请求beforeSend: function (request) /发送请求前执行的方法.,success: function

5、 (msg) /请求成功后执行的方法successFun(msg),Error /请求失败后执行的方法Axios 是一个基于 promise 的 HTTP 库,用法相对于 ajax 来说较为简洁。特征:从浏览器中创建 XMLHttpRequest从 node.js 发出 http 请求支持 Promise API拦截请求和响应转换请求和响应数据取消请求自动转换 JSON 数据客户端支持防止 CSRF/XSRF基本用法:axios.post(api, /api:请求的接口 ,请求的参数firstName: Fred,lastName: Flintstone). then(function (re

6、sponse) /请求后执行的方法console.log(response);).catch(function (error) /异常处理console.log(error););3)Vue 中的 Prop:Vue 中的数据都是只作用于当前组件的,要想在子组件和父组件中传递数据,就得 使用 prop 和 emit。Prop 是父组件把数据暴露给子组件的一个属性,使用方法为:Props: Foo:Type:StringNumberBooleanFunctionObjectArraySymbol在组件中绑定原生方法应加上.native;Emit 是组件向外传递数据的一个属性。4) Vuex:目前对

7、 vuex 还没有太深的理解,只知道大概是保存页面状态的一个东西。详情请看:。四、时间戳在项目中出现过因为 css 和 js 文件缓存出现样式混乱的问题,主要出现在手机使用过老版页面,在更新后进入新版页面会出现样式重叠混乱。这时候应该在引入外部文件的和标签后加入时间戳(时间的毫秒数或一组随机数) ,最好按照一定格式添加,如:后面 v=xxx 可表示时间或版本。五、es6 新增1) Let :用 let 定义变量。Let 是块作用域的,不能在声明前使用,使用 let 不会造成全局污染。2) Const:用 const 声明常量。3)解构赋值const arr=1,2,3,4,5;const s,

8、n=arr;alert(s,n);4) Class:引入了 class 关键字来表示一个对象。5) For.of:使用 for.of 循环,即可循环数组也可循环字符串。let iterable = 10, 20, 30;for (const value of iterable) console.log(value);6) promise 对象:Promise 是异步编程的一种解决方案,比传统的解决方案回 调函数和事件更合理和更强大。它由社区最早提出和实现,ES6 将其写进了语 言标准,统一了用法,原生提供了 Promise 对象。Promise 通常使用的方法是 resolve(成功)和 reject(失败) 。Promise.then()的 then 方法一定要在 new 了一个 promise 对象后才能使用。更多请看: 六、异步请求锁在请求之前声明一个变量为 true,使得可以请求接口数据,判断如果变量为 true,在接口返回数据(不管是成功还是失败) ,都给变量赋值 false。

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 实用文档资料库 > 思想汇报

Copyright © 2018-2021 Wenke99.com All rights reserved

工信部备案号浙ICP备20026746号-2  

公安局备案号:浙公网安备33038302330469号

本站为C2C交文档易平台,即用户上传的文档直接卖给下载用户,本站只是网络服务中间平台,所有原创文档下载所得归上传人所有,若您发现上传作品侵犯了您的权利,请立刻联系网站客服并提供证据,平台将在3个工作日内予以改正。