3 HTML&JS等前端知识系列之javascript的基础
2016-12-14 21:34
1101 查看
preface
作为一名运维开发,必须懂得前端知识,比如javascript,dom等等,下面就聊聊javascript。include
数据格式条件判断,循环流程等。
函数
面向对象
what is javascript??
JavaScript 是世界上最流行的编程语言。这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 很容易学习
javascript的存在形式
文件,src引用某个js文件块,以代码块的形式存在
javascript 存放在哪?
应该存放在body标签的底部。局部变量与全局变量
var 申明的是局部变量var name='ljf'
没有加var,表示是全局变量。谨慎使用全局变量。
name='yq'
注释
当行注释可以使用//,如下所示// alert('abc')
多行注释可以使用/* */来包裹需要注释的内容
/* f1(); f2(); */
Notice
以下操作都是在浏览器的console下操作的。
数据类型:1 数字,字符串,数组(字典)
特殊值
先说说几个特殊的值null
undefined
以上bool值都是false
数字
var age=19 var age=Number(20) var age=Number('20')
typeof 判断类型
var age=19 typeof age "number" age='19' "19" typeof age "string"
parseInt 转换类型,从字符串到数字
age=parseInt(age) 19
parseFloat 转换类型,从字符串到浮点
age='19.9' "19.9" age=parseFloat(age) 19.9 age 19.9
字符串 去除两边空格
var name = ' ljf ' undefined name.trim() "ljf"
指定左右边 去除空格
name.trimLeft() "ljf " name.trimRight() " ljf"
charAt 取值
从0开始的下标,传入参数为下标
name.charAt(2) "j" name.charAt(0) " "
substring 切片
name.substring(0,2) " l" name.substring(2,5) "jf "
indexOf 获取指定元素的下标
name.indexOf('j') 2
数组(字典)
等于python里面的列表push 数组后端追加
a=[1,2,3,4] [1, 2, 3, 4] a.push(5) 5 a [1, 2, 3, 4, 5]
unshift 最前面追加
a.unshift(1) 6 a [1, 1, 2, 3, 4, 5]
splice 指定位置插入
第二个参数必须是0,非0会报错。遵循左闭右开的原则
a.splice(1,0,'ali') [] a ["the", "ali", 1, 1, 2, 3, 4, 5] a.splice(4,0,'fuck') [] a ["the", "ali", 1, 1, "fuck", 2, 3, 4, 5]
pop 删除最后一个并且返回删除的值
a=["the", "ali", 1, 1, "fuck", 2, 3, 4] c=a.pop() c 4
slice 切片处理
传入下标,然后就能够对列表切片
a ["the", 2, 3, 1, 44] a.slice(1,3) [2, 3]
reverse 反转列表
并不返回新值,而是在原处修改。
a ["the", 2, 3, 1, 44] a.slice(1,3) [2, 3]
a.reverse()
[44, 1, 3, 2, "the"]
join 拼接功能
a [44, 1, 3, 2, "the"] a.join('-') "44-1-3-2-the"
concat 合并数组
把数组b在a数组后面追加
var b=[11,22,33,44] undefined a.concat(b) [44, 1, 3, 2, "the", 11, 22, 33, 44]
splice 删除指定下标的值
a ["the", 1, "fuck", 2, 3] a.splice(1,2) [1, "fuck"] a
bool值
true和false都是小写的,如下所示:var a=true; undefined a true
json序列号与反序列化
采用json数据格式dic = {'k1':'v2'} Object {k1: "v2"} m=JSON.stringify(dic) "{"k1":"v2"}" n=JSON.parse(m) Object {k1: "v2"}
下面说说js的循环流程
Notice以下操作都是在浏览器的console下操作的。
for循环
break跳出循环continue 继续循环
循环数组
在数组里面的,默认是循环列表的下标
li=[11,22,33,44] [11, 22, 33, 44] for(var item in li){ console.log(item); } 0 1 2 3 undefined for(var item in li){ console.log(li[item]); } 11 22 33 44
循环字典
默认是循环k
a={'k1':'v1','k2':'v2'} Object {k1: "v1", k2: "v2"} for(var i in a){console.log(i)} k1 k2 undefined
仿c语言的for循环
这个只能适用于数组,不能适用于字典
for(var i=0;i<100;i++){console.log(i)} 0 1 2
while循环
while(true){console.log(11)}
if条件判断
下面看看伪代码if(条件){ }else if(条件){ }else if() { }
switch 条件判断
下面看看伪代码switch(name){ case 1: console.log('1111'); break; case 2: console.log('222'); break; default: console.log('dddd') }
异常捕获
下面看看伪代码try{ }catch(e){ # e就是异常类型, }finally { # 最后执行的。 }
下面看看js的函数定义以及调用
普通函数
function fuc1(args) { console.log(args); return 'ljf' } xx = fuc1(123); alert(xx);
匿名函数
下面这样的函数比较少见var f = function (args) { console.log(args); }; f('this ni ming func')
自执行函数
自动执行的函数,一般用于js库。代码如下(function(arg){ console.log('1212',arg); })('ljf')
面向对象的用法,我们一般用的少,这里的this等于python的self。
function Foo(name,age){ this.Name = name; this.Age = age; this.Func = function(arg){ return this.Name + arg; } } var obx = new Foo('ljf',22); console.log(obx.Name); console.log(obx.Age); var ret = obx.Func('hehe'); console.log(ret)
相关文章推荐
- JsBridge与客户端交互
- 框架 day77 涛涛商城项目-前台系统及门户搭建,JSONP解决跨域ajax请求
- JSP生命周期
- js 中isArray
- JSP系统开发学习之一用户登录系统(model1,纯jsp版)
- js json对象比较html
- 爬虫第三战 json爬取网易新闻
- js json对象比较
- jsp/servlet文件上传
- 深入理解JavaScript系列(4):立即调用的函数表达式
- el表达式在jsp中无法使用解决办法
- JSTL标准标签库
- 【JavaScript】面向对象
- JavaScript 键盘事件
- JavaScript面向对象(1)-封装
- C#/JS 利用正则表达式 替换/删除 img 里面的 width height
- ExtJs6.0 总结(2)
- JavaScript面向对象(二):继承
- JS-日期框、下拉框、全选复选框
- javascript面向对象编程笔记第一章<基本类型>