JavaScript是世界上最流行的脚本语言
Javascript的历史
大部分浏览器支持es5代码,开发环境–线上环境,版本不一致
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
alert('hello');
</script>
</body>
</html>
外部引入
<script src="js/hello.js"></script>
//。。。
/*
*
*
*
*/
弱类型语言
var num = 1;
var name = qiumingshan;
if(2>1){
alert('true');
}
规则和c++一样,也允许嵌套
if(2>1){
if(3>2){
alert('3max');
}
if(scor>=60){
if(score>60&&score<70){
alert('及格');
if(score>=70&&score<80){
alert('良好');
if(score>=80&&score<90){
alert('优秀');
if(score>=90){
alert('非常优秀')
}
}
}
}
}else {
alert('不及格');
}
用浏览器调试F12,进入调试,
可以在控制台,来打印
console.log(score)
相当于cout<
断点
数值,文本,图形,音频,视频……
number:
js不区分小数和整数
123//整数123
123.1//浮点数123.1
1.123e3//科学计数法
-99//负数
NaN//not a number
Infinity//表示无限大
字符串
‘abc’ “abc”
字符串拼接:
let name = "qinjiang";
let age = 3;
let msg = 'hello,${name}';
字符串的长度
name.length
字符串的可变性,不可变,和Java,c++一样
大小写转换:
//这里是方法,不是属性了
name.toUpperCase()
name.toLowerCase()
字符串截取:
[)
name.substring(1)//从第一个到最后一个
name.substring(1,3)//[1……3)
布尔值
true,false
逻辑运算
&&
||
!
与c++或Java一样
比较运算符
=
==//等于,类型不一样,值一样,也会判断为true
====//绝对等于(类型一样,值一样,结果为true
NaN === NaN,这个与所有数字都不相等,包括它自己
null和undefined
null空
undefined未定义
数组
JS中可以是一系列不同类型的对象
var arr = [1,2,3,'hello',null,true]
arr.length
排序sort
arr.sort()
元素反转
arr.reverse()
多维数组
arr = [[1,2],[3,4],[5,6]];
arr[1][1];
4
对象
对象是大括号,数组是中括号
var person = {
name: "jj",
age: 18,
work: ['student','cs']
}
每个属性之间使用逗号,最后一个不需要添加逗号
键值对描述属性xxx :xxx,多个属性之间使用都逗号隔开,最后一个属性不加逗号
person.name = “qin”
delete person.name
person.hhh = “hahaha”;
'age' in person //判断age是否在person中
Map和Set
ES6才出来
let map = new Map([['tom','99'],['jake','100']]);
let name = map.get('tom');//通过get获得value
console.log(name);
无序不重复的集合
var set = new Set([3,1,1,1,1];//set可以去除重复
set.delete(1);
console.log(set.has(3));
var set = Set([6,7,8]);
for(let x of set){ //循环
console.log(x);
}
function abs(x){
if(x>=0){
return x;
}else{
return -x;
}
}
当 JavaScript 到达 return 语句,函数将停止执行。
如果函数被某条语句调用,JavaScript 将在调用语句之后“返回”执行代码。
函数通常会计算出返回值。这个返回值会返回给调用者:
var x = myFunction(7, 8); // 调用函数,返回值被赋值给 x
function myFunction(a, b) {
return a * b; // 函数返回 a 和 b 的乘积
}
在 JavaScript 函数中声明的变量,会成为函数的局部变量。
局部变量只能在函数内访问。
ES6 新增了let命令,用来声明局部变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效,而且有暂时性死区的约束。
题目1:
var a = 99; // 全局变量a
f(); // f是函数,虽然定义在调用的后面,但是函数声明会提升到作用域的顶部。
console.log(a); // a=>99, 此时是全局变量的a
function f() {
console.log(a); // 当前的a变量是下面变量a声明提升后,默认值undefined
var a = 10;
console.log(a); // a => 10
}
// 输出结果:
undefined
10
99
ES6可以用let定义块级作用域变量
在ES6之前,我们都是用var来声明变量,而且JS只有函数作用域和全局作用域,没有块级作用域,所以{}限定不了var声明变量的访问范围。
ES6新增的let,可以声明块级作用域的变量。
{
let i = 9; // i变量只在 花括号内有效!!!
}
console.log(i); // Uncaught ReferenceError: i is not defined
方法
把函数放到对象的里面,对象只有俩个东西: 属性和方法
var person = {
name: 'ymm',
birthday: 2020,
//方法
age: function(){
var now = new Date().getFullYear();
return now - this.birthday;
}
}
person.name;//属性
person.age();//方法一定要带()
//data对象
var now = new Date();
now.getHours();
这里要说一个时间戳
电脑本地的时间可以修改,但是时间戳全世界都是统一的,
1970 .1. 1 0:00:00毫秒数
now.getTime();
//时间戳转换为时间,,1651157723736
console.log(new Date(1651157723736));
早期,所有数据传输习惯使用XML文件!
在JS中一切代码皆为对象,然后js支持的类型都可以用JSON来表示
格式:
JSON字符串JS对象的转化
var person = {
name: "ymm",
age: 18,
sex: 'man'
}
//对象转换为JSON字符串
var jsonPerson = JSON.stringify(person);
//JSON字符串转换为对象
var obj = JSON.parse('{"name":"ymm","age":3,"sex":"man"}');
类:模板
对象:具体的实例
可以说类是对象的抽象,对象是类的具体实现,也可以想为,女生是一个类,你的女朋友是这个大类中的具体一员
JS中:
不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类)—–es6以前是这样的。所以es5只有使用函数模拟的面向对象。
var Car = {
color: 'red',//车的颜色
wheel: 4,//车轮数量
}
var Car2 = {
color: 'blue',
wheel: 4,
}
alert(Car.color);//red
function createCar(color,wheel) {
return {
color:color,
wheel:wheel
}
}
//然后生成实例对象,就等于是在调用函数:
var cat1 = createCar("红色","4");
var cat2 = createCar("蓝色","4");
alert(cat1.color);//红色
function createCar(color,wheel){//createCar工厂
var obj = new Object;//或obj = {} 原材料阶段
obj.color = color;//加工
obj.wheel = wheel;//加工
return obj;//输出产品
}
//实例化
var cat1 = createCar("红色","4");
var cat2 = createCar("蓝色","4");
alert(cat1.color);//红色
function CreateCar(color,wheel){//构造函数首字母大写
//不需要自己创建对象了
this.color = color;//添加属性,this指向构造函数的实例对象
this.wheel = wheel;//添加属性
//不需要自己return了
}
//实例化
var cat1 = new CreateCar("红色","4");
var cat2 = new CreateCar("蓝色","4");
alert(cat1.color);//红色
直接定义,以学生类举例:
class Student{
constructor(name){
this.name = name;
}
hello(){
alert('hello');
}
}
//继承
class pupil extends Student{
constructor(name,grade){
super(name);
this,grade = grade;
}
myGrade(){
alert('I am a pupil');
}
}
var xiaoming = new Student("xiaoming");
var xiaohong = new pupil("xiaohong");
xiaoming.hello();
本文就到这里,由于作者能力有限,如有纰漏还请指出,不胜感激!
求一个免费的点赞!