javascript文件的扩展名为,js文件的扩展名必须是

大家好，给大家分享一下扩展名为js的文件怎么打开，很多人还不知道这一点。下面详细解释一下。现在让我们来看看！

一、概述

1.1 什么是JavaScript?

1.1.1 概念

JavaScript 是脚本语言，是一种解释性脚本语言（代码不进行预编译）

JavaScript是一种轻量级的编程语言

JavaScript是可以插入HTML页面的编程代码

JavaScript插入HTML页面后，可由所有的现代浏览器执行

1.1.2 作用

1. 为网页添加各式各样的动态功能
2. 为用户提供更流畅更美观的浏览效果

通常JavaScript脚本是通过嵌入在HTML中来实现自身功能的。

1.2 JavaScript用法

JavaScript通常简称为js，或js脚本

1.2.1 HTML页面中的JavaScript

在HTML页面中的脚本必须位于围堵标签之间，标签放在head中可以，body中也可以，放在最后也可以，对位置要求不严格

我们可以在HTML文档中放入不限数量的标签，通常的做法是把内容统一放入head或者页面底部，这样可以把它们安置到同一处位置，不会干扰页面的内容

PS：有些案例中可能会在标签中出现type=“text/java”Python中的所有运算符号。现在完全可以省略了，JavaScript已经是所以现代浏览器以及HTML5中的默认脚本语言。

1.2.2 外部的JavaScript

可以把脚本保存到外部文件中，外部文件通常包含被多个网页使用的代码。外部JavaScript文件的文件扩展名是：.js。

当我们使用外部文件时，在HTML页面的标签的“src”属性中设置该 .js文件：

PS：外部脚本不能包含标签

1.2.3 标签属性中的JavaScript

直接编写在HTML标签的一些属性中，用于简单的JavaScript代码的编写，用的偏少

<a href="java:alert('ok')">登录</a>

1.3 JavaScript显示数据

1.3.1 使用window.alert()弹出框

PS这里的window可以省略，等价于alert(“hello”);

1.3.2 使用document.write()将内容写入到html文档

1.3.3 使用innerHTML写入到HTML元素

注意，此时浏览器报错，因为代码从上至下执行，红色部分要获取id=1的元素，但是此时div元素并未创建，所以会报错，我们需要将红色部分移动到元素创建完毕之后。

1.3.4 使用console.log写入到浏览器控制台

二、JavaScript的注释

JavaScript注释与java的单行和多行注释相同

单行注释以//开头

多行以 /* 开头 ，以*/结尾

三、JavaScript基本语法

JavaScript是一个脚本语言，它是一个轻量级，但功能强大的编程语言。

JavaScript语法跟java相似，但是也有区别，JavaScript是弱语言类型，即有些时候有些错误不影响运行，但是依然推荐大家按照规范去写代码。

3.1 JavaScript变量

声明变量用关键字：var

语法：var 变量名;

变量的命名规则：

• 变量必须以字母开头
• 变量也能以 $ 和 _ 符号开头
• 变量名称对大小写敏感（y和Y是不同变量）
• 不能使用关键字保留字

变量的命名规范：

• 见名知意。例如：breadPirce,userService等，避免无意义的a.b.c等
• 推荐驼峰命名法，即第一个单词的首字母小写，以后每个单词的首字母大写。例如lastName

3.2 JavaScript的语句

JavaScript语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么

JavaScript是脚本语言，浏览器会在读取代码时，逐行地执行脚本代码，而对于传统编程来说，会在执行前对所有代码进行编译。

JavaScript中也有分支结构和循环结构，语法与java类似，此处就不再深入讲解。细节上的内容等我们后面使用过的时候再说

PS：一般一行只写一条语句，每句以分号结束

3.3 JavaScript的数据类型

3.3.1 值类型（基本类型）

3.3.1.1 字符串String

字符串是储存字符的变量。字符串可以是引号中的任意文本。必须使用单引号或者双引号：

3.3.1.2 数字Number

JavaScript只有一种数字类型。数字可以带小数点，也可以不带：

3.3.1.3布尔boolean

只能有两个值：true 或 false

3.3.1.4 空 null

var email = null;

3.3.1.5 未定义 undefined

表示变量不含有值。可以通过将变量的值设为null来清空变量。

共有四种情况会出现undefined的值

1、变量声明且没有赋值

var obj;
alert(obj);//obj值为undefined

2、获取对象中不存在的属性时

var obj;
alert(obj.name);//报错信息： "Uncaught TypeError: Cannot read property 'name' of undefined"

3、函数需要实参，但是调用时没有传值，那么函数的形参是undefined;
4、函数调用没有返回值或者return后没有数据，接收函数返回值的变量是undefined

function printNum(num){
   
				alert(num);
			}
var result = printNum();//调用函数未传递参数，执行函数的时候num的值是undefined 
alert(result);//result的值也是undefined，因为printNum()没有返回值

3.3.1.6 Symbol

表示独一无二的值

3.3.2 引用数据类型：

对象（Object）、数组（Array）、函数（Function）

3.3.3 JavaScript拥有动态类型

JavaScript拥有动态类型，这意味着相同的变量可用作不同的类型；

var param; //param 类型为 undefined
			param = 5; //现在 param 为数字
			param = "john";//现在 param 为字符串

PS：不推荐该写法，还是应该声明变量时就确定它是什么类型，不要再更改

3.4 JavaScript中的运算符

算数运算符：+ - x / % 、 ++ 、 –
赋值运算符：= 、 +=、 -= 、*= 、 /= 、 %=
字符串的连接符：+
逻辑运算符： && || ！
条件运算符：？:
比较运算符： == 、！= 、 > 、<、 >= 、 <=
以上运算符的运算规则与java一样，强调两个新的比较运算符：

var x = 5;
var res;
res = (x===5);//trye
res = (x==='5');//false
res = (x!==5);//false
res = (x!=='5');//true

四、JavaScript对象

4.1 JavaScript的String对象

4.1.1 String对象属性-长度属性

var str = "12345";
console.log(str.length); //5

4.1.2 String对象方法

类似java

4.2 JavaScript的Array对象

Array对象用于在变量中存储多个值，也就是数组

4.2.1 声明数组

4.2.2 数组的长度 length 属性

此处注意length是数组的属性，而不是方法，所以没有括号

var nameArr=["宝玉","黛玉","湘云"]; 
var len=nameArr.length; //获取数组的长度

4.2.3 Array对象的方法

4.3 JavaScript的Date对象

4.3.1 创建日期对象

var date1 = new Date(); 
var date2 = new Date(milliseconds); 
var date3 = new Date(dateString); 
var date4 = new Date(year, month, day, hours, minutes, seconds, milliseconds);

4.3.2 日期对象的常用方法

4.4 JavaScript的Math对象

与Java中的Math相似，跟数字相关的内容都在这里。有很多方法属性与java中也相似。

4.4.1 Math常用属性

var pi = Math.PI; //返回圆周率

4.4.2 Math常用方法

var num=Math.random();//    返回 0 ~ 1 之间的随机数。 
var max=Math.max(12,34,-90,9);//返回 n个数值中的大值。 
var min=Math.min(12,34,-90,9);//返回 n个数值中的小值。

五、JavaScript调试

六、JavaScript的函数

6.1 JavaScript的常用全局函数

JavaScript中有个常用的全局属性NaN，即非数值(Not a Number)，NaN属性用于引用特殊的非数字值，该属性指定的并不是不合法的数字。

6.1.1 isNaN(param)

用于检查其参数是否是非数字值。
是数值的返回false，不是数值返回true

console.log(isNaN(666));//false 
console.log(isNaN(1+2));//false 
console.log(isNaN("hello"));//true

6.1.2 parseFloat(String)

可解析一个字符串，并返回一个浮点数。该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串

console.log(parseFloat("66"));//66 
console.log(parseFloat("199.99"));//199.99 
console.log(parseFloat("1024 2048 4096"));//1024 
console.log(parseFloat(" 128 "));//128 
console.log(parseFloat("10年"));//10 
console.log(parseFloat("今天是8号"));//NaN

• 字符串中只返回第一个数字
• 开头和结尾的空格是允许的
• 如果字符串的第一个字符不能被转换为数字，那么parseFloat() 会返回NaN

6.1.3 praseInt(String,radix)

可解析一个字符串，并返回一个整数

当参数radix的值为0，或没有设置该参数时，parseInt()会根据String 来判断数字的基数

当忽略参数 radix，JavaScript默认数字的基数如下：

• 如果String 以"0x"开头，parseInt() 会把String 的其余部分解析为十六进制的整数
• 如果String 以 0 开头，那么ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进 制或十六进制的数字。
• 如果String 以 1 - 9 的数字开头，parseInt()将把它解析为十进制的整数

console.log(parseInt("66"));//66 
console.log(parseInt("199.99"));//199 
console.log(parseInt("1024 2048 4096"));//1024 
console.log(parseInt(" 128 "));//128 
console.log(parseInt("10年"));//10 
console.log(parseInt("今天是8号"));//NaN
console.log(parseInt("10",10));//10 
console.log(parseInt("010"));//10 
console.log(parseInt("10",8));//8 
console.log(parseInt("0x10"));//16 
console.log(parseInt("10",16));//16 
PS:旧浏览器由于使用旧版本的ECMAScript（ECMAScript版本小于ECMAScript 5
当字符串以"0"开 头时默认使用八进制，ECMAScript 5使用的是十进制）
所以在解析("010") 将输出8

• 只有字符串中的第一个数字会被返回
• 开头和结尾的空格是允许的
• 如果第一个字符不识数字，那么会返回NaN
• 在字符串以“0”为开始时 默认是十进制基数

6.2 JavaScript的自定义函数

类似Java

6.2.1 自定义函数语法

使用function关键字定义函数

function 自定义函数名称(参数列表){
   
    //函数体 
}

6.2.2 自定义函数实例

注意：
1、函数的形参直接写参数名称，不需要声明类型，所以不需要写 var
2、函数的返回取决于函数体中是否有return关键字

6.3 JavaScript的匿名函数

七、JavaScript变量的作用域

7.1局部JavaScript变量

在JavaScript函数内部声明的变量（使用var）是局部变量，所以只能在函数内部访问。

在不同的函数中可以声明名称相同的变量，因为局部变量出该函数就失效了。

7.2 全局JavaScript变量

在函数外声明的变量是全局变量，网页上所有脚本和函数都能访问它。

7.3 变量的生命周期

JavaScript 变量的生命周期从它们被声明的时间开始

局部变量会在函数运行以后被删除，全局变量会在页面关闭后被删除。

八、JavaScript自定义对象

对象也是一个变量，但对象可以包含多个值（多个变量）

8.1 定义对象

对象中可以有属性，也可以有方法

8.2 对象的属性

可以说JavaScript中的对象是变量的容器

但是，我们通常认为JavaScript对象是键值对的容器

键值对通常写法为 name:value （键与值以冒号分割）

键值对在JavaScript对象通常称为 对象的属性

8.3 访问对象的属性

8.4 访问对象的方法

九、JavaScript Window–浏览器对象模型

浏览器对象模型（BOM）使 JavaScript 有能力与浏览器“对话”。

BOM：Browser Object Model , 中文 浏览器对象模型

虽然现在BOM尚无正式标准，但是由于现代浏览器已经几乎实现了JavaScript交互性方面的相同方法和属性，因此window常被认为是BOM的方法和属性

9.1 window对象

所有浏览器都支持window对象。它表示浏览器窗口。

多有JavaScript 全局对象，函数以及变量均自动称为window对象的成员

全局变量是window对象的属性。全局函数是window对象的方法

window 对象表示浏览器中打开的窗口

9.2 window对象属性

常用属性：

9.2.1 history对象

window.history对象包含浏览器的历史

window.history 对象在编写时可不使用window这个前缀。

常用方法：

history.back()-与浏览器点击后退按钮相同
history.forward() -与浏览器点击向前按钮相同
history.go(1/-1) -参数为1 等同于history.forward()，参数为-1 等同于history.back()

例如：

<a href="java:window.history.forward()">前进</a> 
<a href="java:window.history.back()">后退</a> 
<a href="java:window.history.go(1)">前进go</a>