前言

大家能够学习到这里想必也是编程界的老鸟了,讲语法主要讲一下与其他语言的区别。

一、运算符

<!-- js中的+-*/运算与c语言较为相似,简写方式也类似++、--、+=、%=等运算规则也相同在js中===代表绝对等于（值与类型都相同才算相同）！==（不绝对等于）值和类型有一个不相同或者都不相同为真-->
<!-- js中还支持三目运算符a>b?'a大于b':'b大于a'
-->

二、分支语句

 <!-- js中的条件语句 --><!-- if分支：ifif...else...if...else if..else...switch分支：   switch(){case 1:{}break;case 2:{}break;default:{}//默认情况}-->

三、循环语句

<!-- for(初始条件;终止条件;循环变量的变化)for/in循环遍历对象的属性whiledo/whilebreakcontinue与c语言非常类似
-->
<!--break的另一种用法label:语句块...break labelname;跳出指定的标签块
-->

四、异常的捕获与处理

捕捉异常
try{}
捕捉到异常后执行的语句
catch(err){}
无论是否会有异常,最后执行的语句
finally{}

五、js中的this关键字

<!-- 面向对象语言中 this 表示当前对象的一个引用。但在 JavaScript 中 this 不是固定不变的，它会随着执行环境的改变而改变。在方法中，this 表示该方法所属的对象。如果单独使用，this 表示全局对象。在函数中，this 表示全局对象。在函数中，在严格模式下，this 是未定义的(undefined)。在事件中，this 表示接收事件的元素。类似 call() 和 apply() 方法可以将 this 引用到任何对象。*****apply 和 call 允许切换函数执行的上下文环境（context），即 this 绑定的对象，可以将 this 引用到任何对象。
-->

代码如下：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p id="demo"></p><p id="demo1"></p><script>var p1={firname:"阿萨德",age:"28",f:function() {return this.firname+" "+this.age;}}var p2={firname:"张三",age:"20"}x=p1.f.call(p2)xx=p1.f.call(p1)document.getElementById("demo").innerHTML=xdocument.getElementById("demo1").innerHTML=xx</script>
</body>
</html>

六、let与const定义变量使用规则

<!-- const定义常量与使用let 定义的变量相似：二者都是块级作用域都不能和它所在作用域内的其他变量或函数拥有相同的名称两者还有以下两点区别：const声明的常量必须初始化，而let声明的变量不用const 定义常量的值不能通过再赋值修改，也不能再次声明。而 let 定义的变量值可以修改。let声明的变量在不同的{}内可以使用let定义不同的变量,var不行而且let定义的变量不能使用var再次定义,var定义的变量也不能使用let再次定义const与var、const与let同样使用var关键字声明的全局作用域变量属于window对象。使用let关键字声明的全局作用域变量不属于window对象。使用var关键字声明的变量在任何地方都可以修改。const可以一次定义多个常量值,并且每个常量值的名字不相同const指向的对象不可以改变,但是对象指向的东西可以改变myarray=["1","2","3"]myarray[0]="100"//正确myarray=["2","3"]//错误const声明的常量可以在不同块作用级重新声明和赋值可以使用Object.freeze()方法来 冻结变量 （指向与内容都不可变）const与let都是先声明后使用-->

代码如下：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p id="demo"></p><p id="demo1"></p><p id="demo2"></p><script>let x=10;var x1=10;// 用const修饰的变量被修改后会报错const x2=10x=11;x1=11;// x2=11;document.getElementById("demo").innerHTML=x;document.getElementById("demo1").innerHTML=x1;document.getElementById("demo2").innerHTML=x2;</script>
</body>
</html>

七、js中的void链接

<!-- javascript:void(0)与#+id的本质区别前者不会改变网页的url，而后者会将url定位到#+id
-->
<!-- 语法格式如下：void func()javascript:void func()或者void(func())javascript:void(func())javascript:void(0) 中最关键的是 void 关键字， void 是 JavaScript 中非常重要的关键字，该操作符指定要计算一个表达式但是不返回值。href="#"与href="javascript:void(0)"的区别# 包含了一个位置信息，默认的锚是#top 也就是网页的上端。而javascript:void(0), 仅仅表示一个死链接。在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。如果你要定义一个死链接请使用 javascript:void(0) 。可以使用javascript:void()执行想要的函数,弹窗,等等-->

语法规则：

  <a href="javascript:void(0);">点我</a><a href="#demo">回顶部</a>

八、异步编程setTimeout

<!-- 异步（Asynchronous, async）是与同步（Synchronous, sync）相对的概念。在我们学习的传统单线程编程中，程序的运行是同步的（同步不意味着所有步骤同时运行，而是指步骤在一个控制流序列中按顺序执行）。而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有的序列有顺序关系。简单来理解就是：同步按你的代码顺序执行，异步不按照代码顺序执行，异步的执行效率更高。回调函数就是一个函数，它是在我们启动一个异步任务的时候就告诉它：等你完成了这个任务之后要干什么。这样一来主线程几乎不用关心异步任务的状态了，他自己会善始善终。启用回调函数  setTimeout("函数名",间隔时间(毫秒))可以将函数定义到setTimeout函数内-->

代码如下：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><p>回调函数等待 3 秒后执行。</p><p id="demo"></p><p id="demo1"></p><p id="demo3"></p><p id="demo4"></p>
<script>// 第一种方式function print() {document.getElementById("demo").innerHTML="666";}//这里是定时三秒setTimeout(print, 3000);// 第二种方式setTimeout(function () {document.getElementById("demo1").innerHTML="666";}, 3000);// 测试// 主线程先打印出来,子线程继续接上setTimeout(function () {document.getElementById("demo3").innerHTML="-1!";}, 3000);document.getElementById("demo4").innerHTML="-2!";console.log("2");
</script>
</body>
</html>

九、函数闭包

<!-- 闭包是一种保护私有变量的机制，在函数执行时形成私有的作用域，保护里面的私有变量不受外界干扰。直观的说就是形成一个不销毁的栈环境。-->

代码如下：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head>
<body><script>var add = (function () {var count = 0;return function(){return count+=1;}})();function f(){document.getElementById("demo").innerHTML=add();}</script><div id="demo"></div><button type="button" onclick="f()">点击加一</button>
</body>
</html>

总结

这些都只是js的一些入门语法,想要学好还需细细的斟酌,想要快速入门可以看本博客。

JavaScript基本的的语法规则相关推荐

良好的JavaScript编码风格（语法规则）
编码风格 1.概述 "编程风格"(programming style)指的是编写代码的样式规则.不同的程序员,往往有不同的编程风格. 有人说,编译器的规范叫做"语法规则& ...
web前端学习：1分钟了解JavaScript基础语法规则
俗话说,"无规矩不成方圆".用在计算机语言上也同样使用.每种计算机语言都有自己的语法规则,只有遵循语法规则才能写出符合要求的代码.JavaScript也不例外,在使用JavaScr ...
从零开始React：一档 React环境搭建，语法规则，基础使用
手挽手带你学React入门第一期,带你熟悉React的语法规则,消除对JSX的恐惧感,由于现在开发中都是使用ES6语法开发React,所以这次也使用ES6的模式进行教学,如果大家对ES6不熟悉的话,先 ...
reactjs jsx语法规则
jsx语法规则: 1.定义虚拟DOM时,不要写引号. 2.标签中混入JS表达式时要用{}. 3.样式的类名指定不要用class,要用className. 4.内联样式,要用style={{key:va ...
JSON数据格式---JSON语法规则、JSON文件
JSON是JavaScript Object Notation的缩写,是一种轻量级的数据交换格式. JSON是独立于任何语言的文本格式.易于被计算机解析和生成 JSON中文网:http://www.j ...
系统学习 TypeScript（二）——开发流程和语法规则
前言我们已经知道了 TypeScript 是什么,以及为什么要用 TypeScript,今天,我们就来学习怎么初步使用它. TypeScript 的使用流程原始的 TypeScript 文件以 . ...
ANTLR4入门【打造你自己的语法规则】
文章目录什么是ANTLR4 ANTLR4的特点 ANTLR4的语法规则语法规则的声明 .g4文件的代码规则词法规则语法规则语法规则中的操作如何使用ANTLR4 实战 IDEA安装ANTLR ...
JSX 基本语法规则
JSX 全称 JavaScript XML,是React 定义的一种类似于 XML 的 JS 扩展语法:JS + XML 本质是 React.createElement(component, prop ...
react总结之jsx是什么，jsx语法规则
文章目录目录一.jsx是什么? 二.jsx的优点三.jsx语法规则一.jsx是什么? jSX 代表 Javascript XML.它是 Javascript 和 Html 的融合.它是一种类似 ...

JavaScript基本的的语法规则

文章目录

前言

一、运算符

二、分支语句

三、循环语句

四、异常的捕获与处理

五、js中的this关键字

六、let与const定义变量使用规则

七、js中的void链接

八、异步编程setTimeout

九、函数闭包

总结

JavaScript基本的的语法规则相关推荐

最新文章

热门文章