Category frontend

JavaScript

JS特性 JavaScript代码能放在哪里? 也可以将javascript代码写入一个外部的js文件当中,然后通过script标签进行导入。写入外部文件的好处是不同的html页面都可以引用它,也可以利用到浏览器的缓存机制。是比较推荐的一种方式。 注意:script标签一旦用于引入外部文件,就不能在标签体里面写js代码了,即使写了浏览器也会忽略的。如果头铁,非得写,那就在新建一个script标签。 注释 注释有单行注释或者多行注释 数据类型 六种基本的数据类型: 前五种为基本数据类型,而Object属于引用数据类型。 判断一个变量的类型,可以用typeof来检查。 Number.MAX_VALUE -> JS数字的最大值,超过该值就会显示Infinity。NaN -> Not a number,如果用typeof来检查,还是会显示为number。Number.MIN_VALUE -> 0以上的最小的数字,表示正的最小数。null专门用来表示一个为空的对象。如果用typeof检查,会返回“object”。当申明一个变量但不给变量赋值时就是undefined,用typeof检查就是”undefined”。 强制类型转换 将其他数据类型转换为String 将其他数据类型转换为Number 逻辑运算符 取反 ! 用!对非布尔值进行取反操作,则先将该值转换为布尔值,再进行取反操作。 与运算 对非布尔值进行运算的时候,会将其转换为布尔值,然后再运算,并返回原值 或运算 如果第一个值为true,则直接返回第一个值,如果第一个值为false,则返回第二个值 全等/不全等 ===和==类似,但不同的是全等不会做自动类型转换,如果类型不同,直接返回false。不全等同理。 流程控制语句 if…else if…else if…else 该语句中,只有一个代码块会被执行,一旦代码块执行了,则直接结束语句。 switch…case… 在执行时会依次将case后的表达式的值和switch后的条件表达式的值进行全等比较,如果比较结果为true,则从当前case处开始执行代码。当前case后的所有代码都会执行,因此我们可以在case的后面跟一个break关键字来跳出switch语句。如果比较结果为false,则继续向下比较。如果所有的比较结果都为false,则执行default里的语句。 对象…

HTML

什么是HTML? HTML: Hyper Text Markup Language. HTML tags HTML的标签分为两种:双标签(paired tag)和单标签(self-closing tag)。所谓的双标签,就是说该标签有一个起始标签(opening tag)和一个结束标签(closing tag),形式为:<起始标签>标签体</结束标签>。单标签的形式为:<标签名 />,其中foward slash是可以忽略不写的。 标签和标签之间的关系可以是并列,也可以是嵌套。如果是嵌套关系,编写代码的时候可以用tab键来进行缩进。 HTML的每个标签有其对应的标签属性(attribute),给标签提供一些附加信息。属性可以写在双标签中的起始标签里,或者单标签里。形式为: 有一些比较特殊的标签,只有属性名,没有属性值,例如: 注意事项: HTML的基本结构 在网页上点击鼠标右键,会出现查看网页源代码和检查。查看网页源代码看到的是程序员编写的源代码,检查看到的是经过浏览器处理后的源代码,一般来说日常开发中“检查”用到的居多。 网页的基本结构如下: HTML注释 注释的作用是对代码进行解释和说明,其内容会被浏览器所忽略,不会呈现到页面中,但源代码中依然可见。 HTML文档声明 告诉浏览器当前网页的版本,由于html5是向后兼容的,所以直接标注为html5版本就好,以前的版本声明写起来非常的麻烦,也没有必要。要将文档写在第一行,且在html标签的外侧。 HTML字符编码 常见的字符集有如下几种: 原则是:存储的时候,务必采用合适的字符编码,必须有汉字,就不能用ASCII或者ISO 8859-1字符集。存储是用的那种方式编码,读取的时候就用哪种方式解码,要不然就会出现乱码。平时编写代码的时候,统一采用UTF-8编码。 HTML设置语言 主要作用是让浏览器显示对应的翻译提示,且有利于搜索引擎的优化。具体写法: h标签 一种语义化标签。块级元素(block element)。h1~h6为标题。h1最好写一个,h2~h6能适当多写。h标签不能相互嵌套。 p标签 块级元素。代表一个段落。里面不能有别的块级元素。 div标签 块级元素。没有任何含义,是用来整体布局的一个标签,可以比喻为生活中的包装袋。 文本标签…

React Tutorial

为什么要学习React?换句话说,为什么原生js不够好呢? 虚拟DOM JSX语法规则 JS复习 组件 状态和展示 类中的方法this指向 现在的问题是当h1标签被click,调用回调函数changeWeather时,函数里的this为undefined,那该怎么办呢? 状态不可直接更改,需要调用setState({…})来更改,且更新是一种合并,不是替换。也就是说,同名的就替换了,不同名的保留。 如果不想写的这么麻烦,那可以用这种写法,完美解决this的问题 总结一下,state如果不依赖传参进来,直接写到class体内,然后方法也写成property的形式,并用箭头函数给其赋值。 对props进行限制: 组件的生命周期(旧版) 组件的生命周期(新版) 其实不管是新的生命周期还是旧的,常用的就3个: 三个废弃的钩子: 连续解构赋值加重命名: