JavaScript(一)
❣️javaScript编程语言
- JS简介
- 变量与常量
- 基本数据类型
- 运算符
- 流程控制
- 函数
- 内置对象
❣️JS简介
❤️🔥JavaScript(简称“JS”) 是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名,但是它也被用到了很多非浏览器环境中,JavaScript 基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式、声明式、函数式编程范式。
❤️🔥作用:
1.嵌入动态文本于HTML页面
2.对应浏览器时间做出响应
3.读写HTML元素
4.在数据被提交到服务器之前验证数据。
5.检测访客的浏览器信息。 控制cookies,包括创建和修改等。
6.基于Node.js技术进行服务器端编程。
❣️JS基础
❤️🔥1.注释语法
// 单行注释
/*多行注释*/
❤️🔥2.引入js的多种方法
1.head内scrip标签内编写
2.head内script标签src属性引入外部的js资源
3.body内的地步通过script标签src属性引入外部js资源(常用)
PS:注意页面的下载是从上往下的,所以操作表搜前js代码一定要等待标签加载完毕之后在执行才可以正常运行
❤️🔥3.结束符号
;(分号可写可不写)
❤️🔥4.编写代码的工具:
1.pycharm 创建js文件或者HTML文件(适合编写复杂的js代码)
2.浏览器提供的编写js代码的环境变量
❤️🔥5.小知识点(js特殊的值)
undefined :
未定义,所有js变量未赋于初始值的时候,默认值都是undefined。(从未拥有过0
NAN(Not a Number):
表示值为空(有过)
PS:简单理解就是:undefined 是没有定义的,null 是定义了但是为空。
❤️🔥6.判断数据类型的方法
判断数据类型的方法一般可以通过四种常用方法:typeof、instanceof、constructor、Object.prototype.toString.call();
1.typeof:(可以对基本类型(包括function)做出准确的判断,但对于引用类型,用它就有点力不从心了),typeof 返回一个表示数据类型的字符串,返回结果包括:number、boolean、string、object、undefined、function、Symbol6种数据类型。
2.instanceof(判断是否是某个类的实例)
3.constructor:查看对象对应的构造函数
constructor 在其对应对象的原型下面,是自动生成的。当我们写一个构造函数的时候,程序会自动添加:构造函数名.prototype.constructor = 构造函数名
4.Object.prototype.toString(可以说不管是什么类型,它都可以立即判断出)
toString是Object原型对象上的一个方法,该方法默认返回其调用者的具体类型,更严格的讲,是 toString运行时this指向的对象类型, 返回的类型格式为[object xxx],xxx是具体的数据类型
基本上所有对象的类型都可以通过这个方法获取到
❣️变量与常量
什么是变量呢?
变量就是可以用来存放某些值的内存的命名。
在js中变量是需要声明以后才能使用的,两个关键字:
var
var name = 'andy';
let
let name ='小明';
PS:let是ECMA6的新语法,可以在局部定义变量不影响全局
在js中声明常量也需要使用关键字、(声明了就不能改变了)
const
const pi =3.14
❣️基本数据类型
❣️数值类型
1.数值类型(number)
在js中整型和浮点型统称为‘number’
NaN也属于数值类型,意思是:不是一个数字(NOt a number)
2.字符串类型(string)
单引号 ''
双引号 " "
模板字符串 ` `(顿号)
let name='小明'
let age = 7
undefined
let desc = `名字是${name} 年龄是${age}` 格式化输出
1.字符串的拼接推荐使用 + 号
3.布尔类型(Boolean)
true 和 false
JS中的布尔值与python中的略有不同
js的判断是纯小写,python 的判断结果是首字母大写
5.对象(object)
对象之数组(Array)
let l1=[]
ps :类似于python中的列表
对象之自定义对象(Object)
let d1={'name':'小明'}
let d2= new Object();对象实例(创建空对象)
❤️🔥代码:
数值(number):
var a = 13.4
var d= 123e4; // 1230000
字符串(string):
var c = 'hello'
var b = "world"
var c= a+b ;
console.log(c); //结果:helloworld
布尔值(Boolean):
var a= true;
var b = 0; //false
数组对象(Object):
var a=[123,'kimi']
console.log(a[1]); 结果:'kimi'
forEach 循环
var l1=[11,22,33,44,55]
undefined
l1.forEach(function(value){})
undefined
l1.forEach(function(value){
console.log(value)
})
❣️数据类型常用方法:
字符串:
数组的常用方法:
❣️运算符
1.算数运算符
+ - * / % ++(自增1) --(自减1)
var x=10;
var res = x++; 表示先赋值后自增
var res2 = ++x; 表示先自增后赋值
结果:
res;
10
res2;
12
2.比较运算符
!=(值不等 弱) ==(值相等 弱) ===(强) !==(强)
PS:不会自动转换类型
3.逻辑运算
&&(与) ||(或) !(非)
❣️流程控制
1.单if分支
if (条件){
条件成立执行的代码
}
2.if...else分支
if(条件){
条件成立执行的代码
}else{
条件不成立执行的代码
}
3.if...else if...else分支
if(条件1){
条件1成立执行的代码
}else if(条件2){
条件1不成立条件2执行的代码
}
else{
条件1和2都不成立执行的代码
}
4.如果分支结构中else if很多还可以考虑使用switch语法
switch(条件){
case 条件1:
条件1成立执行的代码;
break; 如果没有break会基于某个case一直执行下去
case 条件2:
条件2成立执行的代码;
break;
case 条件3:
条件3成立执行的代码;
break;
case 条件4:
条件4成立执行的代码;
break;
default:
条件都不满足执行的代码
}
PS:switch中的case子句通常都会加break语句,否则程序会继续执行后续case中的语句。
for循环
for(起始条件;循环条件;条件处理){
循环体代码
}
for(let i=0; i<10; i++ ){
console.log(i)
}
let dd = {'name':'jason','age':18}
for(let k in dd){
console.log(k)
}
while循环
while(循环条件){
循环体代码
}
三元运算
var =1 ;
var =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
❣️函数
❣️定义函数:
function 函数名(形参){
//函数注释
函数体代码
return 返回值
}
调用:
函数名();
❣️匿名函数:
没有名字的函数
匿名函数如何使用:
1.将匿名函数赋值给一个变量,这样就可以通过变量进行调用
2.匿名函数自调用
PS:匿名函数不能通过直接调用来执行,因此可以通过匿名函数的自调用的方式来执行
var s1 = function(a,b){
return a+b;
}
s1(1,2)
ps :立即执行函数 书写立即执行的函数,首先先写两个括号()()这样防止书写混乱
❣️箭头函数
ps:如果箭头函数不需要参数或需要多个参数,就是用圆括号代表参数部分
var f = v =>v ;
、、等同于
var f= function(v){
return v;
}
var f = () => 5;
//等同于
var f = function(){return 5};
var sum = (num1, num2) => num1 + num2;
//等同于
var sum = function(num1, num2){
return num1 + num2;
}
1.JS中函数的形参与实参个数可以不对应
传少了就是undefined 传多了也不用也没有影响
2.函数体代码中有一个关键字arguments用来接受所有的实参
3.函数的返回值如果有多个需要自己处理成一个整体
❣️内置对象
var d = new Date();
//getDate() 获取日
//getDay () 获取星期
//getMonth () 获取月(0-11)
//getFullYear () 获取完整年份
//getYear () 获取年
//getHours () 获取小时
//getMinutes () 获取分钟
//getSeconds () 获取秒
//getMilliseconds () 获取毫秒
//getTime () 返回累计毫秒数(从1970/1/1午夜
❣️json对象
var str1 ={name:'kimi','age':19};
undefined
JSON.stringify(str1) //序列化
'{"name":"kimi","age":19}'
var d1=JSON.stringify(str1)
JSON.parse(d1)
{name: 'kimi', age: 19} //反序列化
正则表达式:
定义正则的两种方式:
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
var reg2 = /^[a-zA-Z][A-zA-Z 0-9]{5,11}$/;
undefined
reg1.test('jason666')
true
reg2.test('kimi999')
true
ps:第一个注意事项,正则表达式中不能有空格
var s1='tonydsb dsb dsb';
undefined
s1.match(/s/)
//['s', index: 5, input: 'tonydsb dsb dsb', groups: undefined]
s1.match(/s/g)
//(3) ['s', 's', 's']0: "s"1: "s"2: "s"length: 3[[Prototype]]: Array(0)
var reg2=/^[a-zA-z][a-zA-Z 0-9]{4,7}$/g
undefined
reg2.test('tonydsb')
true
reg2.lastIndex;
7
第二个注意事项,全局匹配时有个lastindex属性
1.全局模式的规律
lastindex
2.test匹配数据不传的话,默认传undefined
var reg2=/^[a-zA-z][a-zA-Z 0-9]{5,9}$/
undefined
reg2.test();
true
reg2.test(undefined);
true
var reg3=/undefined/;
undefined
reg3.test();
true
3.校验时可以不用传参数
❣️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) 返回角的正切。