Day24JS基础语法

1 js基础语法
1.单行注释
/*多行注释
多行注释
/
2.标识符
标识符就是用来命名的(给变量、函数、对象命名)
js中要求标识符是由字母、数字、下划线和$组成的,数字不能开头
js中大小写敏感
console.log():在控制台打印括号中的内容
3.常用的数据类型
数字类型(Number)、布尔(Boolean)、字符串(String)
数组(array)、对象(Object)、函数(function)
typeof(数据):获取数据类型
数字类型(Number):包含所有的数字(整数和小数),支持科学计数法,不支持复数
布尔(Boolean):true和false
字符串(String):用双引号或者单引号括起来的
数组(Array):相当于python中的列表
对象(Object):相当于python中对象和字典的结合
函数(Function)
typeof(数据):虎丘数据类型
var 变量名 = new 类型名(数据):将数据转换成指定的类型
常用的特殊值:undefined,null(一般用来清空变量)
2 变量
语法:
var 变量名
变量名 = 值
说明:
var :是js的关键字,声明变量的时候用。var可以省略,省略的时候变量名后面必须赋值
不省略的时候变量名后可以赋值,也可以不赋值,不赋值的时候默认值是undefined
变量名:标识符,不能是关键字。驼峰式命名规范
3 运算符
js中支持 数学运算符、比较运算符、逻辑运算符、赋值运算符、位运算符
1.数学运算符:+,-,,/,%,
,++,--
js中不支持整除
2.比较运算符:>, <, ==, !=, >=, <=, ===, !==
比较返回的结果都是布尔值
==(相等):判断值是否相等
===(完全相等):判断值和类型是是否相等
3.逻辑运算符:&&(与)、 ||(或) 、 !(非)
运算规则和python中的and、or、not一样
4.赋值运算符:=, +=, -=, *=, /=, %=
5.位运算符:&、|、^、~ 、 >>、<<
6.复合运算:数学、比较、逻辑、赋值
<script type="text/javascript">
console.log(5==5)
console.log(5=='5')
console.log(5===5)
console.log(5==='5')
</script>

4 分支结构
js中的分支结构有两个,分别是if和switch语句
1.if语句
结构:
if(条件语句){
代码块1
}else if(条件语句){
代码块2
}else{
代码块3
}
2.switch语句
switch(变量/表达式){
case 值1:{
代码段1
}
case 值2:{
代码段2
}
case 值3:{
代码段3
}
default:{
代码段4
}
}
<script type="text/javascript">
var num
num = 3
switch(num){
case 0:
console.log('周一')
break
case 1:
console.log('周二')
break
case 2:
console.log('周三')
break
case 3:
console.log('周四')
break
case 4:
console.log('周五')
break
case 5:
console.log('周一')
break
case 6:
console.log('周天')
break
default:
console.log('erro')
}

var score
switch(score){
    case 0:
        console.log('不及格')
        break
    case 1:
    case 2:
    case 3:
        console.log('及格')
        break
    case 4:
    case 5:
        console.log('优秀')
        break
    default:
        console.log('输入有误')
    
}

</script>

5 循环结构
js中的循环有for循环和while循环
1.for循环
a.for循环
for-in:和python的for循环的执行过程一样
for(变量 in 序列){
循环体
}
注意:取出来的是元素的下标或者key(属性名)
序列可以是字符串、数组和对象
b.C的for循环结构:
for(表达式1;表达式2;表达式3){
循环体
}
2.while循环
1.while循环:和python的while循环一样
while(条件语句){
循环体
}
先判断,后执行
2.do-while循环
do{
循环体
}while(条件语句)
执行过程:先执行一次再判断
3.break和continue
和python一样
<script type="text/javascript">
str1 = 'abc'
for(x in str1){
console.log(str1[x])
}

arr = [10, 20, 30]
for(x in arr){
    console.log(x, arr[x])
}

obj1 = {name:'xiaoming', age:'20'}
for(x in obj1){
    console.log(x, obj1[x])
}

</script>

6 函数
函数分为声明和调用,声明的时候不会执行函数体,只有调用才会执行函数体
1.函数的声明
a.和python相同的声明方式
function 函数名(参数列表){
函数体
return 返回值
}
说明:function是声明函数的关键字
函数名:驼峰式命名,见名知义
参数列表:参数如果设置默认值,相当于设置默认值undefined
b.以声明变量的形式声明函数
函数名 = function(参数列表){
函数体
return 返回值
}
2.函数的调用
函数名(实参列表)
调用的时候,保证每个参数都有值
只能通过位置参数传参
js中不支持不定长参数
返回值:没有return返回值是undefined
<script type="text/javascript">

function sum(num1, num2){
    return num1 + num2
}

console.log(sum(1, 2))

mul = function(num1, num2){
    return num1 * num2
}

console.log(mul(2, 3))

</script>

7 数据类型
1.字符串:由单引号或者双引号括起来的
a.转义字符:和python一样
b.字符串长度:字符串.length
c.获取单个字符:字符串[下标]
注意:下标取值范围0~长度-1;超出范围取到的是undefined
js中没有切片语法
d.相关运算

    • 将两个字符串拼接在一起产生一个新的字符串
      (注意如果是一个字符串加上其他的数据类型,会先将其他数据类型转换成字符串再相加)
      比较运算(>,<,==,!=,===,!==)

,<:和python一样,比较字符编码值的大小
e.相关方法
match(正则表达式):根据正则表达式匹配结果
正则表达式写在/ /之间
<script type="text/javascript">
str1 = 'dg26ff656jkjasn545mnxcnvija'
re = str1.match(/\d+/)
console.log(re)

</script>

8 数组
数组就是python中的列表
1.数组是有序的,可变的,里面的元素可以是任意类型的数据
2.增删改查
a.查(获取数组中的元素)
数组[下标]
数组.slice(开始下标, 个数):切片
b.增(添加元素)
数组.push():将元素添加到数组的最后
c.删(删除元素)
数组.pop():将数组的最后元素删除
数组.splice(开始下标, 指定个数):删除
d.改(修改元素)
数组[下标] = 新值:修改指定下标的元素
数组.splice(开始下标,个数,多个其他参数):用其他参数替换开始下标开始后的指定个数的元素
<script type="text/javascript">
arr1 = [1, 2, 'abc']
console.log(arr1[2])

arr1.push('hello')
console.log(arr1)

arr2 = [1, 2, 'abc']
arr2.pop()
console.log(arr2)

</script>

9 对象
js中没有python的类,只有对象和构造方法
1.对象的字面量
对象名 = {属性名:属性值,属性名2:属性值2...}
2.使用对象属性
对象[属性名]
对象.属性
3.构造方法
function 类名(参数列表){
this.属性1 = 属性值1
this.属性1 = 属性值1

return this
}
这里的this类似python中的self,表示当前对象
<script type="text/javascript">
    p1 = {
        name:'xiaoming',
        age:20,
        tel:'1548555511',
        eat:function(){
            console.log('吃饭')
        }
    }
    
    console.log(p1.name)
    
    function Person(name, age){
        this.name = name
        this.age = age
        this.sex = '男'
        this.tel = ''
        
        this.eat = function(food){
            console.log(this.name + ' eat ' + food)
        }
        
        return this
    }
    
    p2 = Person('xiaoming', 20)
    p2.tel = '1545225634'
    p2.eat('fruit')
    
    function Dog(color, age, kind){
        this.color = color
        this.age = age
        this.kind = kind
        
        this.eat = function(){
            console.log('eat')
        }
        
        this.bark = function(){
            console.log('wangwang')
        }
        
        return this
    }
    
    dog1 = Dog('red', 2)
    dog1.eat()
    console.log(dog1.color)
    
    dog2 = Dog('yellow', 3)
    dog2.bark()
    dog2.kind = 'Huskie'
    console.log(dog2.kind)
</script>
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,968评论 6 482
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,601评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 153,220评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,416评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,425评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,144评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,432评论 3 401
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,088评论 0 261
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,586评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,028评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,137评论 1 334
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,783评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,343评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,333评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,559评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,595评论 2 355
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,901评论 2 345

推荐阅读更多精彩内容

  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,096评论 0 3
  • 一、快捷键 ctr+b 执行ctr+/ 单行注释ctr+c ...
    o_8319阅读 5,782评论 2 16
  • 第一章 前端三大语言:HTML(专门编写网页内容)、CSS(编写网页样式)、JS(专门编写网页交互行为) 能简写尽...
    fastwe阅读 931评论 0 0
  • 不知道大家有没有这样的一种感觉:农村正在以某种微妙的平衡在发展!当然这样的平衡除了财富的收入外,还有就是生活方式。...
    夜里的白天阅读 224评论 1 1
  • 01:15:20 躲过头上的子弹——这玩意谁他妈躲得过去?完全是运气才没被打死——我窜上没熄火的车我真是个天才,早...
    守护学徒阅读 632评论 2 0