您的位置: 首页  >  IT文章  >  JavaScript从无到有(一天完成)

JavaScript从无到有(一天完成)

分类: IT文章 • 2022-02-23 14:19:37

JavaScript从无到有(一天完成)

JavaScipt概念说明

what,how

脚本轻量级编程语言

应用场景

网页特效,服务端开发(Node.js),命令行工具(Node.js) 桌面程序(Electron) 游戏开发 ,app 无所不能...

和其他的两个兄弟区别

  1. HTML：提供网页的结构，提供网页中的内容

  1. CSS: 用来美化网页

  1. JavaScript: 可以用来控制网页内容，给网页增加动态的效果

规范

书写位置

行内(<input type="button" value="按钮" onclick="alert('hello world')"> ),内部,外部

内部 script标签内

外部

<head>
  <script>
    alert('Hello World!');
  </script>
</head>

定义

var 声明变量 let声明变量,只在let命令所在的代码块有效 常量const声明不能改变和python约定俗成的不一样 函数function 创建对象,var person=new Object()

注意

变量名是区分大小写的 推荐使用驼峰体命名规则 ,首字母为小写,第二个单词首字母大写便于区分 保留字不能用作变量名

数据类型

简单数据类型: 字符串String 数字类型Number parseInt判断是不是整型数字 如果是数字就返回数字,有小数四舍五入进入整数,parseFloat

复杂数据类型Object

获取变量的类型typeof

简单数据类型

数字类型Number

var a=10e-5 或者var a=10e5为小数点往后移动5位,往前移动5位 parseInt('') 判断字符串是不是整形数字,如果是 就返回数字 不是数字返回NaN表示不是数字,

是浮点型数字返回整数数字

parseInt('')

反之亦然

字符串String

增 拼接 .concat(value)拼接

删 .trim()移除空白,trimrignt,left

改

.toLowerCase()小写 up..大写 切割字符串, .split('i',length)

查 长度.length

.substr(from,to)子序列,顾头不顾尾 .slice(start,end)切片 .charAt(i)返回第i字符

.indexOf(sub,start) 返回子序列索引,

特点

//slice()的特点相当于python中的切片,
//substr()特点,start >end 交换他们位置,
//参数为-数或者不是数字则会被0替换

布尔Boolean

False

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

uderfined声明了变量但是没有赋值相当于光秃秃的抽纸器,但是它只是声明它是抽纸器

null 变量的值是空的,相当于抽纸有纸筒的抽纸器

True

数组

数组

数组对象的作用是：使用单独的变量名来存储一系列的值。类似于Python中的列表。

常用方法：

方法 说明
.length 数组的大小
.push(ele) 尾部追加元素
.pop() 获取尾部的元素
.unshift(ele) 头部插入元素
.shift() 头部移除元素
.slice(start, end) 切片
.reverse() 反转
.join(seq) 将数组元素连接成字符串
.concat(val, ...) 连接数组
.sort() 排序
.forEach() 将数组的每个元素传递给回调函数
.splice() 删除元素，并向数组添加新元素。
.map() 返回一个数组元素调用函数处理后的值的新数组

特别说明

forEach(function(Value,index,arr)) value 为必选,当前的元素, 索引, 数组 splice(index,howmany,item.....) 从索引位置开始删除多少个为必选,item可选,添加新元素 map() map(function(Value,index,arr)) value必选,索引和数组可不选

运算符

算数运算符

+,-,*,/

++自增

x=++y x=y++

--自减

... 自增符号在前面表示先计算后赋值,相当于先给钱后吃饭,反之亦然

赋值运算符

与python一样...

字符串运算符

+ +=

比较运算符

!=和!==(值不相等,类型也不相等,)

===类型,值也是一样的

逻辑运算符

&&和 ||或 !非 假假为True

流程控制

分支结构

根据不同的情况执行对应的代码

if(...)){...}else{...} if(...){...}else if (...){...} else{...}

总结elif 变成了else if

(条件){执行语句}

三元 var c=a>b? a:b 定一个c的变量 a大于b吗? 大于的结果: 不大于的结果

循环结构

重复 switch 常量 每一个语句后面加break 不然的话 就继续运行下一个,抓紧抬走,default:如果都不对的话就走到这,

后面跟着对象()

fo循环

4步骤完成 for (初始化表达式1;条件表达式2;自增表达式3){循环体4}

while 定义变量; while(变量条件){循环体;变量自增;}

函数

无名函数

var f=function (){ console.log(456)}

f()调用

有名函数

function a(){} a()调用

es6

使用=>定义函数

var sum = (num1, num2) => num1 + num2;

// 等同于

var sum = function(num1, num2){

　　 return num1 + num2; //这里的return只能返回一个值，如果想返回多个值需要自己手动给他们包一个数组或对象中

}

立马执行函数

先写两个括号防止混乱,

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

闭包函数

与python作用域的关系一模一样

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

arguments

JavaScript参数可以不写,

function add(a,b){
　　 console.log(a+b);
　　 console.log(arguments.length);
　　　console.log(arguments[0]);//arguments相当于将出传入的参数全部包含，这里取得就是第一个元素1
}
add(1,2)

输出 3

2

1

当函数调用的前一瞬间，会先形成一个激活对象：Avtive Object（AO），并会分析以下3个方面：

1:函数参数，如果有，则将此参数赋值给AO，且值为undefined。如果没有，则不做任何操作。 2:函数局部变量，如果AO上有同名的值，则不做任何操作。如果没有，则将此变量赋值给AO，并且值为undefined。 3:函数声明，如果AO上有，则会将AO上的对象覆盖。如果没有，则不做任何操作。

object

本质就是兼职对的集合hash结构,用字符串作为键.

var a={"name":"ajax"}

遍历对象内容

var a = {"name": "Alex", "age": 18};

for (var i in a){console.log(i,a[i])}

python: for i in a: print(i,a[i]])

获取时间对象

Date对象方法

var d = new Date(); 
//getDate() 获取日
//getDay () 获取星期
//getMonth () 获取月（0-11）
 //getFullYear () 获取完整年份
//getYear () 获取年
//getHours () 获取小时
//getMinutes () 获取分钟
//getSeconds () 获取秒
//getMilliseconds () 获取毫秒
//getTime () 返回累计毫秒数(从1970/1/1午夜)

编写代码,将当前日期按照 2011/3/20 11:12 星期三 格式输出

相关推荐