JS第一部分--ECMAScript5.0标准语法 (JS基础语法)

一,调试语句

二,JS的引入方式

三,变量的使用

四,基本的数据类型

4.1,基本数据类型转换

4.2,字符串的常用方法

五,复杂数据类型

5.1,Array(数组)及常用方法

六,流程控制( 逻辑与&&、逻辑或|| )

七,Math内置对象的方法

八,函数的使用

九,JavaScript中对象的创建方式

十,arguments的使用:(类似于python中的*args)

十一,Date类的使用

十二,JSON的序列化反序列化

------------------------------------------------------------------------------

一,调试语句

alert('alex');
console.log(123, 'alex');

typeof 打印对象的类型
isinstance 查看对象是否为某个类型

二,JS的引入方式

内接式:[可以写在HTML任何地方,建议写在body之后]
<script type="text/javascript"> </script>

外接式:
<script type="text/javascript" src="./js/index.js"> </script>

三,变量的使用

var a=100; 或者 var a; a=100;

四,基本的数据类型

1.number 2.string 3.boolean 4.null 5.undefined

查看数据类型 typeof 100
+号表示拼接字符串,类型不同会自动转换为string

1.number里5/0=Infinity表示无限大
2.单引号或双引号表示
3.true/false
4.null为空 对象类型为object
5.未定义的变量打印结果为undefined 类型也为undefined

4.1,基本数据类型转换

1.number<-->string:隐式转换 1+'2'=='12'

string与number互相转换
a=1234;String(a)或者a.toString()
Number('1234')==1234
Number('1234abcd')==NaN
解析整数或浮点数
parseInt('1234abcd')==1234
parseFloat(3.14kjdjdkf)==3.14
js中运算符的特殊情况:
'==' 比较值相等 '5'==5 为true
'===' 比较值和数据类型

'!=' 值不相等才为真
'!==' 值和类型有一个不等就为真

'++' '--' 自增自减 b=a++ 与 b=++a不同与c语言一样

4.2,字符串的常用方法

1.字符串也有str.length属性,可以通过str[0]='a'来改变
2.charAt() 返回指定索引位置的字符
3.concat() 返回字符串的值,表示两个或者多个字符串拼接
str1.concat(str1,str2,str3)
4.replace(a,b) 将字符串a替换成字符串b
5.indexof() 查找字符下标
6.slice(a,b) 从a-b切片,顾首不顾尾
7.substring(a,b) 从a-b切片,顾首不顾尾
8.split('a',count) 字符串按照'a'来分割,count是拿第几个。
9.toLowerCase() 、toUperCase() 转大写 转小写
10.num.toFixed(2); 四舍五入保留小数点2位
11.trim();首尾去空格

五,复杂数据类型

Function  类似 def
Object   类似  dict
Array  类似  list
String  类似  string
Date  类似  time模块

5.1,Array(数组)及常用方法

初始化 var a=['1','2','3']; 或
var a=new Array();a[0]='1';a[1]='2';a[2]='3';

知识网站:百度搜索"开发者网络"第一个链接,搜索框输入"array"查看文档
数组常用方法:

补:splice(index,len,[item]) 注释:该方法会改变原始数组。

splice有3个参数,它也可以用来替换/删除/添加数组内某一个或者几个值

index:数组开始下标 len: 替换/删除的长度 item:替换的值,删除操作的话 item为空


1.数组的合并
var a1=['1','2','3'];
var a2=['a','b','c'];
var new = a1.concat(a2)
new == ['1','2','3','a','b','c'];
2.数组转换为字符串
var a1=[1, 2, 37];
var b1=a1.toString();
b1==['1,2,37']
3.数组用指定的字符串连接,跟python的join一样
var a1=[1, 2, 37];
var b1=a1.join('|')
b1==['1|2|37']
4.查找元素下标(正向查找,反向查找)
var a1=[1, 2, 37, 45, 37, 22];
var index=a1.indexOf(37); // 2 正向查找
var index1=a1.lastIndexOf(37); //4 反向查找
找不到输出-1
5.数组的反转
var a1=['1','2','3'];
var r1=a1.reverse(); //['3','2','1']
会对原先的数组也进行反转 a1==['3','2','1']
两者是同一个对象的引用
6.数组的排序(按照26个英文字母排序)
var names=['b','c','a','f'];
var sot=names.sort(); // ['a','b','c','f']
7.移除第一个元素
var a1=[1,2,3,4]
var first=names.shift() //移除第一个元素,返回第一个元素
8.向数组开头添加一个或多个元素并返回新的长度
var a1=[1,2,3,4]
var last=a1.unshift('abc');
a1==['abc',1,2,3,4] last==5
9.向数组尾部添加一个或多个元素并返回新的长度
var a1=[1,2,3,4]
var last=a1.push('abc');
a1==[1,2,3,4,'abc'] last==5

10.从数组末尾删除一个元素,并返回被删除的元素值
var a1=[1,2,3,4]
var last=a1.pop();
a1==[1,2,3] last==4

六,流程控制( 逻辑与&&、逻辑或|| )

if(age>18){
  console.log('可以去会所了');
}

------------------

if(true){
  console.log('a');
}else if(false){
  console.log('b');
}else{
  console.log('c');
}

--------------------
var n=0;
while(n<10){
  console.log(n);
  ++n;
}

---------------------

for(var i=0;i<10;i++){
  console.log(i);
}

----------------------

for(var i=0;i<array.length;i++){
console.log(i; array[i]);
}
------------------------------
document.write('*'); //向页面上写入内容<body>标签里面
所有变量都挂到window上了
在console里面输入变量,可以直接联想出来
--------------------------------------

七,Math内置对象的方法

Math.ceil() //向上取整,分页时算页数可以用:例如Math.ceil(1.234)=2
Math.floor() //向下取整,例如Math.floor(1.234)=1
Math.max(2,5) //求两个数的最大值:5
Math.min(2,5) //求两个数的最小值:2
Math.random(); //取[0,1)之间的随机数
随机数案例:
[min,max)之间的随机数:min+Math.random()*(max-min);

八,函数的使用

1.普通函数
function add(x,y){
  return x+y;
}

alert(add(1,2));

2.匿名函数
var add = function(x,y){
  return x+y;
}

add(1,2);

九,JavaScript中对象的创建方式

创建对象方式一:使用Object或对象字面量创建对象(适用于只创建一个对象)
var person = new Object()
person.name='alex';
person.age=20
console.log(person);
对象字面量赋值和赋方法:注意与字典不同var person2={'name':'wu',  'age':20,  'fav':'fav'};
var person2={
  name:'wu',
  age:20
  fav:fav
}
var fav=function(){
  alert(this.name); //指当前对象
}
创建对象方式二:工厂模式创建对象
function createPerson(name,age){
  var o = new Object();
  o.name = name;
  o.age = age;
  return o;
}
var person1 = createPerson('alex',20);
var person2 = createPerson('alex',20);
var person3 = createPerson('alex',20);

person1 instanceof Person == false
person1 instanceof Object == true
创建对象方式三:构造函数模式创建对象,使用new关键字创建对象
构造函数与普通函数的区别是首字母大写, 主要是this和new关键字
(希望创建的对象通过instanceof方法得到的是具体的对象而不是抽象类Object)
function Person(name,age){
  this.name=name;
  this.age=age;
  this.alertName=function(){
    alert(this.name);
  }
}
var person1=new Person('alex',20);

function Fruit(name,age){
  this.name=name;
  this.age=age;
  this.alertName=function(){
    alert(this.name);
  }
}
var fruit1=new Fruit('apple',12);
person1 instanceof Person == true
person1 instanceof Object == true
fruit1 instanceof Fruit == true
fruit1 instanceof Object == true
创建对象方式四:原型模式创建对象
(为了解决对象之间有共同的方法而出现的,重复的方法只写一次)
prototype它是当前类的父类
function Person(name,age){
  this.name=name;
  this.age=age;
}
Person.prototype.alertName=function(){
  alert(this.name); //this是调用这个方法的对象
};
var p1 = new Person('alex',20);
var p2 = new Person('alex2',30

p1.alertName();
p2.alertName();

不同的对象调用的是同一个方法(这个方法是继承来的)

十,arguments的使用:(类似于python中的*args)

function add(){
//arguments是伪数组,只有length和索引,可以遍历,类似于python中的*args
console.log(arguments); //输出:'alex','wu'
}
add('alex','wu')


十一,Date类的使用

var d1 = new Date(); //Wed Sep 05 2018 10:41:39 GMT+08
getDate() 返回月份中的第几天(1-31)
Date() 返回当天日期和时间
getMonth() 返回月份(0-11)
getFullYear() 返回年份(四位数)
getDay() 返回星期几(0-6)
getHours() 返回小时(0-23)
getMinutes() 返回分钟(0-59)
getSeconds() 返回秒(0-59)
console.log(d1.toLocalString()); 返回本地时间 2018/9/5 上午10:42:09

十二,JSON的序列化反序列化

一个对象:
var js = {
  "name":"alex",
  "pwd":"123"
}
很多对象数组
var jsv = [{"name":"alex","pwd":"123"},{"name":"wu","pwd":"455"}]


遍历json对象:
for(var k in js){
  console.log(k+','+js[k]);
}
遍历json数组:
for(var i in jsv){
  console.log(i+','+jsv[i].name+','+jsv[i].pwd)
}
序列化:
var jsonstr = JSON.stringify(js)

反序列化:
var json_obj = JSON.parse(jsonstr);