11.15 JavaScript总结
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了11.15 JavaScript总结，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含7487字，纯文字阅读大概需要11分钟。
内容图文
昨日回顾：
1.只有块级标签才能设置长宽
2.文字属性：font-family字体\font-size字体大小\font-weight字体粗细
3.文本属性：text-decoration:可以去掉a标签下划线
4.颜色：rgb(三参数)、rgba(四参数，最后一个是颜色透明度)
5.背景属性：
background-color、background-image背景图片
简写：background：颜色、图片地址、是否平铺、图片位置
固定图片：background-attachment：fixed
6.边框border
boder-style 边框样式：solid dotted dashed...
border-width 边框粗细
border-color 四种颜色参数
border-top\border-bottom\border-left\border-right：只调节一个边框
border-radius：画圆 50%
7.display**：
- display:none visibility:hidden
8.盒子模型：margin（外边距）：标签与标签之间的距离 margin ：0 auto;左右居中，上下由前面参数调。
9.float：脱离正常文档流
10.溢出 overflow 圆形头像示例
11.定位：所有标签默认是静态的，没有定位
relative：相对标签原来的位置
absolute：相对于已经定位过的父标签 做绝对定位
fixed：固定在浏览器窗口一个位置 始终不动
12.z-index：z轴值越大，越在屏幕最上面
- 作业：布局博客
- 搭建页面顺序：先写html骨架，然后CSS
- 去掉ul默认的点：list-style-type:none;
- 盒子阴影：box-shadow：5px,5px,5px,10px,rgba(四参数)
JavaScript（前端编程语言，有逻辑）
node.js支持前端js代码，跑在后端服务器上
js java半毛钱关系都没有
1.注释：
//单行注释
/*
多行注释1
多行注释2
*/
2.语法：
- script（脚本）标签内部直接书写，推荐写body最下面
- 通过script标签src，引入外部js文件
3.变量
js中声明变量需要使用关键字：
- var 声明的是全局有效（在哪声明都是全局）
var i=5; undefined i 5 for(var i=0;i<10;i++){ console.log(i)} VM238:2 0 VM238:2 1 VM238:2 2 VM238:2 3 VM238:2 4 VM238:2 5 VM238:2 6 VM238:2 7 VM238:2 8 VM238:2 9 undefined #var 局部影响全局- let 可以只在局部有效（只在函数内部有效）
let n=5; undefined for(let n=0;n<10;n++){ console.log(n)} VM391:2 0 VM391:2 1 VM391:2 2 VM391:2 3 VM391:2 4 VM391:2 5 VM391:2 6 VM391:2 7 VM391:2 8 VM391:2 9 undefined #let 局部声明那么只在局部有效，不会影响全局
例如：var name='jdsjs' let name='jdsjs'
- js中变量的命名规范：
- 数字 字母 下划线 $
- 不能用关键字
- 推荐使用驼峰体命名
- Python、c++推荐使用下划线，js、Java推荐使用驼峰体
- js代码默认以分号作为结束符，不写也不会报错。
- var let 区别：var在局部定义会影响全局，let 在哪定义就只影响哪，互不影响
- 关键字const定义真正的常量，定义后不能修改
4.js数据类型：
数值类型
- （动态类型）Number(int float，不区分整型和浮点型)
- 判断数据类型 typeof，它是一个一元运算符；NaN 也是数值类型，表示的意思是不是一个数字(not a number)。
- parseInt/parseFloat转成整型/浮点型，只要里面有数字就能转，如果字符串里什么数字都没有只要字符，会报NaN。
var x1='123' undefined parseInt(x1) 123 var x2='123abc' undefined parseInt(x2) 123 #只要字符串里面有数字 就可以转成整型 var x3='sjakdhdd' undefined parseInt(x3) NaN #当字符串里什么数字都没有，只有字符，那么不会报错，报NaN var x1='123.23.23.4.545' undefined parseFloat(x1) 123.23 parseInt(x1) 123- （动态类型）Number(int float，不区分整型和浮点型)
字符类型 string：
- 字符串的拼接：推荐使用+号
var name='engjd' undefined var indo='skdhh' undefined name + indo "engjdskdhh"- 字符串.ength（长度）
- .trim() 移除首位空白。.trimLeft()移除左边空白,.trimRight()移除右边空白，不能移除特殊字符。
var name1='eejnd ksj' undefined name1.length 9 var name2=' jddd ksjdjd ' undefined name2.trim() "jddd ksjdjd"- .charAt(数字)：返回第几个字符，按照索引取字符。
- .indexof('字符')：没有就是-1，有就返回在第几位，按照字符取索引。
- .concat(value,value1)：拼接
- substring(1,4)：索引切片，不识别负数；slice(1,4)，识别负数，slice(2)，默认从当前往后取
- .split切割
name1.charAt(0) "e" name1.indexOf('j') 2 name.concat('ajshsh ssjs') "engjdajshsh ssjs" name1.substring(1,4) "ejn" name1.slice(0,-2) "eejnd k" name1.slice(2) #不要该索引前面的值 "jnd ksj"自定义对象 object ：
- 数组[]--->索引取值、length、尾部追加数据.push()、删除尾部元素.pop、.shift()删除头部元素、.splice(1,2,[11,22,33])起始位 删个数 删完要加的数组/.forEach()将数组的每个元素传递给回调函数
var l1=[1,2,3,4,5,6] undefined typeof l1 "object" l1[0] 1 l1.length 6 l1.push(666) 7 l1 (6)?[1, 2, 3, 4, 5, 6] l2 (6)?[11, 22, 33, 44, 55, 66] l2.splice(1,2) #第一个参数是起始索引位，第二个参数是删除的个数 (2)?[22, 33] l2 (4)?[11, 44, 55, 66] l2.splice(1,1,[111,222,333]) [44] l2 (4)?[11, Array(3), 55, 66] l2.splice(1,2,88,99,77) (2)?[Array(3), 55] l2 (5)?[11, 88, 99, 77, 66] #删后再加- 自定义对象{}--->js中所有事物都是对象，也是面向对象编程，定义对象的时候关键字是new
var l2=[11,22,33,44,55,66] undefined l2.forEach(function(index){ console.log(index)}) VM2302:2 11 VM2302:2 22 VM2302:2 33 VM2302:2 44 VM2302:2 55 VM2302:2 66 undefined #for循环取出每一个元素交给函数处理 l2.forEach(function(index,obj){ console.log(index,obj)}) VM2334:2 11 0 VM2334:2 22 1 VM2334:2 33 2 VM2334:2 44 3 VM2334:2 55 4 VM2334:2 66 5 undefined #两个参数 一个是元素 一个是索引
模板字符串：${value} value被定义过，使用方法如同Python中的占位符
var name4='ksjsk';
var age=19
undefined
var res6=`
my name is ${name4} my age is ${age}
`
undefined
res6
"
my name is ksjsk my age is 19
"
#需要提前定义出变量，否则找不到会报错布尔值 boolean：true false（小写）
underfined：没有被定义
- null 手动赋值为null，对象类型
- undefined 只声明变量没有赋值
var x=10; var res1=x++; #先赋值后自增 var res2=++x; #先自增后赋值 undefined res1 10 res2 12 var x1=5; var x2='5'; undefined x1==x2 #弱等于 内部自动转换成相同数据类型 true x1===x2 #不想转用三个=号 强等于 false
5.条件判断
- if(条件){console.log('打印结果')}
var age=18
undefined
if(age>18){
console.log('小姐姐你好')
}else{
console.log('小妹妹吃糖不')
}
VM3183:4 小妹妹吃糖不
undefined
var age=28
undefined
if(age>30){
console.log('你是个好人')
}else if(age>24){
console.log('考虑一下')
}else{
console.log('哈哈哈')}
VM3320:4 考虑一下- switch中的case子句通常都会加break语句，否则程序会继续执行后续case中的语句
var today=2
undefined
switch (today){
case 0:
console.log('养生迪');
break
case 1:
console.log('泡妞');
break
case 2:
console.log('炸街');
break
case 3:
console.log('老实人上线：学习');
break
}
VM3658:9 炸街
undefinedvar l=[11,22,33,44,55,66]
undefined
for(let i=0;i<l.length;i++){
console.log(l[i])}
11
22
33
44
55
66
undefined- while循环
var i=0;
undefined
while(i<10){
console.log(i);
i++;}- 三元运算符
x=1
y=2
res=x>y ? 10:20
206.函数
function f2(a,b){
if(arguments.length==2){ #内置的arguments对象接收用户传入的所有参数
console.log(a,b)
}else if(arguments.length>2)
{console.log('参数传多了')
}else{
console.log('参数传少了')
}}
undefined
f2(1,2)
VM4785:3 1 2
undefined
f2(1)
VM4785:7 参数传少了
undefined
f2(1,2,4)
VM4785:5 参数传多了
undefined- 函数的全局和局部变量
- 局部：在js函数内部声明的变量（使用var)是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除。
- 全局：在函数外部声明的变量是全局变量，网页上所有的脚本和函数都能访问它。
- 创建对象：
var myObject=new Object();
undefined
myObject.username='jason'
"jason"
myObject.password=123
123
myObject.age=18
18
myObject
{username: "jason", password: 123, age: 18}var d1=new Date();
console.log(d1.toLocaleString());
VM5531:1 2019/11/15 下午10:17:15
undefined
d1
Fri Nov 15 2019 22:17:15 GMT+0800 (中国标准时间)- json对象：
var o1={'username':'jason','password':'123'}
undefined
JSON.stringify(o1) #json.dumps
"{"username":"jason","password":"123"}"
var res=JSON.stringify(o1)
undefined
res
"{"username":"jason","password":"123"}"
var res7=JSON.parse(res) #json.loads
undefined
res7
{username: "jason", password: "123"}7.Reg正则
#定义正则表达式两种方式：
var reg1=new Reg("^[a-zA-Z][a-zA-Z0-9]{5,11}");
var reg2=/^[a-zA-Z][a-zA-Z0-9]{5,11}$/; #建议使用
reg2.test()
true
reg2.test('undefined')
true
var reg2=/^[a-zA-Z][a-zA-Z0-9]{5,11}$/g; #全局匹配，有一个lastIndex属性
var name10='iewnondsb'
reg2.lastIndex
0
reg2.test(name10)
true
reg2.lastIndex
9
reg2.test(name10)
false
var reg3=/undefined/
undefined
reg3.test()
true内容总结
以上是互联网集市为您收集整理的11.15 JavaScript总结全部内容，希望文章能够帮你解决11.15 JavaScript总结所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。