• UID12369
  • 登录2017-01-10
  • 粉丝0
  • 关注0
  • 发帖15
  • 主页http://dwz.cn/3xmVNS
  • 金币86枚
社区居民
我是柠檬 发布于2016-06-08 11:46
1/945

JavaScript学习笔记1——基本数据类型和运算符

楼层直达
这是我整理的JS学习笔记,有不全跟错误的地方还请大神们多多指正!
 想要iOS、html5笔记、视频、资料都可以找我的!
 
 JS介绍
 
 js的历史
 
 在上个世纪的1995年,当时的网景公司正凭借其Navigator浏览器成为Web时代开启时最著名的第一代互联网公司。
 
 由于网景公司希望能在静态HTML页面上添加一些动态效果,于是叫Brendan Eich这哥们在两周之内设计出了JavaScript语言。你没看错,这哥们只用了10天时间。
 
 为什么起名叫JavaScript?原因是当时Java语言非常红火,所以网景公司希望借Java的名气来推广,但事实上JavaScript除了语法上有点像Java,其他部分基本上没啥关系。
 
 JavaScript版本兼容性
 
 JavaScript语言是在10天时间内设计出来的,虽然语言的设计者水平非常NB,但谁也架不住“时间紧,任务重”,所以,JavaScript有很多设计缺陷,我们后面会慢慢讲到。
 
 此外,由于JavaScript的标准——ECMAScript在不断发展,最新版ECMAScript 6标准(简称ES6)已经在2015年6月正式发布了,所以,讲到JavaScript的版本,实际上就是说它实现了ECMAScript标准的哪个版本。
 
 由于浏览器在发布时就确定了JavaScript的版本,加上很多用户还在使用IE6这种古老的浏览器,这就导致你在写JavaScript的时候,
要照顾一下老用户,不能一上来就用最新的ES6标准写,否则,老用户的浏览器是无法运行新版本的JavaScript代码的。
 
 js的组成
 
 ECMAScript
 
 ECMAScript是一个标准。
 
 因为网景开发了JavaScript,一年后微软又模仿JavaScript开发了JScript,为了让JavaScript成为全球标准,几个公
司联合ECMA(European Computer Manufacturers Association)组织定制了JavaScript语言的标
准,被称为ECMAScript标准。
 
 所以简单说来就是,ECMAScript是一种语言标准,而JavaScript是网景公司对ECMAScript标准的一种实现。
 
 那为什么不直接把JavaScript定为标准呢?因为JavaScript是网景的注册商标。
 
 不过大多数时候,我们还是用JavaScript这个词。如果你遇到ECMAScript这个词,简单把它替换为JavaScript就行了。
 
 DOM
 
 DOM:Document Object Model。文档对象模型,后边我们会有专门的课程来讲解DOM操作
 
 BOM
 
 BOM:Browser Object Model。浏览器对象模型,后边我们也会专门来讲bom操作
 
 JavaScript的特点
 
 (1)、一种解释性执行的脚本语言。
 
 同其他脚本语言一样,JavaScript也是一种解释性语言,其提供了一个非常方便的开发过程。JavaScript的语法基本结构形式与C、
C++、Java十分类似。但在使用前,不像这些语言需要先编译,而是在程序运行过程中被逐行地解释。JavaScript与HTML标识结合在一起,从
而方便用户的使用操作。
 
 (2)、一种基于对象的脚本语言。
 
 其也可以被看作是一种面向对象的语言,这意味着JavaScript能运用其已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。
 
 (3)、一种简单弱类型脚本语言。
 
 其简单性主要体现在:首先,JavaScript是一种基于Java基本语句和控制流之上的简单而紧凑的设计,从而对于使用者学习Java或其他C语
系的编程语言是一种非常好的过渡,而对于具有C语系编程功底的程序员来说,JavaScript上手也非常容易;其次,其变量类型是采用弱类型,并未使用
严格的数据类型。
 
 (4)、一种相对安全脚本语言。
 
 JavaScript作为一种安全性语言,不被允许访问本地的硬盘,且不能将数据存入服务器,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失或对系统的非法访问。
 
 (5)、一种事件驱动脚本语言。
 
 JavaScript对用户的响应,是以事件驱动的方式进行的。在网页(Web Page)中执行了某种操作所产生的动作,被称为“事件”
(Event)。例如按下鼠标、移动窗口、选择菜单等都可以被视为事件。当事件发生后,可能会引起相应的事件响应,执行某些对应的脚本,这种机制被称为
“事件驱动”。
 
 (6)、一种跨平台性脚本语言。
 
 JavaScript依赖于浏览器本身,与操作环境无关,只要计算机能运行浏览器,并支持JavaScript的浏览器,就可正确执行,从而实现了“编写一次,走遍天下”的梦想。
 
 因此,JavaScript是一种新的描述语言,其可以被嵌入到HTML文件中。JavaScript语言可以做到响应使用者的需求事件(例如表单的
输入),而不需要任何的网络来回传输资料。所以当一位使用者输入一项资料时,此资料数据不用经过传给服务器(server)处理再传回来的过程,而直接可
以被客户端(client)的应用程序所处理。
 
 3、JavaScript的优缺点
 
 (1)、JavaScript的优点:
 
 <1>.JavaScript减少网络传输。
 
 在JavaScript这样的用户端脚本语言出现之前,传统的数据提交和验证工作均由用户端浏览器通过网络传输到服务器上进行。如果数据量很大,这对于网络和服务器的资源来说实在是一种无形的浪费。而使用JavaScript就可以在客户端进行数据验证。
 
 <2>.JavaScript方便操纵HTML对象。
 
 JavaScript可以方便地操纵各种页面中的对象,用户可以使用JavaScript来控制页面中各个元素的外观、状态甚至运行方式,JavaScript可以根据用户的需要“定制”浏览器,从而使网页更加友好。
 
 <3>.JavaScript支持分布式运算。
 
 JavaScript可以使多种任务仅在用户端就可以完成,而不需要网络和服务器的参与,从而支持分布式的运算和处理。
 
 (2)、JavaScript的局限性:
 
 <1>.各浏览器厂商对JavaScript支持程度不同。
 
 目前在互联网上有很多浏览器,如Firefox、Internet Explorer、Opera等,但每种浏览器支持JavaScript的程度是
不一样的,不同的浏览器在浏览一个带有JavaScript脚本的主页时,由于对JavaScript的支持稍有不同,其效果会有一定的差距,有时甚至会
显示不出来。
 
 <2>.“Web安全性”对JavaScript一些功能牺牲。
 
 当把JavaScript的一个设计目标设定为“Web安全性”时,就需要牺牲JavaScript的一些功能。因此,纯粹的JavaScript将
不能打开、读写和保存用户计算机上的文件。其有权访问的唯一信息就是该JavaScript所嵌入的那个Web主页中的信息,简言
之,JavaScript将只存在于它自己的小小世界—Web主页里。
 
 js的引入方式
 
 在一对 script 标签中引入js代码
 
 通过这种方式引入,可以把js代码和HTML代码写在同一个文件中,但是注意:最好把js代码写在body之后,文档的加载顺序是从上到下加载的,先把页面内容渲染出来,再加入用户交互,这样用户体验会大大加强。
 
 示例代码:
 
 用浏览器打开效果如下:
 
 引入外部js代码
 
 我们可以把js代码写在一个后缀为.js的文件中,然后把这个js文件引入HTML文档里
 
 操作步骤:
 
 创建一个目录文件夹例如为js,然后再这个文件夹中创建一个一个后缀为.js的一个js文件,例如叫做index.js;
 
 在script标签中的src中写入js文件的路径。
 
 示例代码:
 
 alert语句
 
 我们注意到上边我们使用到了一个语句:alert('网络错误!');。这是一个alert语句,用来在浏览器中弹出一个提示框的。
 
 js中的变量
 
 什么是变量?
 
 变量首先是一个容器,可以用来存放数据,而且存放在这个容器中的数据可以发生变化。举个例子:我有一个盆子,这个盆子中既可以装沙子、也可以装水,还可以装粮食。这个盆子就可以看做一个变量,里边装的水、沙子、粮食就是存放在变量中的值。
 
 在生活中,我们使用纸张来记录和保存信息,而在计算机中,我们使用变量来保存信息。变量的概念基本上和初中代数的方程变量是一致的,只是在计算机程序中,变量不仅可以是数字,还可以是任意数据类型。
 
 如何定义变量?
 
 使用关键字 var +变量名 + =(赋值号) + 值 + ; 就可以定义一个变量。
 
 示例代码:定义一个变量:
 
 var a = 12;
 
 以上代码定义了一个变量 a ,变量里保存的值是数值12 。
 
 变量的命名规则
 
 变量在JavaScript中就是用一个变量名表示,变量名是大小写英文、数字、$和_的组合,且不能用数字开头。变量名也不能是JavaScript的关键字,如if、while等。声明一个变量用var语句,比如:
 
 变量名也可以是中文,但是由于中文的兼容性不好,所以不要使用中文作为变量名。
 
 变量命名规范:
 
 类型前缀
 
 首字母大写
 
 js的基本数据类型
 
 Number
 
 number是数值类型,在生活中,我们把没有小数位的数称作整数,带有小数位的数称作小数(计算机中叫浮点数),JavaScript不区分整数和浮点数,统一用Number表示,以下都是合法的Number类型:
 
 Number类型的数可以进行加、减、乘、除、求余、自增、自减运算
 
 字符串
 
 字符串是以单引号'或双引号"括起来的任意文本,比如'abc',"xyz"等等。请注意,''或""本身只是一种表示方式,不是字符串的一部分,因此,字符串'abc'只有a,b,c这3个字符。
 
 如果'本身也是一个字符,那就可以用""括起来,比如"I'm OK"包含的字符是I,',m,空格,O,K这6个字符。
 
 如果字符串内部既包含'又包含"怎么办?可以用转义字符\来标识,比如:
 
 表示的字符串内容是:I'm "OK"!
 
 转义字符
 
 `表示转义字符,在计算机中,有些特殊的字符被系统赋予了特殊含义,如'表示括住字符串。但是想输出一个'怎么办?我们就可以像上边一样使用转移字符`,在特殊字符前添加一个转义字符,计算机就会把这个特殊字符当做普通的字符串来处理。
 
 布尔值
 
 在计算机中,我们用真表示条件成立,用假表示条件不成立。真和假就是布尔值(bollean)。
 
 在js中,我们使用true来表示真,用false来表示假。布尔值只有真和假,没有第三个值。布尔值经常用在条件判断中。
 
 null和undefined
 
 null表示一个“空”的值,它和0以及空字符串''不同,0是一个数值,''表示长度为0的字符串,而null表示“空”。
 
 在其他语言中,也有类似JavaScript的null的表示,例如Java也用null,Swift用nil,Python用None表示。但是,在JavaScript中,还有一个和null类似的undefined,它表示“未定义”。
 
 JavaScript的设计者希望用null表示一个空的值,而undefined表示值未定义。事实证明,这并没有什么卵用,区分两者的意义不大。大多数情况下,我们都应该用null。undefined仅仅在判断函数参数是否传递的情况下有用。
 
 拓展 undefined类型
 
  //如果我们不给某个变量设置值,则为undefined类型;
 var color;
 alert(typeof color);
 
 js中的运算符
 
 算数运算符
 
 +加
 
 -减
 
 *乘
 
 /除
 
 %求余(取模)
 
 赋值运算符
 
 =赋值
 
 +=加后赋值
 
 -= 减后赋值
 
 *= 乘后赋值
 
 /=除后赋值
 
 %=模后赋值
 
 关系运算符
 
 >大于
 
 <小于
 
 <=小于等于
 
 >=大于等于
 
 ==等于(如果左右两边类型不一致,则隐式转换为一致的类型后再比较)
 
 ===等于(如果左右两边类型不一致,则返回false)
 
 !=不等于(如果左右两边类型不一致,则隐式转换为一致的类型后再比较)
 
 !==不等于(不转换类型,直接比较)
 
 逻辑运算符
 
 &&与
 
 ||或
 
 !非
 
 js的逻辑运算符
 
 逻辑运算产生的结果是一个布尔值,js中有三种逻辑运算符:
 
 &&与
 
 ||或
 
 !非
 
 逻辑与&&
 
 书写方式:表达式一 && 表达式二。逻辑与表达式为真的条件是:左右两边的表达式同时成立时,整个逻辑与表达式才成立,只要有一个表达式不成立,整个逻辑表达式为假。
 
 逻辑或||
 
 书写方式:表达式一 || 表达式二。逻辑或表达式为真的条件是:左右两边的表达式,这要其中一个为真,则整个表达式为真。只有在两边表达式同时为假时,整个表达式才为假。
 
 逻辑非!
 
 书写方式为:!表达式。逻辑非是对原有的表达式结果进行取反操作。如原表达式为真,则进行逻辑非操作后,返回的值是假;元表达式为假,进行逻辑非运算后表达式为真。
 
 想要iOS、html5技术文章、视频、笔记资源欢迎找柠檬哟!
需要iOS、html5视频、资料、技术文章找我吧

0人打赏
  • UID12369
  • 登录2017-01-10
  • 粉丝0
  • 关注0
  • 发帖15
  • 主页http://dwz.cn/3xmVNS
  • 金币86枚
社区居民
我是柠檬 发布于2016-06-08 14:12
沙发F
抢沙发了,楼主自顶来了
需要iOS、html5视频、资料、技术文章找我吧
您需要登录后才可以回帖
发表回复
极贡献
技术问答
专题荟萃
程序人生
视觉设计
Android开发
iOS开发
编程语言
前端开发
后端开发
服务器架构
软件测试
运维方案
创业路上



最热文章墙

  • 72653/370   【精品推荐】200多种Android动画效果的强悍框架,太全了,不看这个,再有动画的问题,不理你了^@^

  • 41448/0   Python爬虫:常用浏览器的useragent

  • 41434/191   情人节福利,程序员表白的正确姿势:改几行代码就变成自己的表白了

  • 37939/259   【精品推荐】Android版产品级的音乐播放器源码,功能太强大了,最好的产品原型有木有?

  • 36492/145   省时省力的Android组件群来了,非常棒的原型参考

  • 28429/2   超全!整理常用的iOS第三方资源

  • 27900/71   原创表白APP,以程序员的姿势备战新年后的7夕,持续完善中!

  • 27791/142   2016抢红包软件及源码

  • 22080/30   麻省理工的一帮疯子,真的实现了随意操控万物!(绝对黑科技)

  • 21897/157   Android版类似UC浏览器:非常赞,产品级的源码

  • 21695/25   Android工程师面试题大全

  • 21539/27   2016程序员跳槽全攻略

  • 21362/9   GitHub上排名前50的iOS项目:总有一款你用得着

  • 20243/20   码魂:程序员的牛B漫画

  • 18445/10   2016年最全的Android面试考题+答案 精编版

  • 18192/3   吐槽那些程序员的搞笑牛逼注释

  • 17825/42   一个绚丽的loading动效分析与实现!

  • 17723/73   【持续更新中】Android福利贴(二):资料源码大放送

  • 17706/85   Android小而全的博客源码:非常适合全面掌握开发技巧

  • 17119/1   iOS 动画总结

  • 16605/45   惊艳的App引导页:背景图片切换加各个页面动画效果

  • 16307/23   个人收集的Android 各类功能源代码

  • 16130/81   仿京东商城客户端Android最新版,不错的原型和学习资料

  • 15948/10   女程序员的梦,众网友的神回复

  • 15843/5   新一代Android渠道打包工具:1000个渠道包只需要5秒

  • 15735/104   Android带弹幕的视频播放器源码,来自大名鼎鼎的Bilibili弹幕网站

  • 15644/11   年会上现场review代码是怎么样的体验!

  • 15527/21   Android福利第三波【Android电子书】

  • 15445/17   用JavaScript 来开发iOS和Android 原生应用:React Native开源框架中文版来啦

  • 15438/53   基于瀑布流的美女图片浏览App,有注释的源代码

  • 15257/23   珍藏多年的素材,灵感搜寻网站

  • 15063/79   【精品推荐】类似360安全卫士安Android源码:非常赞的产品原型

  • 14886/0   iOS中文版资源库,非常全

  • 14513/18   65条最常用正则表达式,你要的都在这里了

  • 14210/15   基于Android支付宝支付设计和开发方案

  • 13674/17   什么是真正的黑客:收获12200+Stars,人气远超微软开源VS

  • 13475/11   有木有这样一张酷图帮你集齐所有git命令超实用

  • 13036/46   在线音乐播放器完整版(商用级的源码):非常赞,可听免费高品质专辑

  • 13020/7   一张图搞定iOS学习路线,非常全面

  • 12937/7   用程序员的姿势抢过年的火车票

  • 12915/0   GitHub iOS 库和框架Top100 

  • 12643/10   成为Java顶尖程序员 ,看这11本书就够了

  • 12517/10   微信支付终于成功了(安卓,iOS),在此分享

  • 12465/18   一张图搞定Android学习路线,非常全面

  • 12323/61   【技巧一】搭配Android Studio,如何实现App远程真机debug?

  • 12131/3   基于Node.js的强大爬虫,能直接发布抓取的文章哦

  • 12078/29   【持续更新中】Android福利贴(一):资料源码

  • 11518/4   46 个非常有用的 PHP 代码片段

  • 11278/3   即时通信第三方库

  • 10890/8   流媒体视频直播方案

  • 10785/18   八个最优秀的Android Studio插件

  • 10743/9   B站建开源工作组:APP想支持炫酷弹幕的看过来

  • 10613/9   烧了5亿美金,这家神秘的公司即将颠覆人类未来!

  • 10467/2   【精品推荐】高质量PHP代码的50个实用技巧:非常值得收藏

  • 10407/10   中国黑客的隐秘江湖:攻守对立,顶尖高手月入千万美元

  • 9793/6   开箱即用!Android四款系统架构工具

  • 9596/10   十大技巧快速提升Android应用开发性能

  • 9532/3   10款GitHub上最火爆的国产开源项目——可以媲美西半球

  • 9457/3   一张图看清Linux 内核运行原理

  • 9359/1   Android性能优化视频,文档以及工具

  • 返回顶部