js代码

Js 数组(一):基础应用

自作多情 提交于 2020-01-12 15:18:16
(一) Js 数据类型   分为基本数据类型以及引用类型   基本数据类型有 null,undefined,Boolen,Number,String,还有一种复杂数据类型 Object。 var var1 = "xianrongbin", var2 = false, var3 = null, var4 = undefined, var5 = 123; console.log(typeof var4); var var6 = [1, 23, 5]; console.log(typeof var6);    这里,其实只需一个var的,为了区别基本数据类型与复杂数据类型,写了两个var 关键字。 将所有的变量定义在一个var后面,有益提升 程序运行效率 。 如果在一个函数中,不标注 var,则该变量是全局变量,是window的变量,因为所有全局变量都是由window承担的。      function testVar() { num = 1; } testVar(); console.log(window.num);    这里输出1,如果在 "num" 前加上var,输出则会报错。 基本数据类型与值类型,一个是传值,一个是改变地址。 var var6 = [1, 23, 5]; function changeValue(obj) { obj.pop(); }; changeValue

用JS原生写瀑布流

♀尐吖头ヾ 提交于 2020-01-12 14:45:05
效果图 html <!DOCTYPE html> < html > < head > < meta charset = " UTF-8 " > < title > Document </ title > < style > * { margin : 0 ; padding : 0 ; } .container { width : 840px ; background : #cccccc ; margin : auto ; padding-left : 10px ; overflow : hidden ; } .container ul { width : 200px ; margin-right : 10px ; float : left ; list-style : none ; } .container ul li { width : 200px ; position : relative ; background : white ; margin-top : 10px ; } .container ul li img { width : 100% ; height : 90% ; background : url("./images/timg.gif") no-repeat center ; } .container ul li p { height : 30px ;

JS库

五迷三道 提交于 2020-01-12 09:29:59
JavaScript 库 - jQuery、Prototype、MooTools。 JavaScript 框架(库) JavaScript 高级程序设计(特别是对浏览器差异的复杂处理),通常很困难也很耗时。为了应对这些调整,许多的 JavaScript (helper) 库应运而生。这些 JavaScript 库常被称为 JavaScript 框架。在本教程中,我们将了解到一些广受欢迎的 JavaScript 框架: jQuery Prototype MooTools 所有这些框架都提供针对常见 JavaScript 任务的函数,包括动画、DOM 操作以及 Ajax 处理。 jQuery jQuery 是目前最受欢迎的 JavaScript 框架。它使用 CSS 选择器来访问和操作网页上的 HTML 元素(DOM 对象)。jQuery 同时提供 companion UI(用户界面)和插件。许多大公司在网站上使用 jQuery: Google Microsoft IBM Netflix Prototype Prototype 是一种库,提供用于执行常见 web 任务的简单 API。API 是应用程序编程接口(Application Programming Interface)的缩写。它是包含属性和方法的库,用于操作 HTML DOM。Prototype 通过提供类和继承,实现了对

2019 JS内功修炼之读jQuery源码

青春壹個敷衍的年華 提交于 2020-01-12 09:13:32
引言:2019年,react hooks成功上位,vue3.0发布alpha版,TS使用率的飞速增长,以及大量前端开发工具使用体验的大幅优化和提高等等让越来越多的开发者吐槽前端学不动了的时候,最好的应对方式便是对基础概念的掌握。内功足够强大,才能做到不被别人牵着鼻子走。阅读开源代码是一个很好的方式,首先率选择了jQuery便是里面的内容没有太多足够抽象的设计思想。更多的是对于基础内容的覆盖。同时也包含一些不错但设计模式在里面,因此具有不错的性价比。 jQuery是早期前端开发中占比很重的一个库。在手动操作DOM和浏览器差异较大的时代,jQuery通过统一和简化不同浏览器之间的API,为程序开发带了极大的便利。所以jQuery的设计思路也是围绕这两点展开的。 ps: 不做特殊说明, $ 在源码示例中等效 jQuery 。 jQuery做的主要工作 DOM查询及操作 ajax请求 animation动画 promise(deferred) event handle css style 兼容性问题,抹平不同浏览器的间差异 jQuery的特点 面向对象 ————> prototype API设计的特点 ————> 函数重载 jQuery对于DOM的操作是命令式的,那么相对就要要求使用成本是相对较低的,没有特别复杂的API设计,数量少,参数简单。 内部封装,为了实现jQuery的几大功能

js知识总结

丶灬走出姿态 提交于 2020-01-12 08:44:18
定义:基于事件和对象驱动,并具有安全性能的脚本语言 Javascript文件在客户端运行。 浏览器(客户端)的主要组件中包括渲染引擎和JS解释器等。 渲染引擎 - 用来显示请求的内容,例如,如果请求内容为html,它负责解析html及css,并将解析后的结果显示出来。 JS解释器 - 用来解释执行JS代码。 引入: |---内嵌:<script type=”text/javascript”>具体js代码</script> |---外部:<script type=”text/javascript” src=”js文件”></script> 注意:代码大小写敏感:例如:A与a是两个不同的东东 注释:// 单行注释 /*多行注释*/ js的输出语法 |---弹窗式:alert() alert(123) |---控制台输出:;一般作为调试输出语句 console.log() |---prompt() 方法用于显示可提示用户进行输入的对话框 prompt(222) document.write() 在html文档中打印出来 变量:其值可以发生改变的量就是变量。 变量是用于存储信息的"容器" |---命名:var 变量名 = |---命名规范:js里边:字母、数字、下划线、$符号 等4个组成部分,数字不能作为名字的开始内容。 驼峰法命名 数据类型: |---javascript(6种):

js中的console

和自甴很熟 提交于 2020-01-12 08:40:56
console.log 是我们在调试代码的时候经常用到的一个方法,也可能也是很多人用的关于console的唯一方法,其实console对象下有很多不错的方法,现在记录总结于此。 log、info、debug、error、warn: 其实这就对应Android开发的5个控制台输出等级,主要是颜色不一样 time/timeEnd: 就是埋点检测一段代码的执行时间 group/groupEnd: 对多个输出进行分组显示 profile/profileEnd: 埋点对一段代码进行性能分析 trace: 查看当前的代码的调用堆栈 count: 查看当前代码的执行次数 常用的大概就是上面的,当然由于console 对象属于调试对象,而各个浏览器的调试功能不一样,所以毫无意外地存在兼容性问题。 上面简单列举的是chrome dev tool中支持的,使用它们,就不必自己写一些与代码逻辑无关的性能检测代码了,而且通过打包工具,最后都会被处理掉 来源: https://www.cnblogs.com/zhangheng/p/4838447.html

JS基础知识总结(1)

怎甘沉沦 提交于 2020-01-12 08:15:45
JS解析器 JS解析分为两个步骤 JS预解析 找东西 var function 参数 所有的变量在正式运行代码之前,都提前赋了一个值:未定义 所有的函数,在正式运行代码之前,都是整个函数块 注意: 遇到重名的:只能留下一个 变量和函数重名,只留下函数 遵循后来居上的准则 逐行解读代码 表达式: = + - * / % ++ -- ! 参数 ==> 改变值 表达式可以改变预解析的值 作用域 作用:读、写 域:空间、范围、区域 注意: script 是全局变量 全局函数 单线程 自上而下 函数 由里到外 firefox 不能对下面的函数进行预解析 函数调用方式 函数调用 直接调用 事件调用 setInterval / setTimeout clearInterval / clearTimeout 定时器 setInterval(函数,毫秒):重复不断的执行(发动机) setTimeout(函数,毫秒):执行一次(炸弹) 数据类型 数字(NaN) 字符串 布尔值 函数 对象(obj [] {} null) 未定义 注意: 数字的比较与字符串的比较:字符串的比较是一个一个字符比较 isNaN : is not a number 不是个数字 isNaN(): 判断某些值是不是数字 不喜欢数字 内部依靠Number()进行转换 数据类型转换 显示类型转换 Number() 整体转换

程序员整理的各种不错的工具(转)

雨燕双飞 提交于 2020-01-12 07:23:23
技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应用,关注软件开发领域 OSChina:开源技术社区,开源方面做的不错哦 cnblogs,51cto,csdn:常见的技术社区,各有专长 stackoverflow:IT技术问答网站 GitHub:全球最大的源代码管理平台,很多知名开源项目都在上面,如Linux内核, OpenStack等免费的it电子书:http://it-ebooks.info/ DevStore:开发者服务商店 不错的书籍 人件 人月神话 代码大全2 计算机程序设计艺术 程序员的自我修养 程序员修炼之道 高效能程序员的修炼(成为一名杰出的程序员其实跟写代码没有太大关系) 深入理解计算机系统 软件随想录 算法导论(麻省理工学院出版社) 离线数学及其应用 设计模式 编程之美 黑客与画家 编程珠玑 C++ Prime Effective C++ TCP/IP详解 Unix 编程艺术 《精神分析引论》弗洛伊德 搞定:无压力工作的艺术 平台工具(都是开源的好东东哦) Redmine/Trac:项目管理平台 Jenkins/Jira(非开源):持续集成系统(Apache Continuum,这个是Apache下的CI系统,还没来得及研究)

【微信小程序项目实践总结】30分钟从陌生到熟悉

纵饮孤独 提交于 2020-01-12 04:51:28
前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05-日历组件的实现 4. 微信小程序开发04-打造自己的UI库 5. 微信小程序开发03-这是一个组件 6. 微信小程序开发02-小程序基本介绍 7. 微信小程序开发01-小程序的执行流程是怎么样的? 阅读本文之前,如果大家想对小程序有更深入的了解,或者一些细节的了解可以先阅读上述文章, 本文后面点需要对着代码调试阅读 对应的github地址是: https://github.com/yexiaochai/wxdemo 首先我们来一言以蔽之,什么是微信小程序?PS:这个问题问得好像有些扯:) 小程序是一个不需要下载安装就可使用的应用,它实现了应用触手可及的梦想,用户扫一扫或者搜一下即可打开应用。也体现了用完即走的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。从字面上看小程序具有类似Web应用的热部署能力,在功能上又接近于原生APP。 所以说, 其实微信小程序是一套超级Hybrid的解决方案,现在看来,小程序应该是应用场景最广,也最为复杂的解决方案了 。 很多公司都会有自己的Hybrid平台,我这里了解到比较不错的是携程的Hybrid平台、阿里的Weex、百度的糯米

JS之 调试

怎甘沉沦 提交于 2020-01-12 04:51:06
今天跟大家分享下JS之 调试的知识。 前言 Web开发最常用的高度就是 console.log ,虽然 console.log 占有一席之地,但很多人并没有意识到 console 本身除了基本 log 方法之外还有很多其他方法。适当使用这些方法可以使调试更容易,更快速,更直观。 1 console.log() 在console.log 中有很多人们意想不到的功能。虽然大多数人使用 console.log(object) 来查看对象,但是也可以使用 console.log(object, otherObject, string),它会把它们都整齐地记录下来,偶尔也会很方便。 不仅如此,还有另一种格式化的: console.log(msg, values),这很像 C 或 PHP 中的sprintf。 console . log ( 'I like %s but I do not like %s.' , 'Skittles' , 'pus' ) ; 会像你预期的那样输出: > I like Skittles but I do not like pus . 常见的占位符 %o (这是字母o,不是0),它接受对象,%s 接受字符串,%d 表示小数或整数。 另一个有趣的是 %c,这可能与你所想不太相同,它实际上是CSS值的占位符。使用%c占位符时,对应的后面的参数必须是CSS语句