目录
JS简介
全称JavaScript 是一种具有函数优先的轻量级、解释型或即时编译的编程语言 它是一门前端工程师的编程语言
JS基础
1.注释语法
1. 注释语法
// 单行注释
/*多行注释*/
2.引入JS的做种方式
- head内script标签内编写
- head内script标签src属性引入外部js资源
- body内最底部通过script标签src标签属性引入外部就是资源(最常用)
PS:注意页面的加载是从上往下的 所以操作标签js代码一定要等待标签加载完毕在执行才可以正产运行
3.结束符号
分号(很多时候不写也没问题)
变量与常量
- pycharm创建文件或者html文件(适合编写较为复杂的js代码)
- 浏览器提供编写js代码的环境
JavaScript的变量可以使用_、数字、字母、$组成 不能以数字开头
在js中声明变量需要使用关键字
var
var name = 'jason';
let
let name = 'tony';
ps:let是ECMA6新语法 可以在局部定义变量不影响全局
在js中声明常量也需要使用关键字
const
const pi = 3.14;
基本数据类型
在js中查看数据类型的方式 typeof
1.数字类型(Number)
在js中整型与浮点型不分家 都叫Number
NaN也属于数值类型 意思是:不是一个数字(Not A Number)
2.字符类型(string)
单引号 'jason'
双引号 "jason"
模板字符串 `jason`
let name1 = 'jason'
let age1 = 18
underfined
let desc = `my name is ${name1} my age is ${age1}`
console.log(desc); // 得到my name is jason my age is 18
1.字符串拼接推荐使用加号
var a = 'hello';
var b = 'world';
var c = a + b;
consle.log(c); // 得到hellworld
2.常见内置方法
方法 | 说明 |
---|---|
.toLowerCase() | 小写 |
.toUpperCase() | 大写 |
.split(delimiter,limit) | 分割 |
.length | 返回长度 |
.trim() | 移除空白 |
.trimLeft() | 移除左边的空白 |
.trimRight() | 移除右边的空白 |
.charAt(n) | 返回第n个字符 |
.concat(value,...) | 拼接 |
.indexOf(substring,start) | 子序列位置 |
.substring(from,to) | 根据索引获取子序列 |
.slice(start,end) | 切片 |
3.布尔类型(Boolean)
js里面的布尔值与Python不同
js是纯小写 而python中是首字母大写
4.null和underfined
null表示值是空的 一般在需要指定或清空一个变量是才会使用 如 name = null;
underfined表示当声明一个变量但未初始化 该变量的默认值是underfined 且函数无明确的返回值时 返回的也是undefined
5.对象(object)
对象之数组(Array)>>>: 类似于python中的列表
let l1 = []
对象之自定义对象(object)>>>: 类似于python的字典
let d1 = {'name':'jason',}
let d2 = new.object();
运算符
1. 算术运算符
+ - * / ++(自增1) --(自减1)
var x=10;
var res1=x++; 加号在后面 先赋值后自增
var res2=++x; 加号在前面 先自增后赋值
2. 比较运算符
!=(值不等 弱) ==(值相等 弱) ===(值相等 强) !==(值不等 强)
如:
A 1 == "1" // true 弱相等
B 1 === "1" // false 强等于
A 上面这张情况出现的原因在于JS是一门弱类型语言(会自动转换数据类型),所以当你用两个等号进行比较时,JS内部会自动先将
B 数值类型的1转换成字符串类型的1再进行比较,所以我们以后写JS涉及到比较时尽量用三等号来强制限制类型,防止判断错误
3. 逻辑运算符
&&(与) ||(或) !(非)
流程控制
if判断
- 单if分支
if (条件){
条件成立的子代码
}
- if...else分支
if(条件){
条件成立执行的代码
}else{
条件不成立执行的代码
}
如:
var a = 10;
if (a > 5){
console.log("yes");
}else {
console.log("no");
}
- if...else if...else分支
if(条件1){
条件1成立执行的代码
}else if(条件2){
条件1不成立条件2执行的代码
}
else{
条件1和条件2都不成立执行的代码
}
如:
var a = 10;
if (a > 5){
console.log("a > 5");
}else if (a < 5) {
console.log("a < 5");
}else {
console.log("a = 5");
}
- 如果分支结构中else if很多还可以考虑使用switch语法
switch(条件){
case 条件1:
条件1成立执行的代码;
break; //如果没有break会基于某个case一直执行下去
case 条件2:
条件2成立执行的代码;
break;
case 条件3:
条件3成立执行的代码;
break;
case 条件4:
条件4成立执行的代码;
break;
default:
条件都不满足执行的代码
}
如:
var day = new Date().getDay();
switch (day) {
case 0:
console.log("Sunday");
break;
case 1:
console.log("Monday");
break;
default:
console.log("...")
}
for循环
for(起始条件;循环条件;条件处理){
循环体代码
}
for(let i=0;i<10;i++){
consle.log(i)
}
let res = {'name':'jason','age':18}
for(let k in dd){
conlse.log(k)
}
while循环
while(循环条件){
循环体代码
}
var i = 0;
while (i<10) {
console.log(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;
函数
- JS中函数的形参与实个数可以不对应 传少了就是underfined 传多了不用
- 函数体点中有一个关键字arguments用来接收所有的实参
- 函数的返回值如果有多个需要自己处理成一个整体
function 函数名(形参){
//注释
函数体代码
return 返回值
}
匿名函数
var s1 = function(a,b){
return a + b;
}
箭头函数
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;
}
内置对象
Date日期对象
var d = new Date();
//getDate() 获取日
//getDay() 获取星期
//getMonth() 获取月(0~11)
//getFulYear() 获取完整月份
//getYear() 获取年
//getHours() 获取小时
//getminutes() 获取分钟
//getSeconds() 获取秒
//getMillseconds() 获取毫秒
//getTime() 返回累计毫秒数(从1970/1/1午夜)
JSON对象
let dd = {name: 'jason',age: 18}
JSON.stringify(dd) //序列化
JSON.parse //反序列化
var str1 = '{"name": "Alex", "age": 18}';
var obj1 = {"name": "Alex", "age": 18};
// JSON字符串转换成对象
var obj = JSON.parse(str1);
// 对象转换成JSON字符串
var str = JSON.stringify(obj1);
定义正则的两种方法
RegExp正则表达式对象
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
Var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;
1.全局模式的规律
lasrtIndex
2.test匹配数据不传 默认传underfined
标签:前端,JS,javascirpt,let,条件,var,js,代码
From: https://www.cnblogs.com/xiao-fu-zi/p/16952712.html