JavaScript

引入方式

1.在body内的<script>中写js代码

<script>
  alert('骑士计划！')    alert  弹窗  打开网页时会弹出提示窗口
</script>

2.外部链接

将写好的js文件引入

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

注释

// 这是单行注释

/*
这是
多行注释
*/

数据类型

数值 number

不区分整型和浮点型

parseInt()   将括号内的内容转换成数值类型

parseInt('123');
---->123

parseInt('abc');      
---->NaN              # NaN，表示不是一个数字（Not a Number），也就是说是一个值，但不是数字

字符串  string

字符串方法

.length 返回长度
.trim() 移除空白
.trimLeft()    移除左边的空白
.trimRight() 移除右边的空白
.charAt(n) 通过索引查找元素,超过最大值返回''空字符串
.concat() 拼接
也可以通过 + 来进行字符串拼接
.indexOf(,索引) 子序列位置,从索引几开始找,没有返回-1
.slice(start, end) 切片 顾头不顾尾
.toLowerCase() 小写
.toUpperCase() 大写
.split('', 元素个数) 分割 第一个参数为指定以什么分割,第二个可以指定最终结果显示几个值

布尔值   Boolean

true和flase都是小写

""(空字符串)、0、null、undefined、NaN都是false

object   对象

null       空        需要指定或情况一个变量时使用

array    数组    [1,2,3]    类似于python 的列表

object   自定义对象   {'name':'alex',gender:male}  类似于python的字典,键可以不加引号

以上三种类型打印typeof数据类型 都是object

数组方法:
.length              数组的大小
.push()              尾部追加元素
.pop()              删除尾部元素,得到删除的值
.unshift()          头部插入元素
.shift()          头部移除元素
.slice(1,4)          切片
.reverse()        反转   会改变原数组
.join()           将数组元素连接成字符串
.concat()         两个数组合并,得到一个新数组，原数组不变
.splice()         #参数：1.从哪删(索引)   2.删几个  3.删除位置替换的新元素(可多个元素)
.sort()            排序    如果对数字进行排序,会把数字都转换成字符串,按照字符编码的顺序进行排序
如果想要正确的排序,需要写函数:
function sortNumber(a,b){
    return a - b                #升序  降序为b-a
}
var arr1 = [11, 100, 22, 55, 33, 44]
arr1.sort(sortNumber)

自定义对象方法:
d.name             通过键取值
d['gender']        通过键取值

运算符

算数运算符

+

-

*

/

%

++        自加1 i++操作优先级低,先执行逻辑,再加1 ++i操作优先级高,先加1,再执行逻辑

--          自减1

比较运算符

>

>=

<

<=

==      弱等于    不比较类型

===    强等于    比较

!=       弱不等于

!==     强不等于

逻辑预算符

&& and

|| or

! 非

赋值运算符

=

+=

-=

*=

/=

流程控制

if--else

if --else if--else      多条件

if (a > 5) {
console.log("a>5");
}else if (a < 5){
console.log("a < 5");
}else {
console.log("a = 5");
};

switch   切换

switch (10){           括号内必须是一个值或者是能够得到一个值的算式
    case 10:
        console.log("10")
        break         case子语句中一般都会有break,不然会一直向下运行到结束
    case 20:
        console.log("20")
        break
    default:         以上条件都不满足的情况下运行,相当于else
        console.log("unknow")
};

for循环

# 打印0--9
for (var i=0;i<10;i++) {      #  i++优先级低,会先执行逻辑,再加1
console.log(i);
}

# 循环数组
方法一:
var l1 = [11,22,33,44,55]
for (var i in l1) {
console.log(i,l1[i]);            i是索引,通过索引把每个元素再打印出来
};

方法二:
for (var i=0;i<l1.length;i++){            
console.log(i,l1[i]);
};

while 循环

# 打印0--9
var i = 0;
while (i < 10) {
console.log(i);
i++;
};

三元运算

var a = 1;
var b = 2;
var c = a > b ? a : b       如果a>b,返回a,否则返回b

 函数

普通函数

function f2(a,b) {          定义函数,a,b为形参
console.log(a,b);
};
f2(1,2)                     调用函数,给a,b传参

function sum(a,b) {
return a+b;                 返回值  在js中,返回值只有一个,默认返回最后一个值,可以以数组的形式返回多个值
};
sum(1,2)

匿名函数

var sum = function(a, b){
return a + b;
};
sum(1,2)

自执行函数

(function(a,b) {            不需要函数名,将函数整体放在括号里
return a + b;
})(1,2);                    在最后加括号,如果需要传参,将参数写在括号内

全局变量和局部变量

在函数内声明的变量就是局部变量,只能在函数内部访问 在函数运行结束后删除

在函数外声明的变量就是全局变量,网页上所有函数都能访问 在页面关闭后删除

作用域

先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层

1.
var city = "BeiJing";
function f() {
  var city = "ShangHai";
  function inner(){
    var city = "ShenZhen";
    console.log(city);
  }
  inner();
}

f();                    #ShenZhen


2.
var city = 'beijing';
function j() {
console.log(city);
}
function f() {
    var city = 'shanghai';
    return j;
}
var ret = f();
ret();                 #beijing



3.
var city = "BeiJing";
function f(){
    var city = "ShangHai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret = f();
ret();               #ShangHai

对象

创建对象

var person = new Object();     创建一个person的自定义对象  类似字典
person.name = 'alex';          给对象封装属性 
person.age = 18; 

面向对象

构造函数，命名的首字母要大写，实例化的时候使用new关键字进行实例化

function Person(name){
    this.name=name
}
Person.prototype.func1 = function(){      使用prototype添加方法
    console.log(this.name,'爱编程！')
}
var p1 = new Person('alex');              实例化对象  使用new  传参给name
p1.func1();                               方法和属性只能通过对象来调用，不能使用类名来调用

map

类似于对象,也是键值对的集合,'键'可以是各种类型的值

var m = new Map();
var o = {p: "Hello World"}

m.set(o, "content"}               o作为键,m作为值
m.get(o)                          取值
m.has(o)                          #true  判断有没有
m.delete(o)                       #true  删除键值对
m.has(o)                          #false  此时再判断会返回false

Date对象

var d1 = new Date();               # 获取当前时间
console.log(d1.toLocaleString());  # 打印当前时间日期的字符串形式

var d2 = new Date("2004/3/20 11:12");   #设置特定时间
console.log(d2.toLocaleString());

Date对象方法:
var d = new Date(); 
getDate()                 获取日
getDay ()                 获取星期 ，数字表示（0-6），周日数字是0
getMonth ()               获取月（0-11,0表示1月,依次类推）
getFullYear ()            获取完整年份
getHours ()               获取小时
getMinutes ()             获取分钟
getSeconds ()             获取秒
getMilliseconds ()        获取毫秒
getTime ()                返回累计毫秒数,时间戳

JSON对象

var str1 = '{"name": "chao", "age": 18}';    定义字符串
var obj1 = {"name": "chao", "age": 18};      定义对象
var obj = JSON.parse(str1);                  将字符串转换成对象
var str = JSON.stringify(obj1);              将对象转换成字符串

RegExp对象   正则

创建正则对象
方式1:
参数1 正则表达式(不能有空格)
参数2 匹配模式：常用g(全局匹配)和i(忽略大小写)
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");  规定用户名以字母开头,以字母,数字,下划线组成,且总长度在6--12位之间
reg1.test('ac2345');     # true

方式2:以//包裹条件
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/; 
reg2.test('bder34');     # true
注意:如果你直接写一个reg2.test()，test里面啥也不传,默认传的是一个undefined,会返回一个true

var s2 = 'hello world';
s2.match(/o/g);         # ["o", "o"]    全局匹配s2中的o元素
s2.search(/h/g);        # 0   匹配h的索引,找到第一个元素就返回
s2.replace(/o/g, "s");  # "hells wsrld"    将所有的o替换为s

Math对象

不需要new来创建对象,直接使用.的方法

方法:
Math.abs(x)   返回数的绝对值
exp(x)        返回 e 的指数
floor(x)      小数部分进行直接舍去
log(x)        返回数的自然对数（底为e）
max(x,y)      返回 x 和 y 中的最高值
min(x,y)      返回 x 和 y 中的最低值
pow(x,y)      返回 x 的 y 次幂
random()      返回 0 ~ 1 之间的随机数
round(x)      把数四舍五入为最接近的整数
sin(x)        返回数的正弦
sqrt(x)       返回数的平方根
tan(x)        返回角的正切