JavaScript note 01_ basic operations

Location code written 1. JS

  1. onclick attribute label
  2. Hyperlink href attribute
  3. script tag
  4. JS external file
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>JS代码编写的位置</title>
        <script type="text/javascript">
            <!-- 3. 可以将JS代码写在script标签中 , 加载页面立即执行-->
            alert('我是script标签中的代码!!!');
            
        </script>
        
        <!-- 4. 可以将JS代码写在JS外部文件中,需要使用script标签的src属性引用 
            注意:script标签一旦用于引入外部文件了,就不能在编写代码了。即使编写了浏览器也会忽略
            如果需要则可以在创建一个新的script标签用于编写内部代码
        -->
        <script type="text/javascript" src="js/scipt.js" ></script>
    </head>
    <body>
        
        <!-- 1. 可以将JS代码编写到标签的onclick属性中, 点击按钮执行代码 -->
        <button onclick="alert('弹窗');"></button>
        
        <!-- 2. 可以将JS代码写在超链接的href属性中, 点击超链接时执行代码 -->
        <a href="javascript:alert('弹窗2');">这是一个超链接</a>
        
        <!-- 下面的代码常用来控制一个链接点击之后没有反应的情况-->
        <a href="javascript:;">这是一个超链接</a>
        
        <!-- 虽然可以卸载标签的属性中, 但是他们属于结构和行为耦合, 不方便维护, 不推荐使用  -->
        
        
    </body>
</html>

scipt.js

alert("我是JS外部文件中的代码!!!");

2. Why JavaScript code should end with a semicolon

If you do not add a semicolon, the browser will automatically add, but will consume some system resources, sometimes, the browser will add a semicolon wrong, resulting in operational errors.

3. literals and variables

Literal: it is some value can not be changed, such as 1, 2, 4, 5; literals can be directly used, but we generally do not use the literals directly.

Variables: variables are used to hold the literal, and the value of the variable can be arbitrarily changed. We variable is more convenient to use, so development is going to save a literal by variable, but rarely used directly literal.

4. Data Type

  1. The basic data types: String, Number, Boolean, Null, Undefined
  2. Reference data types: Object
  3. Use typeof 变量can test a variable of type
  4. NaNIs a special number that represents Not A Number, a test using typeof NaN also returns number
  5. If JavaScript for floating-point operations, may give an inaccurate result.
  6. Null value of only one type, is null, the null value is designed to indicate a null object, use typeof check for null values, returns Object.
  7. Undefined value of only one type is undefined, when you declare a variable, but does not assign values ​​to variables when his value is undefined, undefined is returned when a check using typeof undefined.

5. Type installed for

  • Other types into a String
    • One way: calls are converted to data type toString () method. This method does not affect the original variables, null and undefined not the method.
    • Second way: Using the String () function, and the converted data is passed to the function as an argument.
  • Other types of conversion bit Number Type

    • Method 1: Use Number () function

      If it is purely digital string, is directly translated digits; if the content of non-numeric string, the bit conversion NaN3; If the string is a null string is a space or a full character string is converted to 0; true Switch 1, false Switch 0; null Switch 0; undefined NaN3 to digital;

    • Second way: parseInt () and parseFloat () function, designed to convert string, if the non-variable of type String will be converted to another operation String;

6. ++ a sum a ++

A ++ a value equal to the value of the original variable (value before increment)

++ a value equal to the new value of the original variable (from the increased value)

var d = 20;

// 20 + 22 + 22
var result = d++ + ++d + d;
console.log("result = " + result);

var e = 20
e = e++;
console.log("e = " + e);//20

a-- equals the value of the original variable (value before decrementing)

--A value equal to the new value of the original variable (decrementing value)

var n1 = 10, n2 = 20;

var n = n1++;           //n1 = 11  n1++ = 10
console.log('n=' + n);  //10
console.log('n1=' + n1);//11
n = ++n1;               //n1 = 12;  ++n1 = 12
console.log('n=' + n);  //12
console.log('n1=' + n1);    //12

n = n2--;                   //n2 = 19  n2-- = 20
console.log('n=' + n);      //20
console.log('n1=' + n2);    //19
n = --n2;               //n2 = 18 --n2 = 18
console.log('n=' + n);      //18
console.log('n2=' + n2);    //18

7. Logical Operators

JS provides three logical operators for us

  1. ! Non
    ! Value may be used for a non-operation. The so-called non-operation is a Boolean value to be inverted operation, true becomes false, false becomes true. If a value of twice negated, it will not change. If the elements of the non-Boolean value, then converts it to a Boolean value, and then negated. So we can use this feature to a different data type to a Boolean value. May be taken twice a trans to any data type, to be converted to a Boolean value, principle and Boolean () function is the same.

  2. And &&
    && may be made to both sides of the symbol value and returns the result of calculation, the arithmetic rule:
    two values as long as there is a false return value is false, only two values are true, will return true. JS in "with" and belonging to a short circuit, if the first value is false, will not see the second value.

  3. Or ||
    || can be symbol values or both sides of the operation and return the result, the arithmetic rule:
    two values as long as there is a true, it returns true. If both values are false, it returns false. JS in "or" belongs to, or a short circuit. If the first value is true, the second value is not checked.

  4. Non-Boolean value && ||

When the non-boolean OR operation for, will first convert it to a Boolean value, then operation returns the original value and

  • And operation:
    If the first value is true, inevitably returns the second value
    if the first value is false, the direct return of a value
  • OR operation:
    if the first value is true, a direct return to the first value
    if the first value is false, the second value is returned
//与运算:如果两个值都为true,则返回后边的;如果两个值中有false,则返回靠前的false
var result = 5 && 6;

//如果第一个值为true,则直接返回第一个值
result = 2 || 1;
result = 2 || NaN;
result = 2 || 0;

//如果第一个值为false,则直接返回第二个值
result = NaN || 1;
result = NaN || 0;

8. equality operators

/*
* 相等运算符用来比较两个值是否相等,
*   如果相等会返回true,否则返回false
* 
* 使用 == 来做相等运算
*   - 当使用==来比较两个值时,如果值的类型不同,
*       则会自动进行类型转换,将其转换为相同的类型
*       然后在比较
* 不相等
*    不相等用来判断两个值是否不相等,如果不相等返回true,否则返回false
*   - 使用 != 来做不相等运算
*   - 不相等也会对变量进行自动的类型转换,如果转换后相等它也会返回false
* 
*       
*  ===
*       全等
*       - 用来判断两个值是否全等,它和相等类似,不同的是它不会做自动的类型转换
*           如果两个值的类型不同,直接返回false
*   !==
*       不全等
*       - 用来判断两个值是否不全等,和不等类似,不同的是它不会做自动的类型转换
*           如果两个值的类型不同,直接返回true

9. The special value undefined, null comparison and determination, and NaN

undefined derived from null, so do the two values ​​are equal is determined, it will return true;

console.log(undefined == null); //true

NaN is not equal to any value, including his own. Accordingly, it is judged whether the value is a NaN, the need for means isNaN function ();

var a = NaN;

console.log(a == NaN);//false

console.log(isNaN(a));//true;

10. Object

1. Basic concepts:

Data Types in JavaScript are String, Number, Boolean, Null, Undefined five basic data types. As long as the above five types are Object object type.

The basic data types are no link between a single value, value and value. Objects belonging to a composite data type, the object can be stored in a plurality of different types of attributes.

2. The object classification:

① built-in objects: ES objects defined by the standards, can be used in the implementation of any of the ES; such as Math, String, Number, Boolean, Function, Object.

② host objects: JS by an object operating environment provided by the current situation mainly refers to the object provided by the browser, such as BOM, DOM.

③ custom objects: an object created by the developers themselves.

3. The basic operation of the object

New keywords using a function call, the constructor constructor. The constructor function is designed to create the object. When using typeof examination of an object, returns object.

var obj = new Object();


/*
 * 在对象中保存的值称为属性
 * 向对象添加属性
 *  语法:对象.属性名 = 属性值;
 */

//向obj中添加一个name属性
obj.name = "孙悟空";
//向obj中添加一个gender属性
obj.gender = "男";
//向obj中添加一个age属性
obj.age = 18;

/*
* 读取对象中的属性
*   语法:对象.属性名
* 
* 如果读取对象中没有的属性,不会报错而是会返回undefined
 */

console.log(obj.gender);
console.log(obj.hello);

/*
* 修改对象的属性值
*   语法:对象.属性名 = 新值
*/
obj.name = "tom";

/*
 * 删除对象的属性
 *  语法:delete 对象.属性名
*/
delete obj.name;

4. attribute names and values

When you add properties to objects, the attribute name of the object is not mandatory to follow the norms identifiers, what a mess names can be used, but we still try to do it in accordance with the specification identifier.

var obj = new Object();
            
obj.name = "孙悟空";

If you want to use a special attribute name can not be used the way, you need to use another way:

Syntax: Object [ "attribute name"] = attribute value

Also you need to read this way. Use [] property of the form to operate, more flexible, can be the occasion to pass a variable amount of [], the value of this variable is the number of properties that will be read.

obj["123"] = 789;
obj["nihao"] = "你好";
var n = "nihao";
//console.log(obj["123"]);

JavaScript object property values, may be any type of data type, or may be even an object.

obj.test = true;
obj.test = null;
obj.test = undefined;

//创建一个对象
var obj2 = new Object();
obj2.name = "猪八戒";

//将obj2设置为obj的属性
obj.test = obj2;

in operator: it can be checked by the operator whether the object contains a specified attribute, if it returns true, false if not.

Syntax: "attribute value" in the object

//检查obj中是否含有test2属性
//console.log("test2" in obj);
//console.log("test" in obj);
console.log("name" in obj);

11. The basic data types and the reference data type

The basic data types: String, Number, Boolean, Null, Undefined

Reference data types: Object

In JavaScript variables are saved to the stack memory. Value of the basic data type of the stack memory directly between the memory, and a value are independent of each other, modify the value of a variable does not affect the other variables.

Object reference type is stored in the heap memory, each create a new object, it will open up a new space in the heap memory, and is stored in the variable memory address of the object (reference object), if two variables hold that refer to the same object, when a variable by modifying properties, the other will also be affected.

When the value of the parity of the two basic types of data, is a comparison value. And when comparing the two reference data types, when he compared the memory address, if two objects are the same, but not the same address, use == will return false comparison.

12. The literal object

Create an object using the new keyword

var obj = new Object();

You can also use object literal to create an object

var obj = {}

Using object literals, you can create the object directly to the specified object attribute, the syntax:

{属性值:属性名, 属性名:属性值}

Object literal attribute names may or may not add quotation marks, without recommendation, if you want to use some special name, it must be quoted.

Guess you like

Origin www.cnblogs.com/itzhouq/p/JavaScript1.html