JS学习笔记day1

一、JS特点：

1. 弱类型语言:不需要指定变量类型

2. 跨平台语言:可以运行在多个平台

运行在chrom V8引擎（js解析器）中，依赖于html文件

js运行Node环境中，全栈阶段（js写服务器）

3. js三大组成部分：

3.1、ECMAScript(es5,es6):核心语法(变量声明,语句,变量提升, promise,模块化,async.. ..)

3.2 DOM(Document object ·Model):文档对象模型(用户之间的交互---写特效)

3.3、BOM(Brower-0bject Model):浏览器对象模型(弹窗,用户的缓存,定时器..)

二、引入方式：

（1）行内：

在开始标签中添加·事件属性(obclick)="js代码"-->

<button onclick="alert( " hello')">点击会有一个弹出框</button>

<!--·禁止跳转--->

<a href="javascript:void(0)">点击跳转页面</ a>

（2）内部：

写script标签,在script标签中写js代码一个页面中可以有多个script标签

<script>

var myname · = "hello";//初始化变量(声明了变量并且赋值)

console.log(myname)；

</script>

（3）引入外部js文件 （项日开发中常用(抽离公共的功能））

css中引入外部文件 link标签

js中引入js文件 script标签的src属性

script标签中有src属性,当前script标签中的代码不会执行，需要重新新建一个没有src的script标签,访问外部js中的数据。

<script src=”./index.js”>

</script>

<script>

Console.log(1111);

</script>

三、Js的输出

1.输出到控制台

1.1、console.log(); 简写log：(常用，检测有没有值)

1.2、

console.dir(); 查看详细信息(一般是函数)dirtory目录的缩写

1.3、

console.table(以表格的形式显示在控制台,参数是对象

对象中是多个链值对,键值对是山键名(属性)和键值(属性值)两部分组成

属性和属性名之间用:分隔开,多个键值对之问用逗号分隔开

1.4、console-clear(清空控制台)

1.5、console.warn("这是一条黄色的警告信息");

1.6、console.error('这是一条红色错读信息');

2.输出到页面

2.1 、

document.write()·参数是字符串

将内容添加到body标签中显示，不会覆盖之前的内容，可以识别html标签

2.2 、innerHTML

元素.innerHTML=字符串

将内容添加元素中显示,会覆盖之前的内容，可以识别html标签

需要获取到元素(页面中指定的标签) :

document.querySelector( "css选择器") 存在返回元素,不存在返回null

2.3、innerText

元素.innerText=字符串

将内容添加元素中显示,会覆盖之前的内容,不可以识别html标签

3、弹框

3.1、window . alert() 简写alert(); 点击确认的返回值是undefined

3.2、输入框: window. prompt() prompt() 点击确认的返回值是用户输入的内容,取消为null

3.3、确认框:window .comfirm()·简写comfirm() 确定返回值true ,取消返回值是false

4、变量的声明

1.变量:可变的数据,可以存储征意数据类型的容器

2.声明变量

2.1 -es5中是通过var关键字声明(存在变量提升)

2.2 -es6中是通过·let const关键字声明

3.变量名规则：

变量名是由字母,数宁,下划线,$组成变量名不能以数字开头

严格区分大小写

变量名不能是关键宁和保留字

变量名尽量不要用中文

可以使用驼峰式命名--背景色

Backguand_color;

backguandColor;//小驼峰

BackguandColor;//大驼峰

语法规范:

“;”表示一个语句的结束,在js中没有严格要求必须加分号,尽量自己加上分号

5、数据类型

1.基本（原始）数据类型：存在内存中

string(字符串) , number(数值), boolean(布尔),null, undefined

2、引用数据类型：堆内存

array（数组), object对象,function函数

（1）String:通过引号(es5:双引号""·单引号"'·es6:反引号``（英文状态下最上一·排数字健盘1的左边）引起来

typeof操作符：检测数据类型 返回“string”

“+”：.在字符串中的+不是运算符,而是拼接符

转义字符：（\n,\",\'）

（2）number数值类型包括:整数,小数,0, Infinity(正无穷), -Infinity(负无穷),NaN( not a number)

NaN:

NaN与任何数据进行运算时返回值始终为NaN

ES5中 ,NaN与任何值都不相等包括它本身

小数精度丢失问题：

解决方法1:将小数转换为整数

解决方法2:调用toFixed()方法,保留几位小数,返回值string类型

toFixed(n),保留n位小数,n的取值范围[e,10e]

（3）.布尔类型 true和false 返回值类型：boolean

(4).null和undefined（相等但是不全等）

null空值,声明了变量不确定需要保存是什么数据,可以赋值为null

undefined未定义,声明了变量但是没有赋值,那么变量的值为undeifned

相同点:都表示的是一个空值, null是自已手动设置的，

区别:undefined是声明变量没有赋值,js解析器给变量赋了一个空值,这个空值叫做undefined

=：赋值,将等号右边的数据赋值给等号左边的变量

==：相等,判断值不怕判断数据类型,返回值是布尔类型

===：全等,判断值和数据类型是否全等,返回值是布尔类型

四、转换数据类型：

1、转换为数值类型

1）强制转换:Number()

2）parseInt() 返回的是整数/NaN

忽略前导的0/+/-

第一个是字符,返回NaN

第一个不是字符,返回遇到字符前的整数部分

有两个点,返回的是第二个点之前的整数部分

3）parseFloat() 返回的是数值/NaN

忽略前导的0/+/-

第一个是字符,返回NaN，

第一个不是字符,返回遇到字符前的数值部分，

有两个点,返回的是第二个点之前的数值部分

isNaN()方法:

判断数据是否为NaN,返回值是布尔类型(true/false)

注意：是NaN : true 不是:false

js面试题:==的判断流程：

1.都是数值,直接进行比较

2.一个是字符串,一个是数值,先将字符串转换为数值类型再进行比较

3.一个是布尔类型,一个是数值,先将布尔类型转换为数值类型再进行比较

4.一个是null,一个是undeifned ,结果为true

5.引用数据类型进行比较,先调用valueof()方法获取原始值(原始值一般为它本身),如果原始值不是基本数据类型,再调用tostring()方法转换为字符串

2、将其他数据类型转换为字符串类型

2.1、 String(xx)

2.2、toString()·xxx.tostring() 注：null和undefined没有toString方法

3、将其他数据类型转换为布尔类型

3.1、Boolean()

五、操作符：

1、一元操作符：对一个对象操作

前自加:在运算之前+1，-++变量

前白减:在运算之前-1,--变量；

后自加:在运算之后+1，-++变量

后白减:在运算之后-1,--变量