day 45 小结

------------恢复内容开始------------

目录

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 来查看光标位置

------------恢复内容结束------------

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/LZF-190903/p/11879039.html