文章目录

前言
一、语法规则
二、弹框与控制台
三、变量的定义与赋值
四、变量的声明提升问题
五、数据类型
六、数据的强制转换
七、运算符

前言

学习地址：https://www.bilibili.com/video/BV1ZE411c7yM?p=30

一、语法规则

语法规则
学习程序，是有规律可循的，就是程序是有相同的部分，这些部分就是一种规定，不能更改，我们成为：语法。
(1) JavaScript对换行、缩进、空格不敏感。每一条语句以分号结尾。
也就是说：
代码一：

 <script type="text/javascript"> alert C今天蓝天白云") ；a1ert("我很高兴") ；</script>

等价于代码二：

 <script type="text/javascript"> alert("今天蓝天白云") ； a1ert("我很高兴") ；</script>

备注：
每一条语句末尾要加上分号，虽然分号不是必须加的，如果不写分号，浏览器会自动添加，但是会消耗一些系统资源。
(2)所有的符号，都是英语的。比如括号、引号、分号。如果你用的是搜狗拼音，建议不要用shift切换中英文(可以在搜狗软件里进行设置) ，不然很容易输入中文的分号；建议用ctrl+space切换中英文输入法。
(3)严格区分大小写

二、弹框与控制台

<script>// 弹框alert("123");// 控制台输出var a = "网络招聘"console.log(a);console.error("控制台中输出错误");console.warn("控制台中输出警告")
</script>

//弹框，带有确定和取消按钮的弹框(尽量少用原生的弹框)
var b= confirm("是否要进入百度页面?")
console.log(b) if(b){ //跳转至百度页面 location.href ="https://www.baidu.com"   }else{ //页面输出欢迎进入我们网站 document.write("欢迎进入我们网站");}

//带输入框的弹框
var c = prompt("你是哪里人？")

 document.write("欢迎进入我们网站");//页面输出
console.log(a);//控制台输出

三、变量的定义与赋值

变量举例如下：

 var a=100；//赋值式声明 var b；//单纯的声明var _abc； var  $abc； //必须是$、_、字母作为开头， 变量名称里还可以包含。 //var  1abc； //不允许数字开头 //var .abc； //不能以除_$之外的符号开头c = "123" //默认如果没有加var进行赋值，会在全局里创建一个变量

变量的命名规则：
1.建议用驼峰命名规则：getElement By ld/mather And Father/aaa Or Bbb And Ccc
2.变量命名必须以字母或是下标符号”_“或者”$"为开头。
3.变量名长度不能超过255个字符。
4.变量名中不允许使用空格，首个字不能为数字。
5.不用使用脚本语言中保留的关键字及保留字作为变量名。
6.变量名区分大小写(iava script是区分大小写的语言) 。
7.汉语可以作为变量名。但是不建议使用。

四、变量的声明提升问题

<script>var a "123" var b="456" var c；//声明没有赋值的情况下 会默认赋值为undefined//JavaScript在解释执行 之前，有预编译的过程，会将变量声明提升到最前面，但是不会将赋值提升     console.log(a) console.log(b)console.log(c) C= 789 console.log(d) var_d= 7890 console.log(d)</script>

五、数据类型

在JS中一共有六种数据类型：
1、基本数据类型(值类型) ：String字符串、Number数值、Boolean布尔值、Null空值、Undefined未定义。
2、引用数据类型(引用类型) ：Object对象。

<script type="text/javascript">
var a = "abc"；
var b = '123'；
var c = "";
var d = " this is'abc' "
//var f =" this is"abc" "  此写法不可行
var e= ="this is \ "abc  \ "";//   \表示后面的为字符串
var g=  ' \\ ' ； //  第一个\是表示后面的\为字符串
console.log(e)console.log(g) console.log(typeof a )// a的数据类型</script>

(1)在JS中，字符串需要使用引号引起来。使用双引号或单引号都可以，但是不要混着用。
比如下面这样写是不可以的： var str=`he11o"；
(2)引号不能嵌套：双引号里不能再放双引号，单引号里不能再放单引号。但是单引号里可以嵌套双引号。
(3)转义字符：在字符串中我们可以使用 ’ \ '作为转义字符，当表示一些特殊符号时可以使用 \ 进行转义。
\ " 表示 "
\ ‘表示’
\n 表示换行
\r 表示回车
\t 表示制表符
\b 表示空格
\ 表示 \

//任意的数据类型+字符串都会转换成字符串
var nam = 123;
var b =" 123 ";
console.log(b+num);

上方代码结果为
123123

数值型：Number
在JS所有的数值都是Number类型，包括整数和浮点数（小数）。

  var a = 100 //定义一个变量a,并且赋值100console.log(typeof a); //在控制台上输出a变量的类型

上方代码结果为
number

浮点数运算

在JS中，整数的运算基本可以保证精确；但是小数的运算，可能会得到一个不精确的结果。所以，千万不要使用JS 进行对精确度要求比较高的运算。
如下：

  var a=  0.1 + 0.2； console.log(a) ； //打印结果：0.30000000000000004

上方代码中，打印结果并不是0.3，而是0.30000000000000004。

undefined：未定义
声明了一个变量，但是没有赋值(例如：var a； ) ，此时它的值就是undefined。
1、Undefined类型的值只有一个，就是undefind
2、使用type of检查一个undefined时，会返回undefined。
null和undefined有最大的相似性。看看null = = undefined的结果(true) 也就更加能说明这点。
但是null===undefined的结果(false) 。它们虽然相似，但还是有区别的，其中一个区别是：和数字运算时， 10+ null结果为：10； 10+undefined结果为：NaN。
● 任何数据类型和undefined运算都是NaN；
● 任何值和null运算， null可看做0运算。

六、数据的强制转换

强制类型转换：将一个数据类型强制转换为其他的数据类型。
类型转换主要指，将其他的数据类型，转换为：String、Number、Boolean。你会把某个数据类型转换成null或者undefined吗?不会，因为这样做，没有意义。
1、 其他的简单类型->String
方法一：变量+""或者变量+“abc”
举例如下：

 var a = 123； //Number类型 console.log( a +  '')； //转换成String类型 conso1e.1og(a+'haha') ； //转换成String类型

上面的例子中，打印的结果，都是字符串类型的数据。

方法二：调用toString() 方法
举例如下：变量.toString（）
【重要】该方法不会影响到原变量，它会将转换的结果返回。当然我们还可以直接写成a=a.toString() ，这样的话，就是直接修改原变量。
注意：null和undefined这两个值没有toString() 方法，所以它们不能用方法二。如果调用，会报错。
另外， Number类型的变量，在调用toString) 时，可以在方法中传递一个整数作为参数。此时它将会把数字转换为指定的进制，如果不指定则默认转换为10进制。
例如：

  var  a  =   255；//对于Number调用toString O时可以在方法中传递一个整数作为参数 //此时它将会把数字转换为指定的进制，如果不指定则默认转换为10进制  a=a.toString(2) ；console.log(a) ； //11111111console.log(type of a) ； //string

方法三：使用String() 函数
格式如下： String(变量)
使用String() 函数做强制类型转换时：
● 对于Number和Boolean而言，实际上就是调用toString() 方法。
● 但是对于null和undefined，就不会调用toString() 方法。它会将null直接转换为"null"。将undefined直接转换为"undefined"。
prompt() ：用户的输入
prompt() 是专门用来弹出能够让用户输入的对话框。用户不管输入什么，都是字符串

2、其他的数据类型–>Number
方式一：使用Number()
函数情况一：字符串–>数字
●1.如果字符串中是纯数字，则直接将其转换为数字。
● 2.如果字符串中有非数字的内容，则转换为NaN。 (此处可以看到Number() 函数的局限性)
● 3.如果字符串是一个空串或者是一个全是空格的字符串，则转换为0。
情况二：布尔–>数字
● true转成1
● false转成0
情况三：null->数字
● 结果为：0
情况四：undefined->数字
●结果为：NaN

方式二：parseInt()：字符串>>整数【重要】

  parseInt() 是专门用来对付字符串的。 向下取整

parseInt() 的作用是将字符串中的有效的整数内容转为数字。parse表示"转换"， Int表示"整数”(注意Int的拼写)。
例如： parseInt("5") ；
得到的结果是数字5。

parseInt() 还具有以下特性：
(1)只保留字符串最开头的数字，后面的中文自动消失。例如：

console.log(parseInt("2017在公众号上写了6篇文章") ) ； //打印结果：2017
console.log(parseInt("2017.01在公众号上写了6篇文章") ) ； //打印结果仍是：2017 (说明只会取整数)
console.log(parseInt("aaa2017.01在公众号上写了6篇文章") ) ； //打印结果：NaN

(2)自动带有截断小数的功能：向下取整，不四舍五入。
例1：
var a=parseInt(5.8) +parseInt(4.7) ；
console.log(a) ；

控制台输出： 9

例2：

 var a=parseInt(5.8+4.7) ； console.log(a) ；

控制台输出： 10

(3) 如果对非String使用parse ln() 或parseFloat() ，它会先将其转换为String然后再操作。对于非字符串的非数值类型，不要使用parseInt进行转换，直接使用Number() 函数进行转换
比如：

 var a=true；console.log(parseInt(a) ) ； //打印结果：NaN (因为是先将a转为字符串"true"， 然后然后再操作) var b=null； console.log(parseInt(b) ) ； //打印结果：NaN (因为是先将b转为字符串"null"，然后然后再操作) var c=undefined；console.log(parseInt(c) ) ； //打印结果：NaN (因为是先将b转为字符串"undefined"， 然后然后再操作)var d=168.23； console.log(parseInt(d) ) ； //打印结果：168 (因为是先将c转为字符串"168.23"，然后然后再操作)(4)带两个参数时，表示进制转换。

parseFloat() ：字符串–>浮点数(小数)

 parseFloat() 是专门用来对付字符串的。

parseFloat() 的作用是：将字符串转换为浮点数。 parseFloat() 和parseInt() 的作用类似，不同的是， parseFloat() 可以获得有效的小数部分。
代码举例：

   var a = '123.456.789px'； console.log(parseFloat(a) ) ； //打印结果：123.456

转换为Boolean
将其他的数据类型转换为Boolean，可以使用Boolean() 函数。
情况一：数字 -->布尔。除了0和NaN，其余的都是true。
情况二：字符串 —>布尔。除了空串，其余的都是true。
情况三：null和undefined都会转换为false。
情况四：对象也会转换为true。
PS：转换为Boolean的这几种情况，很重要，开发中会经常用到。

其他进制的数字
16进制的数字，以0x开头
8进制的数字，以0开头
2进制的数字， 0b开头(不是所有的浏览器都支持：chrome和火狐支持， IE不支持)
比如070这个字符串，如果我调用parse lnt(转成数字时，有些浏览器会当成8进制解析，有些会当成10进制解析。
所以，比较建议的做法是：可以在parseInt() 中传递第二个参数，来指定数字的进制。
例如：

 a = "070"； a = parseInt(a， 10) ； //转换成十进制

七、运算符

算数运算符的运算规则
(1)先算乘除、后算加减。
(2)小括号：能够影响计算顺序，且可以嵌套。没有中括号、没有大括号，只有小括号。
(3)百分号：取余。只关心余数。
举例1：(取余)

 console.log(3%5) ；

输出结果为3。
举例2：(注意运算符优先级)

  var  a=1+2*3%4/3；

结果分析：原式 = 1+6%4/3=1+2/ 3 =1.66666666666666

算数运算符的注意事项
(1) 当对非Number类型的值进行运算(包括+、一、 *、/) 时，会将这些值转换为Number然后再运算。

比如：

 result 1=true+1； //  2=1+1result 2=true+false； //  1=1+0  result 3= 1 + null； //1=1+O  result 4=100 - '1'// 99

(2) 任何值和NaN做运算的结果都是NaN。
(3)任何的值和字符串做加法运算，都会先转换为字符串，然后再做拼串操作。

比如：
result 1=1+2+'3' // 33
result 2='1'+2+3； // 123

我们可以利用这一特点，来将一个任意的数据类型转换为String：我们只需要为任意的数据类型+一个""即可将其转换为String。这是一种隐式的类型转换，由浏览器自动完成，实际上它也是调用String) 函数。也就是说， c= c+""等价于c=String(c) 。
(4) 任何值做-、*、/运算时都会自动转换为Number。
我们可以利用这一特点，为一个值-0、 *1、/1来将其转换为Number。原理和Number(函数一样，使用起来更加简单。

逻辑运算符
逻辑运算符有三个：
&& 与(且)：两个都为真，结果才为真。
|| 或：只要有一个是真，结果就是真。
! 非：对一个布尔值进行取反。
连比的写法：来看看逻辑运算符连比的写法。
举例1：

   console.log (3<2&&2<4) ；

输出结果为false。
举例2：(判断一个人的年龄是否在18~60岁之间)

   var  a = prompt("请输入您的年龄") ；alert(a>=18&&a<=65) ；

注意事项
(1)能参与逻辑运算的，都是布尔值。
(2) JS中的&&属于短路的与，如果第一个值为false，则不会看第二个值。举例：

  //第一个值为true， 会检查第二个值 true  &&  alert("看我出不出来!!") ； //  可以弹出alert框 //第一个值为false， 不会检查第二个值 false && alert("看我出不出来!!") ； //不会弹出alert框

(3) JS中的||属于短路的或，如果第一个值为true，则不会看第二个值。
(4)如果对非布尔值进行逻辑运算，则会先将其转换为布尔值，然后再操作。举例

 vara=10； a= !a；console.1og(a) ； //false console.log(typeof a) ； //boolean

上面的例子，我们可以看到，对非布尔值进行!操作之后，返回结果为布尔值。

赋值运算符
可以将符号右侧的值赋值给符号左侧的变量。
举例：
● +=。 a+=5等价于a=a+5
● -=。 a-=5等价于a=a-5
● *=。 a*=5等价于a=a*5
● /=。 a/=5等价于a=a/5
● %=。 a%=5等价于a=a%5

关系运算符
通过关系运算符可以比较两个值之间的大小关系，如果关系成立它会返回true，如果关系不成立则返回false。
关系运算符有很多种，比如：

大于号
< 小于号
= 大于或等于
<= 小于或等于
== 等于
===全等于
!= 不等于
!==不全等于

关系运算符，得到的结果都是布尔值：要么是true，要么是false。
举例如下：

 var result=5>10； //false

非数值的比较
(1)对于非数值进行比较时，会将其转换为数字然后再比较。
举例如下：

 console.log(1>true) ； //false console.log(1>=true) ； //true console.log(1>"0") ； //true //console.log(10>null) ； //true//任何值和NaN做任何比较都是false console.log(10<="he11o") ； //false
console.log(true>false) ； //true

(2)特殊情况：如果符号两侧的值都是字符串时，不会将其转换为数字进行比较。比较丁付中，字符串的Unicode编码。【非常重要，这里是个大坑】

比较字符编码时，是一位一位进行比较。如果两位一样，则比较下一位，所以借用它可以来对英文进行排序。

PS：所以说当你尝试去比较"123"和"56"这两个字符串时，你会发现字符串"56"音然比字符串"123"要大。也就是说下面代码的打印结果，其实是true：
//比较两个字符串时，比较的是字符串的字符编码，所以可能会得到不可预期的结果
console.log(“56”>“123”) ； //true
因此：当我们在比较两个字符串型的数字时，一定一定要先转型，比如parseInt() .
(3) 任何值和NaN做任何比较都是false。

==符号的强调
注意==这个符号，它是判断是否等于，而不是赋值。
(1)==这个符号，还可以验证字符串是否相同。例如：

 console.log("我爱你中国”=="我爱你中国") ； //输出结果为true

(2)==这个符号并不严谨，会将不同类型的东西，转为相同类型进行比较(大部分情况下，都是转换为数字)。例如：

   console.log("6"==6) ； //打印结果：true。这里的字符串"6"会先转换为数字6， 然后再进行比较 console.log(true=="1") ； //打印结果：true console.log(0==-0) ； //打印结果：

true console.log(null==0) ； //打印结果：false

(3) undefined衍生自null，所以这两个值做相等判断时，会返回true。

console.log(undefined==null) ； //打印结果：true。

(4) NaN不和任何值相等，包括他本身。

console.log(NaN==NaN) ； //false

问题：那如果我想判断b的值是否为NaN，该怎么办呢?
答案：可以通过isNaN(函数来判断一个值是否是NaN。举例：

console.log(isNaN(b) ) ； //false
如上方代码所示，如果b为NaN，则返回true；否则返回false。

===全等符号的强调
如果要保证完全等于，我们就要用三个等号===。
全等不会做类型转换。
例如：

 console.log("6"===6) ； //false console.log(6===6) ； //true

上述内容分析出：
==两个等号，不严谨， "6"和6是true。
===三个等号，严谨， "6"和6是false。
另外还有：==的反面是!=，===的反面是!==。。例如：

 console.log(3 !=8) ； //trueconsole.log(3 !="3") ； //false， 因为3=="3"是true， 所以反过来就是false console.log(3!=="3") ； //true， 应为3==="3"是fa1se， 所以反过来是true。

《javascript基础》学习笔记一相关推荐

【web编程技术学习笔记】因特网与万维网简介
目录 Client客户端 Server服务器端 TCP/IP五层协议 IP 查看IP地址的的两种方法 TCP URL 样式一样式二 DNS URL&DNS HTTP 与因特网有关的组织 IE ...
程序员编程技术学习笔记
程序员编程技术学习笔记看july的博客也有好久了,一直没能好好整理一下自己的学习笔记,开了博客之后更加愿意好好整理一番了.其中不免有些内容在july那里可以找到原文,但是更多的加入了我个人的 ...
JAVA 网络编程技术学习笔记
目录一.网络编程基本概念(了解) 1.1 计算机网络 1.2 网络通信协议 1.2.1什么是网络通信协议 1.2.2 OSI七层协议模型 1.2.3网络协议的分层 1.3数据的封装和解封 1.4 I ...
《ASP.NET MVC4 WEB编程》学习笔记------Web API 续
目录 ASP.NET WEB API的出现缘由 ASP.NET WEB API的强大功能 ASP.NET WEB API的出现缘由随着UI AJAX 请求适量的增加,ASP.NET MVC基于Jso ...
java网络编程技术学习笔记（b站【狂神说Java】网络编程实战讲解）
b站视频链接:[狂神说Java]网络编程实战讲解文章目录网络编程 1.1.概述 1.2.网络通信的要素 1.3.IP 1.4.端口 1.5.通信协议 1.6.TCP 文件发送 1.7.UDP 1. ...
SpringBoot整合第三方技术学习笔记（自用）
SpringBoot整合第三方技术学习笔记搬运黑马视频配套笔记 KF-4.数据层解决方案 KF-4-1.SQL 回忆一下之前做SSMP整合的时候数据层解决方案涉及到了哪些技术?MySQL数据库与My ...
java mvc框架代码_JAVA技术学习笔记：SpringMVC框架（内附入门程序开发代码）
原标题:JAVA技术学习笔记:SpringMVC框架(内附入门程序开发代码) JavaEE体系结构包括四层,从上到下分别是应用层.Web层.业务层.持久层.Struts和SpringMVC是Web层的 ...
ssm 转发请求_千呼万唤！阿里内部终于把这份SSM框架技术学习笔记分享出来了...
SSM SSM(Spring+SpringMVC+MyBatis)框架集由Spring.MyBatis两个开源框架整合而成(SpringMVC是Spring中的部分内容).常作为数据源较简单的web项 ...
【C#编程基础学习笔记】6---变量的命名
2013/7/24 技术qq交流群:JavaDream:251572072 教程下载,在线交流:创梦IT社区:www.credream.com [C#编程基础学习笔记]6---变量的命名 ----- ...
【C#编程基础学习笔记】4---Convert类型转换
2013/7/24 技术qq交流群:JavaDream:251572072 教程下载,在线交流:创梦IT社区:www.credream.com [C#编程基础学习笔记]4---Convert类型转换 ...

《javascript基础》学习笔记一

文章目录

前言

一、语法规则

二、弹框与控制台

三、变量的定义与赋值

四、变量的声明提升问题

五、数据类型

六、数据的强制转换

七、运算符

《javascript基础》学习笔记一相关推荐

最新文章

热门文章

《javascript基础》学习笔记 一

文章目录

前言

一、语法规则

二、弹框与控制台

三、变量的定义与赋值

四、变量的声明提升问题

五、数据类型

六、数据的强制转换

七、运算符

《javascript基础》学习笔记 一相关推荐

最新文章

热门文章

《javascript基础》学习笔记一

《javascript基础》学习笔记一相关推荐