[前端学习]js语法部分学习笔记,第二天

JS的组成

  • JS是由ECMAscripte、BOM、DOM三个部分组成的。
    • ECMA是一个组织,它制定了js语言的规范,定义了对象、属性等,而且随着版本的更迭,会让js越来越强大
    • BOM(broswer object modle)浏览器对象模型,对浏览器的一些列操作,比如弹出窗口、回到顶部、页面自适应等等。
    • DOM(document object modle)文档对象模型,对html文档的操作,一系列页面特效。

js数据类型转换

  • 在实际工作中,我们经常会用到数据类型的转换,比如表单和弹出输入框,它默认的输入内容是字符串,但如果想用来运算字符串是不行的,就需要转换为数值型;再例如手机号和邮箱等,我们又需要把它转换成字符串,否则数字不知道多大去了。
  • 总结来说就是,数据类型经常会被转换。

字符型转换

  • 隐式转换。前面已经说过+法运算中出现任意字符串(空字符串也算)是把所有参与运算的连接起来,当连接之后该值自动就转换为字符型数据了。
  • 显式转换。
    • String(),使用这个函数可以把值强制转换为字符型
    • toString(),这个函数与上面的作用一样,但是使用方法不同。
    • 分别的用法:
      • String(变量或者值)是函数,输入要转换的参数即可
      • 变量.toSrting()是字符串内置方法,在前面写变量.就行,注意toString()不能转换null类型和undefined类型。

数值型转换

  • 隐式转换。把变量参与三种方式都能隐式转换数值型:1.非加法以外的基础运算符;2.比较运算符< > <= >=;3.一元运算符正号+和负号-
  • 显式转换。使用Number()函数强制把值转换为数值型。
  • 注意,如果是非数字的字符串使用以上方法转换,虽然类型可以转换,但是返回值是NaN。ture转为数值是1,false转为数值是0,null转为数值是0,undefined转为数值是NaN。如果值是NaN那么参与运算结果都是NaN
  • 专用转换数值型函数:
    • parseInt(); 这个函数转换类型时,如果不是有效数字,会把数字部分取出来再进行转换,有小数直接省略。比如:"100岁"不是一个有效数字,它会把100这个数字取出来,再转换。当然这个函数转换只支持数字在前的值,如果是"我100"数字在后,那还是会返回NaN
    • parseFloat();与上一个用法特性都是几乎相同,唯一的区别是遇到小数会完整的取出来。

布尔型转换

  • 使用!!或者Boolean()都可以把值转换为布尔型
    • 类型对应转换:
    • true、非0数字、字符串转换后都为true
    • false、undefined、null、0、NaN、 空字符串转换后都为false

字面量

  • 描述不同数据类型的方式叫做字面量,只是写法不同,例如number,string,boolean等

JS条件分支结构

if语句

  • 格式:
    if(表达式) {
    代码块
    } else {
    代码块
    }
  • if语句也可以称为判断语句,它会自动把表达式的结果转换为布尔值,然根据真还是假,来分别执行不同的代码。
  • if语句的几个要点:
    • 可以只写if不写else,这样如果条件不成立就没有任何操作,直接跳过,很常用
    • 只有if后面跟表达式
    • 表达式可以是任意代码,因为会自动转换为布尔值

三元运算符

  • 格式:
    表达式 ? 结果a : 结果b;
  • 三元运算符就是对if语句的简化。如果表达式为真,返回结果a。否则返回结果b。可以看出来与if else作用相似,所以也可看成是if else的简写,当然如果if里还有if嵌套就不能代替了。

多分支判断结构

  • 格式:
    if (表达式1) {
    xxx;
    }else if(表达式2) {
    xxx;
    }else if(表达式3) {
    xxx;
    }else {
    xxx;
    }
  • 为了让条件判断语句功能更加强大有了多分支判断结构,它会依次执行每个表达式,如果条件为真则直接结束判断,返回对应代码。所有条件都为假才会执行最后的else。
  • 多分支判断结构常用于多个范围之间的判断。

使用浏览器断点调试js

  • 浏览器断点调试需要在调试工具中,选中source。加载完代码后,在需要加上断点的地方的行号上单击一下,就成功加上了断点。
  • 重新加载执行代码时,到了断点处执行会暂停,只有不断通过单击下一步才会继续执行,并且还能用光标看到代码的运行结果(也可以用add to watch添加的监视,这样在右侧会一直显示结果),这样很容易就能找到代码中是哪里出错。

switch case判断语句

  • 格式:
    var num = 3;
    switch(num) {
    case 1:
    document.write(xxx);
    break;
    case 2:
    document.write(xxx);
    break;
    case 3:
    document.write(xxx);
    break;
    default :
    document.write(xxx);
    }
  • switch功能与if多分支结构相似,但是switch一般用于多个准确值的判断,if多分支常用于多个范围的判断。
  • 每个case对应一个条件,执行时会依次来匹配表达式里的值(注意必须值全等才会匹配成功),然后跟上一个break表示匹配成功跳出判断,必须加上break否则会一直到最后全都执行。
  • 当所有case都不能匹配成功,就执行default里的代码。
  • case的值一定不能有相同,否则会出错。
  • 注意格式比较怪,要记仔细。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,830评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,992评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,875评论 0 331
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,837评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,734评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,091评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,550评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,217评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,368评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,298评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,350评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,027评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,623评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,706评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,940评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,349评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,936评论 2 341

推荐阅读更多精彩内容

  • FreeCodeCamp - Basic JavaScript 写在前面: 我曾经在进谷前刷过这一套题,不过当时只...
    付林恒阅读 16,417评论 5 28
  • 标签: 我的笔记 ---学习资料:http://javascript.ruanyifeng.com/ 1. 导论 ...
    暗夜的怒吼阅读 785评论 0 1
  • 昨天我收到了我的第一本手帐本,梵 高的麦田我很喜欢,我希望我能坚持下去,由于时间总觉得混乱,我今天报名参加了一个微...
    鸢尾花0906阅读 244评论 0 0
  • 今天起,我准备把自己的打卡笔记记录下,本日2个打卡。 【五彩食育】,记录下每天的早餐,以前对早餐很头痛,不知道每天...
    一黍花园阅读 208评论 0 1