实习总结第二天
![]() |
The secret of success in life is for a man to be ready for his opportunity when it comes. 人生成功的秘诀是当机遇来临时要及时地抓住它。 |
一、js与java的区别
|
|
|
|
|
|
|
|
##二、js的组成
-
语法
-
变量
-
数据类型
-
关键字和保留字
-
操作符
-
流程控制语句
-
数组
-
对象
-
函数
-
正则表达式
三、js
-
变量
-
声明
- 常量的声明:
const a=1;
- 变量的声明:
let b;
- 常量的声明:
-
赋值
b="hi world";
-
访问
console.log();
//打印到控制台中
-
-
数据类型
-
js有5中基本数据类型
-
number
-
let a=3; let b=3.5; let c=011;//八进制 let d=0x11;//16进制 let e=1+undefined;//NaN(not a number)
-
-
string(有三种方式创建字符串)
-
let a ="hello world";
-
let b ='hello world';
-
let c =`hello world`;
-
-
boolean
-
let a=true;
-
let c =false;
-
-
undefined
-
let a;
-
-
+ null + ``````javascript let a=null; `````` + java有8中基本数据类型+String + byte
-
-
short
- int
- long
- float
- double
- boolean
- char
-
引用数据类型
-
js中除了基本数据类型其余全是引用数据类型
-
数组类型
- 例如
let array=[1,3,5];
- 例如
-
对象类型
- 例如
let a = {name:"tom",age:12};
- 例如
-
函数
- 例如
let foo=function (a,b){let total=a+b;result a+b;}
- 例如
-
js中如何检测数据类型
- 通过
typeof
数据来检测,例如:var result=typeof a;
- 通过
-
-
操作符
-
算术运算符
-
+、+=
-
-、-=
-
*、*=
-
%、%=
-
逻辑运算符
- &&(同真则真,有假则假)
-
如果第一个表达式为真,第二个表达式就可以决定整个表达式结果,返回第二个表达式
- 如果第一个表达式为假,整个表达式结果就已经确定,直接返回第一个表达式,无需判断第二个表达式
-
||(有真则真,同假才假)
- 如果第一个表达式为真,整个表达式结果就已经确定,直接返回第一个表达式,无需判断第二个表达式
-
如果第一个表达式为假,第二个表达式就可以决定整个表达式结果,返回第二个表达式
-
!
-
-
比较运算符
-
>或>=
-
<或<=
-
==或!=
-
当比较基本数据类型的时候,比较值时,当值类型不同,先转换再比较
-
当比较引用数据类型的时候,比较引用地址
-
-
===或!==
-
当比较基本数据类型的时候,先比较数据类型,如果数据类型不同直接返回false,否则再进一步比较值
- 当比较引用数据类型的时候,比较引用地址
-
三目运算符
A=(b>c)?d:e
-
一元运算符
+
-
-
自增
++
-
自减
--
-
-
类型转换
-
流程控制语句
-
分支语句
-
if
-
if-else
-
if-else if-else
-
switch-case
let v = 1; switch(v){ case c1: exp1; break; case c2: exp2; break; ... default: exp; break; } // v 与 c1对比采用的是 ===, 意味着先比较数据类型在比较值 //default在最后可以不添加break。但是当default位于其他地方的时候一定要添加break;
-
-
-
循环语句
- 三要素:初始化条件、结束判定条件、迭代
-
for循环
for(初始化条件;结束判定条件;迭代){
循环体;
}let result = 0; for(var i=1;i<=100;i++){ result += i; // result = reuslt + i; }
-
while循环
初始化条件;
while(结束判定条件){
循环体;
迭代;
}let result = 0; let i = 1; while(i<=100){ result += i; i++ }
-
do-while循环
初始化条件
do{
循环体;
迭代;
}while(结束判定条件);-
let result = 0; let i = 1; do{ result += i; i++; } while(i<=100);
-
-
-
对象
-
初始化对象
使用双大括号作为对象的边界,对象有键值对组成,键值对与键值对之间通过逗号",“分割,属性名与属性值通过冒号”:"分割
-
var obj = {name:"terry",age:12,gender:"male",sayName:function(){}};
-
构造对象
var obj = new Object(); obj.name= "terry"; obj.age = 12; obj.gender = "male"
-
对象属性访问
-
点访问
obj.name //访问obj对象中的name属性
-
中括号访问符
-
中括号解析变量
let name = "name" obj[name] //首先先将name解析为"name"(常量),然后从obj中获取name属性
-
中括号解析常量
obj["name"] //直接从obj中获取name属性
-
-
-
遍历对象
for(let k in obj){ let k=obj[k];//k表示obj中的属性名,每次循环,for循环都会从obj中获取一个属性名赋值为k }
-
-
-
数组
-
函数
方法,js中的函数比java方法更强大一些,它实际上是方法和类的统称
-
函数的定义
-
函数声明
function 函数名(形式参数){
}
function foo(a,b){ let result = a+b; return result; }
-
函数表达式
var 函数名 = function(形式参数){
}
var foo = function(a,b){ let result = a+b; return result; }
-
-
函数调用
-
函数名(实际参数)
let result=foo(1,3);
-
-
回调函数
我调用你的函数,你的函数在执行的时候又返回来调用我的函数
-
回调函数与普通函数的区别
回调函数在调用时调用的参数是一个算法,而普通函数在调用时调用的参数是数据
//普通函数 var test=function(e){ console.log(e); } test("hi"); //回调函数 var test=function(e){ console.log("hi"); } test(function(content){ console.log(content); })
-
-
-
四、html基础
- 块元素
- 块元素有:div、h1-h6、p、ul>li、dl>dt、dd ol->
- 独占一行空间,高度由内容决定。可以自定义宽和高
- 主要用于搭建页面框架
- 行内元素
- 行内元素有:span a img i em strong
- 与其他行内元素共享一行空间,宽高都由内容决定,无法自定义宽和高
- 主要是在框架内部填充的作用
五、css基础
-
选择器
- 类选择器
- 语法为:
.first{}//选中class为first的元素
- 语法为:
- id选择器
- 语法为:
#first{}//选中id为first的元素
- 语法为:
- 标签选择器
- 语法为:
div{}//选中所有的的元素
- 语法为:
- 父子选择器
- 语法为:
.first>div{}//选中class为first的所有div孩子元素
- 语法为:
- 后代选择器
- 语法为:
.first div{}//选中class为first的所有div后代元素
- 语法为:
- 类选择器
-
基础布局
-
浮动布局
-
定位布局
-
伸缩盒布局
-
display:flex;//变为伸缩盒元素 flex-direction:row;//子元素沿着行来排列 justify-content:space-between;//空白介于中间
-
-