JavaScript——基础语法

Xiao8830

已于 2022-11-02 09:14:34 修改

阅读量707

点赞数

分类专栏：前端文章标签： javascript 前端 java

于 2022-10-28 22:51:17 首次发布

本文链接：https://blog.csdn.net/m0_60867520/article/details/127580152

版权

前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

历史背景

初听这个名字，大家都觉得这个语言和java有关系，事实上，当时java是用来开发前端的，网景这个浏览器厂商，也想搞一个前端的语言，因此蹭了java的热度，改名叫javaScript
而JS现在不仅仅可以用来开发前端，也可以开发游戏，服务器，桌面程序，移动端app等等

和html搭配运行方式

和CSS的方式一样

行内式

<input type="button" value="hi"
onclick="alert('hello world')">

alert 表示弹出一个警示对话框，输出结果

内嵌式

把js代码写到script标签中

<script>
	alert("hello world");
</script>

外部式

引用外部的js

<script src="hello.js"></script>

注释

和java，C语言一样，javaScript下面几种注释方法

// 注释
/* 这是注释 */

输出

console.log('hello world');

和alert不同，这种输出是显示在控制台中的

alert("hello world");

变量

var a = 'a';
let x = 1;

其中var 和 let都是关键字，仅仅表示后面的是个变量，而不表示类型，也就是说，不管我们的变量是什么类型的，都可以用这两个关键字来表示
而这两个关键字的区别就是let是var的新式写法，解决了里面的一些bug
javaScript是一个弱类型的语言，并不像java一样强调变量的类型，不像java一样不能把类型不同的数据赋值给变量

数据类型

number

数字类型
不区分是浮点数还是整数
如果使用1/2，得到的是0.5，而不是0
Infinity 代表无穷大
NaN，代表不是一个数字，例如‘hello’ - 10

string

字符串形式
用.length来求字符串的长度
用+来进行字符串的拼接
用 == 来比较两个字符串的内容是否相等

boolean

和java不同，和C语言相同，true会隐式的转换成1，false会隐式的转换成0

undefined

当访问的变量没有被定义的话，将会显示undefined
如果和undefiend和数字进行算术运算，那么将显示NAN

null

访问的变量是定义过的，但是变量的值是空值

运算符

当两个变量用 == 比较时，会进行隐式转换
当两个变量用 === 比较时，不会进行隐式转换

&& 和 || 返回的是第一个或者第二个表达式的值
例如b = x || y，如果x是真，那么就把x赋给b，如果x是假，y是真，就把y赋给b，否则把0赋给b
例如b = x && y，如果x是假，则整个表达式是x的值，否则就是右侧的值

其他的运算符和java一样

数组

javaScript中的数组中的每个元素的类型可以不一样

创建数组

在javaScript中创建数组有多个形式

使用new关键字创建（A要大写）

let arr = new Array();

使用字面量常量

let arr = [];
let arr = [1,"handsome",2.5]

访问数组

通过下标访问

console.log(arr[0]);

如果我们访问的下标超出访问，则得到的结果是undefined，而不是抛出异常

如果直接给数组名赋值，那么整个数组的元素都会消失，数组会变成所赋值的元素

arr = "hello";

通过.length，可以获得数组的长度（注意：不是arr.length()，没有括号，因为length是属性，不是方法）

增加元素

如果直接更改了数组的长度，那么新增的元素都是undefiend
我们也可以通过下标直接新增元素

还可以使用push方法（类似于ArrayList中的add方法），直接在数组的最后增加一个元素

arr.push(1);

删除元素

使用splice方法，其有两个参数，第一个参数是删除元素的起始位置，第二个元素是要删除的个数

arr.splice(2,3);

这个方法还有第三个参数，就是把前面选定的范围内的元素都替换成第三个参数，通过这个方法我们也可以实现数组元素的替换

arr.splice(2,0,"hello");

函数

和我们的java中的方法，C语言中的函数都是类似的

语法

函数的定义：

function 函数名(形参列表) {
	函数体
	return 返回值;
}

(如果没有返回值，就不用写return)
函数的调用：

返回值 = 函数名(实参列表)

例如：

function add(a,b){
	return a + b;
}

console.log(add(2,3));

并且，由于javaScript的弱类型，我们可以传入字符串，实现字符串的拼接，可以传入true，其会自动转换为1，传入undefined，其如果和数字做加和得到NaN，还可以传入浮点数
因此，我们并不需要函数的重载

并且，由于javaScript具有鲁棒性，因此，我们实际上给add函数传多少个参数，都是可以正常运行的
如果我们只传入一个2，那么b就相当于undefiend，那么最终的结果就是NaN，如果我们传入2个以上的参数，那么第三个以后的参数就相当于没传入

因此，我们的函数还支持一种写法，就是使用arguments.length确定要传入函数的参数的个数，就相当于我们的hasNext

let add = function() {
	let sum = 0;
	for (let i = 0; i < arguments.length; i++) {
		sum += arguments[i];
	}
	return sum;
}

作用域

全局作用域：整个script标签或者js文件中生效
局部（函数）作用域：函数内部生效

// 全局变量
let a = 1;
console.log(a);
function test() {
	// 局部变量
	let b = 2;
	console.log(b);
}

作用域链

我们的javaScript中的函数可以定义在另一个函数的内部，因此具有作用域链
也就是说，内部的函数可以访问外部函数的局部变量，采用链式查找，从内向外的查找要访问的变量，如果最外层函数找不到，就到全局作用域找

对象

我们的javaScript有对象这个概念（和java的对象概念类似），但是并不是一个面向对象的语言，因为其没有封装，继承，多态

创建对象

使用键值对的形式来定义属性和方法

var student = {
	name: 'san',
	height: 188,
	weight: 130,
	sayHi: function() {
		console.log("hello");
	}
};

还可以直接new一个Object，后续进行属性的创建

var student = new Object(); // 和创建数组类似
student.name = "si";
student.height = 185;
student.weight = 140;
student.sayHi = function () {
	console.log("hello");
}

还可以使用构造函数的方法，这样可以把相同的属性和方法抽离出来

function Student(name,height,weight,sayHi){
	this.name = name;
	this.height = height;
	this.weight = weight;
	this.sayHi = function() {
		console.log("hello");
	}
}
let student = new Student("wu",144,150,"hi");