------------恢复内容开始------------
js的引入方式
1.内联式: script标签内部直接写
<script>
alert('页面加载中!')
</script>
2.外联式: 通过script标签src书写 引入外部js文件
<script src="js/my.js">
/*不要再此写JS代码,原因是用来引入外部js文件的script标签,标签内部书写的js代码不起作用*/
</script>
3.行间式: 写在全局属性中
<div onclick="alert('点击我完成页面交互!')">
点我
</div>
注释:
//单行注释
/*
多行注释
*/
js里面的变量
在js中声明变量需要使用关键字
var 声明的是全局有效
let 可以只在局部有效(ES6新语法)
var name = 'json'
let name = 'json'
js中变量的命名规范
1.数字 字母 下划线 $
2.不能用关键字作为变量名
3.推荐使用驼峰体命名
python推荐使用下划线(c++)
user_name
js推荐使用驼峰体(前端)
UserName
js代码默认是以分号作为结束符(你不写通常情况下没有问题)
注意: 变量名是区分大小写的
const 用来声明常量, 一旦声明, 其值就不能改变
const PI = 3.1415926
PI = 3
//Uncaught TypeError: Assignment to constant variable.
JavaScript 拥有动态类型
var x; //此时x是undefined
var x = 1; //此时x是数字
var x = "jason"; //此时x是字符串
typeof(x); //string
typeof(x) 用来查看js数据类型
console.log(x) 用来打印
数值类型
JavaScript不区分整型和浮点型 就一种数字类型
var a = 12.34;
var b = 20;
var c = 123e5; //12300000
var d = 123e-5; //0.00123
还有一种NaN 表示不是一个数字(Not a Number)
parseInt("123"); //123
parseInt("ABC"); //返回NaN,NaN属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。
parseFloat("123.456"); //123.456
字符串
var a = "hello";
var b = "word";
var c = a + b;
console.log(c); //helloword
常用方法:
| 方法 | 说明 |
|---|---|
| .length | 返回长度 |
| .trim() | 移除空白 |
| .trimLeft() | 移除左边的空白 |
| .trimRight() | 移除右边空白 |
| .charAt(n) | 返回第n个字符 |
| .concat(value,...) | 拼接 |
| .indexOf(substring,start) | 子序列位置 |
| .substring(from,to) | 根据索引获取子序列 |
| .slice(start,end) | 切片 |
| .toLowerCase() | 小写 |
| .toUpperCase() | 大写 |
| .split(delimiter,limit) | 分割 |
拼接字符串一般用"+"
布尔值
区别于Python，true和false都是小写。
var a = true;
var b = false;
""(空字符串)、0、null、undefined、NaN都是false。
null表示值是空，一般在需要指定或清空一个变量时才会使用，如 name=null;
undefined表示当声明一个变量但未初始化时，该变量的默认值是undefined。还有就是函数无明 确的返回值时，返回的也是undefined。
null表示变量的值是空(null可以手动清空一个变量的值，使得该变量变为object类型，值为null)， undefined则表示只声明了变量，但还没有赋值。
数组
python中往类表中添加数据的方法
1.append 尾部追加
l = [1,2]
l.append([1,2,33,4])
l = [1,2,[1,2,33,4]]
2.insert 按照索引插入
3.extend 扩展列表
内部其实就是for循环+append
l = [1,2]
l.extend([1,2,3,4])
l = [1,2,1,2,3,4]
可以使用以下方式遍历数组中的元素：
var a = [10, 20, 30, 40];
for (var i=0;i<a.length;i++) {
console.log(i);
}
| 方法 | 说明 |
|---|---|
| .length | 数组的大小 |
| .push(ele) | 尾部追加元素 |
| .pop() | 获取尾部的元素 |
| .unshift(ele) | 头部插入元素 |
| .shift() | 头部移除元素 |
| .slice(start, end) | 切片 |
| .reverse() | 反转 |
| .join(seq) | 将数组元素连接成字符串 |
| .concat(val, ...) | 连接数组 |
| .sort() | 排序 |
| .forEach() | 将数组的每个元素传递给回调函数 |
| .splice() | 删除元素，并向数组添加新元素。 |
| .map() | 返回一个数组元素调用函数处理后的值的新数组 |
运算符
算数运算符
+ - * / % ++ --
var x=10;
var res1=x++;
var res2=++x;
res1;
10
res2;
12
// 其中x++表示先将x赋值再自增1,++x表示先自增1再赋值
比较运算符
> >= < <= != == === !==
由于js是弱类型语言,所以存在强制类型转换
1 == “1” // true 弱等于
1 === "1" // false 强等于
//上面这张情况出现的原因在于JS是一门弱类型语言(会自动转换数据类型)，所以当你用两个等号进行比较时，JS内部会自动先将
//数值类型的1转换成字符串类型的1再进行比较，所以我们以后写JS涉及到比较时尽量用三等号来强制限制类型，防止判断错误
逻辑运算符对比:
| Python | Javascript |
|---|---|
| and | && |
| or | || |
| not | ! |
流程控制
if-else if-else
()中写条件,{}中写函数体
var a = 10;
if (a > 5){
console.log("a > 5");
}else if (a < 5) {
console.log("a < 5");
}else {
console.log("a = 5");
}
switch
case后只能加整型和字符串类型
冒号,分号和break不能省略,
代码运行会找到匹配的case值,然后向下执行,所以一定要有break
var day = 2;
switch (day) {
case 0:
console.log("Sunday");
break;
case 1:
console.log("Monday");
break;
default:
console.log("...")
}
for
()中写条件,{}中写函数体
for (var i=0;i<10;i++) {
console.log(i);
}
while
()中写条件,{}中写函数体
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;三元运算可以嵌套使用；
var a=10,b=20;
var x=a>b ?a:(b=="20")?a:b;
x
10
定义函数
python后端定义函数
def
js前端定义函数
function
普通函数
function f1 (){
console.log("jason");
}
带参数函数
function f2(a,b){
console.log(arguments);
console.log(arguments.length);
console.log(a,b);
}
带返回值的函数
function sum(a,b){
return a + b;
}
//匿名函数
var sum = function(a,b){
return a + b;
}
sum(1,2);
立即执行函数 书写立即执行的函数，首先先写两个括号()()这样防止书写混乱
(function(a, b){
return a + b;
})(1, 2);
ES6中允许使用' => ' 定义函数
//箭头函数
var f = v => v;
// 等同于
var f = function(v){
return v;
}
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2){
return num1 + num2; //这里的return只能返回一个值，如果想返回多个值需要自己手动给他们包一个数组或对象中
}
函数中的arguments参数
function add(a,b){
console.log(a+b);
console.log(arguments.length); console.log(arguments[0]);
//arguments相当于将出传入的参数全部包含，这里取得就是第一个元素1
}
函数的全局变量和局部变量
在JavaScript函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它（该变 量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
全局变量
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
变量生存周期
JavaScript变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
作用域
首先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层。与python作用域关系 查找一模一样！
js对象
JavaScript 中的所有事物都是对象：字符串、数值、数组、函数...此外，JavaScript 允许自定义 对象。
JavaScript 提供多个内建对象，比如 String、Date、Array 等等。
对象只是带有属性和方法的特殊数据类型。
在定义对象的时候 关键字是 new
python后端 前端js
json.dumps JSON.stringify
json.loads JSON.parse
Date对象
//创建不指定参数
var d1 = new Date();
console.log(d1.toLocaleString());
//参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12");
console.log(d3.toLocaleString());
//参数为毫秒数
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());
//参数为年月日小时分钟秒毫秒
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString()); //毫秒并不直接显示
RegExp对象
Reg 正则
Asyn 异步
// 定义正则表达式两种方式
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/; 建议使用
//注意: 不能随即添加空格
全局匹配
var s1 = 'egondsb dsb dsb';
s1.match(/s/)
s1.match(/s/g)
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/g //当使用/g的时候,光标会停留在上次匹配到的字符之后
reg2.test('egondsb');
reg2.test('egondsb');
reg2.lastIndex;
//第二个注意事项，全局匹配时有一个lastIndex属性
校验时不传参数
var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/
reg2.test();
reg2.test(undefined);
var reg3 = /undefined/;
reg3.test();
注意: 不使用" /g ",每次光标刷新至文本开头
可使用 `reg2.lastIndex 来查看光标位置
------------恢复内容结束------------