函数定义:
定义函数的关键词 function,函数内的代码块,包裹在花括号中:
<script type="text/javascript"> // 使用function定义函数 function test(){ console.log("hello word") } test() //函数调用 </script>
提示:JavaScript 对大小写敏感。关键词 function 必须是小写的
函数参数:
<script type="text/javascript"> // 使用function定义函数 function test(x,y){ console.log(x+y) } test(1,2) //函数调用 </script>
函数返回值:
<script type="text/javascript"> // 使用function定义函数 function test(x,y){ return (x+y) } test(1,2) //函数调用 </script>
使用 return 来返回值。在使用 return 语句时,函数会停止执行,并返回指定的值。
<script type="text/javascript"> // 使用function定义函数 function test(x,y){ return x+y // 返回值 } var res = test(1,2) // 接收返回值 console.log(res) </script>
创建对象
对象由花括号分隔。在括号内部
方式一:
<script type="text/javascript"> var person = new Object(); // 定义对象的属性 person.name = 'test' person.age = '18' // 定义对象的方法 person.work = function(){ console.log("work 方法") } </script>
方式二:类似于python中的字典
<script type="text/javascript"> var person = { // 定义对象的属性 name: 'test', age: 18, //定义对象的方法 方式1 work: function(){ console.log("work 方法") }, //定义对象的方法 方式2 work2(){ console.log("work2 方法") }, //定义对象的方法 方式3,箭头函数 work2(){ console.log("work2 方法") } } </script>
获取对象属性可以通过:对象.属性、对象[属性]
创建对象的方法
方式一:
<script type="text/javascript"> var person = { // 定义对象的方法 work : function(){ console.log("work 方法") } </script>
方式二:
<script type="text/javascript"> var person = { // 定义对象的方法 work(){ console.log("work 方法") } </script>
方式三:箭头函数
<script type="text/javascript"> var person = { // 定义对象的方法 work:()=>{ console.log("work 方法") } </script>
调用对象的方法:
如果在对象中调用对象的属性或者方法时,需要通过this(代表的对象本身,类似于python中的self):
<script type="text/javascript"> var person={ //定义对象属性 name:'test', age:18, //定义对象方法 work:function(){ console.log(this.name) } } </script>
注意:箭头函数中的this并不代表对象本身,而是外层作用域的对象
举例:
<script type="text/javascript"> var name = 'hello' var person = { // 定义对象的属性 name: 'test', age: 18, //定义对象的方法,箭头函数 work:()=> { console.log(this.name) } } </script>
while循环
while 条件语句{ 循环体 }
<script type="text/javascript"> var a = 0; while(a<3){ console.log(a) a++ } </script>
for循环
for in循环:
for ( i in Array ){ 循环体代码 }
遍历数组: 结果为下标
<script type="text/javascript"> var li = [11,22,33]; for (i in li){ console.log(i) } </script>
需要注意for循环遍历数组的
获取值:
<script type="text/javascript"> var li = [11,22,33]; for (i in li){ console.log(li[i]) } </script>
遍历对象:结果为属性的名字
<script type="text/javascript"> var li={ a:11, b:22, c:33 } for (i in li){ console.log(i) } </script>
获取值:
<script type="text/javascript"> var li={ a:11, b:22, c:33 } for (i in li){ console.log(li[i]) } </script>
for条件循环
for (语句1;语句2;语句3 ){ 循环体代码 }
<script type="text/javascript"> // 初始值;条件;循环体 for (a = 0; a < 5; a++) { console.log(a) } </script>
forEach() : 遍历列表,接收一个处理的回调函数
<script type="text/javascript"> var li = [11,22,33,44] li.forEach(function(value,index,array){ console.log('value:',value) console.log('index:',index) console.log('array:',array) }) </script>
filter方法:返回值与索引,对数组进行过滤
<script type="text/javascript"> var li = [11,22,33,44] var res = li.filter(function(value,index){ return value>33 }) console.log(res) </script>
find 方法:返回符合条件的第一个元素
<script type="text/javascript"> var li = [11,22,33,44] var res = li.find(function(value,index){ return value>22 }) console.log(res) </script>
findInex方法:返回符合条件的值的索引
<script type="text/javascript"> var li = [11,22,33,44] var res = li.findIndex(function(value,index){ return value>22 }) console.log(res) </script>