您的位置:首页 > Web前端 > JavaScript

JavaScript 基础复习1(引用翻译了相当多的API)

2017-02-21 11:01 1321 查看
【本文引用翻译了相当多的API】

一、关于JavaScript引用格式

首先,创建一个“scripts”文件夹(用于存放JavaScript文件)。然后在新建的scripts文件夹下创建一个新的main.js文件。
index.html 文件,在 </body> 闭合标签之前加入
<script src="scripts/main.js"></script>

这基本上与引入 CSS 的 <link> 元素功能相同——它将 JavaScript 引入了页面,所以它将影响 HTML (包括 CSS 和其他页面上的任何内容)。
—————————————————————————————————————————————————
添加一个图像转换器
首先,找到另一个你想用来装饰你的网页的图片。确保它与你第一张图片尺寸相同,或者尽可能相似。

将图片保存在 images 文件夹。

重命名图片为 firefox2.pnga 
var myImage = document.querySelector('img');//在程序中声明html中的图片对象
myImage.onclick = function() {              //绑定出发功能
var mySrc = myImage.getAttribute('src');
if(mySrc === 'images/firefox-icon.png') {
myImage.setAttribute ('src','images/firefox2.png');
}
else {
myImage.setAttribute ('src','images/firefox-icon.png');
}
}

—————————————————————————————————
获取按钮
在 index.html 里, 在 <script> 元素前添加下一行代码:

<button>Change user</button>

在 main.js 里,在文件底部添加下面的代码,抓去 按钮 或者可以 标题 的引用并将其存放在变量里:

var myButton = document.querySelector('button');

二、关于JavaScript基础复习

变量(Variables)

myVariable = 'Bob'

//js对变量大小写很敏感

变量解释示例
String字符串,一段文本。 要指示变量是字符串,你应该将它们用引号包裹起来。
var
myVariable = 'Bob';
Number数字,一个数字。不用引号包围。
var
myVariable = 10;
Boolean布尔型,一个 True/False (真 / 假)值。 
true
/
false
 是
JS 里的特殊关键字,不需要引号。
var
myVariable = true;
Array数组,一种允许你存储多个值在一个引用里的结构。
var
myVariable = [1,'Bob','Steve',10];


调用数组的元素只需: 
myVariable[0]
myVariable[1]
,
等等.
Object对象,基本上 JavaScript 里的任何东西都是对象,而且都可以被储存在变量里。将这个记在脑子里。
var
myVariable = document.querySelector('h1');


上面所有示例都是对象。
运算符

描述
符号
删除
delete
typeof
typeof
void
void
instanceof
instanceof
new
new
in
in
描述
符号
按位“非”
~
按位左移
<<
按位右移
>>
无符号右移
>>>
按位“与”
&
按位“异或”
^
按位“或”
|
描述
符号
逻辑“非”
!
小于
<
大于
>
小于或等于
<=
大于或等于
>=
相等
==
不相等
!=
逻辑“与”
&&
逻辑“或”
||
有条件的(三元)
?:
逗号
,
严格相等
===
严格不等
!==
运算符解释符号示例
加/连接用来相加两个数字,或者连接两个字符串。
+
6
+ 9;

"Hello " + "world!";
减、乘、除这些运算符操作将与你期望它们在基础数学中所做的一样。
-
*
/
9
- 3;

8 * 2; // JS中的乘是一个"*"号;

9 / 3;
赋值运算符你之前已经见过这个符号了:它将一个值赋给一个变量
=
var
myVariable = 'Bob';
相等它将测试两个值是否相等,而且会返回一个 
true
/
false
 (布尔型)值。
===
var
myVariable = 3;

myVariable === 4;
非,不等经常与相等运算一起使用,非运算符在JS中表示逻辑非——它也返回一个布尔值。
!
!==
原本的值是 true ,但是返回了 false 因为之后我们做了非运算:

var myVariable = 3;

!myVariable === 3;


这里我们测试了"我的 
myVariable
 是否等于 3". 这里返回了 
false
,
因为它等于 3.

var
myVariable = 3;


myVariable !== 3;

语句

也就是常说的;终结一行语句。

函数

可以理解为方法,函数的定义是变量,任何函数都是数据,都可以当成参数或者对象。

【箭头函数】【很强大】【箭头函数语法
Microsoft Edge 中受支持】【等同匿名函数,一种速记方法】

evens.map(v => v + 1);

evens.map((v, i) => v + i);

事件【★o★】【监听】

document.querySelector('html').onclick = function() {
alert('Ouch! Stop poking me!');
}
控制程序流

条件运算符

以for...in 循环【强大】为代表的循环语句
计数器 prop 包含当前属性的名称或当前数组元素的索引。
// Create an object with some properties
var myObject = new Object();
myObject.name = "James";
myObject.age = "22";
myObject.phone = "555 1234";

// Enumerate (loop through)_all the properties in the object
for (var prop in myObject)
{
// This displays "The property 'name' is James", etc.
document.write("The property '" + prop + "' is " + myObject[prop]);
// New line.
document.write("<br />");
}

break 和 continue 语句


附录:

数字
描述
等效十进制数字
.0001、0.0001、1e-4、1.0e-4
四个等效的浮点数字。
0.0001
3.45e2
浮点数。
345
45
一个 Integer。
45
0378
一个 Integer。  虽然此值看上去像一个八进制数字(因为以零开头),但 8 不是有效的八进制数字,因此将被视为十进制数字。  
378
0377
一个八进制整数。  注意:虽然它看上去只比上面那个数字小 1,但它们的实际值相差甚远。  
255
0.0001
一个浮点数字。  即使此值以零开头,它也不是八进制数字,因为它有小数点。  
0.0001
00.0001
这是一个错误。  两个前导零将数字标记为八进制数字,但八进制数字不能有小数部分。  
N/A(编译器错误)
0Xff
十六进制整数。
255
0x37CF
十六进制整数。
14287
0x3e7
十六进制整数。  注意:“e”不被视为幂。  
999
0x3.45e2
这是一个错误。  十六进制数字不能有小数部分。  
N/A(编译器错误)
运算符优先级

运算符
说明
.[ ] ( )
字段访问、数组索引、函数调用和表达式分组
++ -- - ~ ! delete new typeof void
一元运算符、返回数据类型、对象创建、未定义的值
* / %
相乘、相除、求余数
+ - +
相加、相减、字符串串联
<< >> >>>
移位
< <= > >= instanceof
小于、小于或等于、大于、大于或等于、是否为特定类的实例
== != === !==
相等、不相等、全等,不全等
&
按位“与”
^
按位“异或”
|
按位“或”
&&
逻辑“与”
||
逻辑“或”
?:
条件运算
= OP=
赋值、赋值运算(如 += 和 &=)
,
多个计算
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐