[js] JavaScript的"類別"用法 ~解析~

上篇主要說明了js function模擬類別的用法

細節有幾個部分可以說說

1. 宣告了function可以直接呼叫，也可以加上new當作建構式來用
    差別是this與prototype設定 (prototype介紹繼承再介紹吧)

2. 如果裡面沒有回傳值，在當作建構式使用時，會回傳this物件
    如果裡面回傳的是Primitive Data Type時，預設也會回傳this物件
    如果裡面有回傳物件，就是直接回傳新的物件

3.  當我們宣告var fn = function(){};的時候其實也是在宣告一個attribute fn
     只是它是個function object

4. 當在function中存取一個attribute
    而且如果沒有在function裡面宣告的話
    會往"外面"尋找相同名字的attribute

5. private attribute與method是利用第3,4來完成的
建立不能直接存取到的method與attribute
(硬是要應該還是可以啦 = =)

6. 第4點說的"外面"指的是外面的scope (JavaScript是以function來區分scope)
     所以會往這個function的外面的function來尋找
     而不會找本身所在的物件所擁有的function(不會從this先找起)

ex.
// 以下範例使用getCoord()
// 預設找外面的function的getCoord而不是本身物件的getCoord
var Person = function(_name, _age){
var x = 10,  
y = 15;  
var getCoord = function(){  
return "("+x+","+y+")";
};

this.name = _name,
this.age = _age,
this.moveX = function(step){
x += step;
};
this.moveY = function(step){
y += step;
};
this.getCoord = function(){
return "["+x+","+y+"]";
};
this.hi = function(){
return this.name+"在"+getCoord()+":hi!";
};
};
var p = new Person("丹丹", 18);
p.hi(); // 丹丹在(10, 15): hi!

Q. 範例的hi() 如果把this.name 改成name會如何？

A. 因為在hi()裡面找不到name所以會到Person()裡面找
但是Person()也找不到就會找global的name
應該會出現name is not defined的錯誤訊息
       but 在chrome中測試，window裡面有個神奇的name屬性
       所以.... 其實也不會出錯啦~~

       ps. 用node js測試就出現錯誤訊息啦!!!

ReferenceError: name is not defined
    at hi (repl:20:8)
    at repl:1:3
    at REPLServer.self.eval (repl.js:110:21)
    at repl.js:249:20
    at REPLServer.self.eval (repl.js:122:7)
    at Interface.<anonymous> (repl.js:239:12)
    at Interface.EventEmitter.emit (events.js:95:17)
    at Interface._onLine (readline.js:202:10)
    at Interface._line (readline.js:531:8)
    at Interface._ttyWrite (readline.js:760:14)

[js] JavaScript的"類別"用法

一般寫Java或者是其他物件導向的程式語言時
我們使用物件中的method或是attribute如果在本身物件中找不到
就會往自己的繼承來的method或者是attribute尋找

JavaScript裡面並沒有直接繼承這樣的語法，畢竟沒有類別咩~~

JavaScript首先透過function提供類似建構式的用法，更可以用來模擬類別

用法如下，介紹留待下篇講解~

建構式用法

var Person = function(){};
var p = new Person();

增加attribute

var Person = function(_name, _age){
  this.name = _name;
  this.age = _age;
};

var p = new Person("丹丹", 18);
console.log(p.name +"("+p.age+")");

增加method

var Person = function(_name, _age){
    this.name = _name;
    this.age = _age;
    this.hi = function(){
      console.log(this.name+":hi!");
    };
};

var p = new Person("丹丹", 18);
console.log(p.name +"("+p.age+")");
p.hi();

增加private attribute跟method

var Person = function(_name, _age){
  var x = 10,
y = 15;
  var getCoord = function(){
    return "("+x+","+y+")";
  };
  this.name = _name;
  this.age = _age;
  this.moveX = function(step){
    x += step;
  };
  this.moveY = function(step){
      y += step;
  };
  this.hi = function(){
    return this.name+"在"+getCoord()+":hi!";
  };
};

var p = new Person("丹丹", 18);
p.hi();  // 丹丹在(10, 15): hi!
p.moveX(5);
p.hi();  // 丹丹在(15, 15): hi!

[js] JavaScript裡面只有物件沒有類別。

一般來說想到寫OO，大概會先想寫個類別然後new一下

很開心的就可以來宣稱[這就是OO啦]

OOP的特性印象中是封裝、多型、繼承

老實說越看越感覺"說得很明確，感覺很模糊"

(好吧，討論OO下去這篇根本就歪掉了)

總之，OO其實只是我們一種組織邏輯的方式

依照職責分工、允許有各自不同的細節、實作可以重複利用等等

特性的部分應該只是歸納後的重點

分類管理做得好，大而不肥，粗中帶細，才是真正的OO啦！！！

---

與一般OO程式語言先寫Class(權責分類)再建立Object(程式重用)不同

JavaScript則是建立Object(先有能用的程式)... 然後"結束"...

例如：
var person = {
    name: "小明",
    age: "18",
    hi: function(){
        console.log(name+"是個"+age+"歲的年輕人");
    }
};
person.hi();

也就是JavaScript的特性允許我們馬上開始建立能用的程式!!

其實幾行甚至一兩百行的小程式這樣寫也不是什麼大問題

問題還是出在管理上，這樣子的程式越來越多，一天有個幾百行，一個月...一年...

零散沒有組織的邏輯，只會搞死後來維護的人。


根據這樣的基礎，我們應該思考衍生出來的後續問題

該怎麼合理有效的組織js物件

如何建立物件？

如何分類物件？

如何讓很多不同的物件可以活在同一個頁面上，又彼此獨立不會相互影響？

如何讓物件是一個獨立的個體，又足夠開放給外部功能做存取？

js很有意思的!!!


回過頭來，雖然js允許我們利用不OO的方式組織程式

但是透過寫物件與一些語法的性質，我們一樣可以建立有OO感的js程式 <3

也就是說... 程式寫不好大部份還是人的問題啦...

[js] JS記錄文系列 ~start~

標題的小小start，代表著這次弱弱的決心

主要是JavaScript的一些觀念，平常實在不常用，但是就還是會用到 @"@

只好來做整理!!

目標並不是要做細節的介紹，而是整理目前覺得重要的重點，跟實際的範例

範例的部分會使用jsfiddle來幫忙

基本的框架會有jQuery, bootstrap等，主要以本人閱讀容易為準。

隨時會調整的大綱如下：

1. js裡面只有object，沒有class
2. js的物件建立模式 - 1, 2, 3, .... (這應該需要系列文，主要從javascript pattern中整理)
3. js程式的模組化模式
4. function scope
5. this
6. prototype

[css] Selector & Combinator

順手記錄下~

原來一直弄錯以為combinator也應該叫做selector但是其實不是 XDD

這種含有關係的selector應該叫做combinator(組合器？)

selector

element

  就是html tag的選擇器

  例如：html, input, p, ...

#id

  如果我們有指定id給某個element, 就是選取有著此id的element

  例如：#datalist, #menu

.class

  如果我們有指定class給某個element, 就是選取有著此class的element

id與class差別是，id在整個頁面是要唯一的，但是class不需要

(這應該可以從名字就看得出來了，但是硬是不這樣用...誰拿你有辦法？)

在bootstrap裡面就定義了很多class給我們用.btn, .table等等

  

Combinator

看到descendant 跟child都要介紹，應該很明顯有英文單字詞彙不夠的感覺。

    descendant: 子孫

    child: 孩子, 小孩

    sibling: 兄弟

明顯是想混淆我們啊!!!!!! 這樣技術會比較值錢嗎?

descendant selector

    ex. div p：選擇div裡面所有的p

child selector

   ex. div > p：選擇剛好在div下一層的p

general sibling selector

   ex. div~p：選擇div之後所有的p

adjacent sibling selector

   ex. div+p：選擇剛剛好在div之後的一個p

這裡有飯粒：

    http://jsfiddle.net/progden/gd2Lx/

    http://jsfiddle.net/progden/Mf6zT/

SQL Server 驗證 方式設定

一般剛裝好的SQL Server是不能使用帳號密碼登入的

就算設定了使用者也是一樣

下面就來介紹一下除了設定使用者(security -> login)之外的其他設定

----

1. Server的驗證模式 調整成混合模式 (需要重啟Server)

http://technet.microsoft.com/zh-tw/library/ms143705(v=sql.90).aspx

2. SQL Server Configuration Manager的"網路組態"設定啟用TCP/IP，並且在裡面的IPALL設定Port為指定的port(default=1433)

(下面這個兩個設定都有啊，保哥果然厲害!!!)
http://blog.miniasp.com/post/2007/12/28/How-to-enable-SQL-Express-TCP-IP-connection.aspx

MySQL Create User

CREATE USER 'root'@'localhost' IDENTIFIED BY 'root';

GRANT ALL PRIVILEGES ON *.* TO 'root'@'localhost' IDENTIFIED BY 'root' with grant option

ps aux

指令介紹：

ps aux | grep 'httpd' | awk '{print $2}'

ps aux：看行程

grep：篩選

awk：格式化輸出


應用：

kill $(ps aux | grep 'httpd' | awk '{print $2}')

Tomcat中createNewFile發生錯誤

Tomcat中createNewFile發生錯誤

<Item>

寫檔案 createNewFile() 發生exception

發現是Tomcat安裝路徑含有空白

<Solve>

可以透過移動Tomcat安裝路徑來解決

但是 直接一點的解法 應該是需要控制tomcat 或是 java中resource的存取

在研究...

<Ref>

ref: http://www.coderanch.com/t/554674/java/java/Create-file-spaces-file-path

增加sudo權限給使用者

情境

指定帳號給他執行sudo的權限

需求

1. root帳號

2. visudo

步驟

1. 利用root登入 或是 其他有權限的使用者

2. 輸入 visudo，會自動開啟vi，在裡面找到 

        root    ALL=(ALL)    ALL

3. 在這個區塊輸入指定的username，並設定權限如下

        username    ALL=(ALL)    ALL

4. :wq! 存檔， 指定的user已經可以使用sudo囉！