js概述1

太过爱你忘了你带给我的痛 2022-05-13 18:43 205阅读 0赞

javascript 既可以作为前端语言，也可以作为后端语言

语法上与java有类似之处，但本质上与java语言没有关系，也就是发布的时候想蹭蹭java的热度，没想到火了，造化弄人啊。

# 1. javascript 基本语法 #

## 1.1 基本数据类型 ##

number 数字类型， 1.0 100  
string 字符串类型 “hello” ‘world’  
null 空值  
undefined 未定义 比如一个变量还没有赋值  
布尔类型 true false

变量是弱类型，值有类型

int a = 10; // java 语法
    String b = "hello";
    
    var a = 10; 		// var 表示任意的类型，数字，字符串，空值 ...
    var b = "hello";

## 1.2 调试基本方法 ##

用F12调出控制台窗口， 切换到Console ， 可以输入js代码进行调试  
console.log(变量); 用来将变量或表达式结果输出到console窗口

## 1.3 复杂类型 ##

1.  数组【重点】
    
    var a = new Array(); // 新建一个空数组  
    var a = \[\]; // 新建一个空数组  
    var a = \[1,2,3,4,5\]; // 五个整数元素数组

访问数组元素, 通过数组\[下标\]来访问  
遍历数组：

for(var i = 0; i < a.length; i++) { // 推荐写法
    	console.log(a[i]);
    }
    for(var i in a) {
    	console.log(a[i]);
    }

添加元素

.push(元素); // 在数组的尾部新增
    	.unshift(元素); // 在数组的头部新增

修改元素  
直接通过下标修改  
删除元素

.pop();  // 删除尾部元素
    	.shift(); // 从头部删除元素
        .splice(要删除的下标, 要删的个数);

排序

.sort();
    	.sort( (a,b) => b - a );

> var a = \[1, 21, 12, 2, 3, 31\]; // 默认不带参数排序，是把数字当做了字符串进行的排序  
> a.sort((a,b) => a - b ); // 减法可以让字符串再变回数字

1.  对象 (js对象属性可以动态添加)【重点】
    
    var a = new Object(); //创建一个空对象  
    [a.name][] = “张三”;  
    a.age = 18;

还可以使用 delete a.age 来删除a对象中的age属性

简化写法：  
var a = \{\}; //创建一个空对象  
格式: \{ 属性名:属性值, 属性名:属性值 …\}

var a = {"name":"张三", "age":18}; // 属性名两边的双引号可以省略

1.  函数 (类似于java的方法)【重点】  
    语法

function 函数名(a, b) {
    	...
    }

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

等价写法

var sum = function (a, b) { // 匿名(没有名字的函数)
    	return a + b;
    }

调用函数 sum(5, 4);

js中实际参数和形参可以不匹配

sum(4,5,6)
    sum(4,5,6,7)
    sum(4); // 4+undefined = NaN  (not a number)

function sum (a, b) {
    	return a + b;
    }
    
    function sum (a, b, c) {
    	return a + b + c;
    }

如果定义了两个同名函数，后定义的会覆盖前面定义的。

1.  日期【了解】
    
    var date = new Date();  
    date.getFullYear(); // 获取年份  
    date.getMonth(); // 获得月份(从0开始)  
    date.getDate(); // 获取日期
    
    var date = new Date(1535445539597); // 根据毫秒值创建日期
2.  正则表达式【了解】  
    var reg = new RegExp(“正则表达式”); // 用new来创建  
    简化写法  
    var reg = /正则表达式/;

例如：是否全部是数字  
var reg = /1\+$/;  
reg.test(“目标字符串”);

验证是否是手机号码  
`var reg = /^1[35789][0-9]{9}$/;`

替换功能

var str = "aaaabbbcccaaa";
    str.replace(/a+/, "A");  // 只会替换第一个匹配到的子串
    str.replace(/a+/g, "A");  // 会替换所有匹配的子串

javascript 最大作用：能够操作页面上的标签  
查找页面标签  
1） 根据id查找页面标签

document.getElementById("id值");

2） 获取标签内的内容  
标签对象.innerText  
3） 获取属性  
标签对象.属性名

特殊的：获取class属性 标签对象.className  
获取style样式 标签对象.style.具体样式名

4） 删除  
父标签对象.removeChild(子标签对象);

5） 新增  
var p = document.createElement(“p”); // 创建了段落标签, 但没有加到页面上  
p.innerText = “标签内容”;

父标签对象.appendChild(子标签对象); // 在末尾添加子标签

var 	a = document.createElement("a");
       a.href="aaa";
       a.innerText="我是超链接";
       document.body.appendChild(a);